How to prepare an image for the internet

[helmut]

You might want to send an image to another person via e-mail or place your image on a webpage. This is easy to do, but you should make sure that the image is suitable for the internet.

Why prepare images for the internet?
When exchanging information in the internet, connections with various bandwiths are used. As you know (and probably experienced) there's slow and fast internet connections. So when exchanging information, it is a good idea to reduce the volume of data, in your case the (memory) size of your image.

Images taken with digitial cameras, nowadays have resolutions of 2 Mio. pixels and often more. This is good and needed for printing, but for viewing the image on a screen, these are far too much. Screen dimensions are often about 1024 x 768 pixel, so about 500.000 to 800.000 pixel are sufficient for viewing on a screen. So it's a very good idea to reduce the dimensions (width & height) of your image and at the same time reduce the (memory) size.

Step 1: Resize the image
It is assumed that you have taken an image with your digital camera and now want to prepare it for sending to friends or place it on a webpage.

For resizing, you
a.) Start XnView
b.) Open the image
c.) Select menu "Image > Resize"
d.) Specify the new image dimensions.
e.) Choose the resampling algorithm. For images, Lanczos gives best results. For screenshots or images with text in it please read post How to resize images with text (screenshots)?
f.) Select "OK" button
g.) Zoom your image to 100% size and see whether the new size is o.k. If yes, you're done. If no, just undo the resize with menu "Edit > Undo" and start with c.), again.

Note:
In HTML, you could explicitely set width and height (e.g. <img source="img\myimage.gif" width="20" height="20">, but this is not recommended, since the user has to download a large image and sees only a small one.

Step 2: Save the image
All that is left to do is saving your image. If your original image stems from a digital camera, the JPG format is recommended for saving. Proceed like this:
a.) Select menu "File > Save as..."
b.) Select JPG as file format. (if not set, already)
c.) If your visitors should see the images building up while loading, you can open the options using "Options" button and select "Interleaved" for the GIF format or "Progressive" for the JPG format. Please note that your images will be a bit larger in file size.
c.) Specify a file name (or keep the existing one, but make sure your original file is not overwritten, unless you really want to loose your original).
d.) Select "OK"
XnView will save the image.

Now your image is prepared and you can send it to a friend or use it in a web page.

Notes:
- If you want to prepare several images at a time, the Batch conversion of XnView is recommended. See the XnView Online help for more details.
- Post 'How to resize images with text (screenshots)?' might also be interesting.
- XnView DeLuxe supports sending images via e-mail and reducing size in one step.