Image Types

Overview of the types of image commonly used on the web

There are three primary types of image that are used:

  • JPEG - used for complex images such as photos.
  • GIF - have a limited set of colours so are useful for logos and simple graphics. They should not be used for colour photos. They can also support transparency and simple animations.
  • PNG - an Indexed PNG is a better alternative to GIF. It supports transparency and more colours. The 'Full Colour' option (select when saving) is an alternative to JPEG and provides higher quality but bigger file-sizes as the compression is non-lossy.

JPEG Images

JPEG images use lossy compression to keep the file-size down. This means that data from the image is lost each time it is saved. The more you compress, the smaller the file-size but the poorer quality the image. When saving a JPEG, to get the best quality, maximise the compression for your target file-size.

Avoid continually resaving JPEG images as each time you save, information will be lost from the image as it is compressed.

JPEG images can store metadata within the image file. This is used to store things like the coordinates of the camera when the photo was taken, the aperture, shutter speed, focal length, timestamp etc. However this is not normally used by mainstream website images.