To prepare an image for the Web, you need to do the following:
- Obtain it as a computer file, if it isn't already.
- Make it a sensible size (in pixels) for use on the Web.
- Convert it to one of the three commonly-used file formats.
Getting images into the computer
Normally, you get images into your computer using a scanner or a digital camera. These devices should come with software that lets you save images as computer files.
Selecting image size
You will probably need to resize images so that they fit appropriately with your design. Try to keep images as small as possible, because that will help reduce the size of the resulting file and hence the download time.
Converting to an appropriate file format
There are three file formats commonly used for images on the Web:
- JPEG (.jpg) - use this for photographs (colour or b/w) and other full-colour or grayshade images. Most programs let you select different compression levels, so keep increasing compression (and checking the result in a web browser) until it looks bad. JPGs are always stored as either 24-bit colour or 8-bit grayscale: for best results, alway use this kind of images as source, e.g. do not set your scanner to fewer colours.
- GIF (.gif) - use this for simpler images with a small number of flat colours (not continuous, shaded tones), such as computer screenshots or some types of drawing. GIFs are limited to up to 256 different colours in the image.
- PNG (.png) - these can be used in similar situations to .gif (although .png does not have the 256-colour limit) but it compresses more effectively and should result in smaller files. However, PNG files can only be viewed on version 4.0 browsers or better.