Let's say you're working on a new web site, and you're not sure which graphics format to use. Basically you have three families of graphics formats to choose from: GIF, JPEG and PNG. But how to choose the appropriate one?

Well, there are a number of issues, mostly to do with the limitations of each format. Firstly, legal issues. There is a United States patent on the LZW compression used in GIF, held by Unisys (aside: this was a dodgy move by Unisys ... it was a submarine patent). So if you're in the US, theoretically you have to pay Unisys a licensing fee. Outside the United States, your mileage may vary. In Australia, for instance, it's not a problem. However, the legal thing urks many people, especially geeks who are moving away from GIFs to PNGs because of this reason.

GIFs are good for diagrams, drawings with straight lines, or rendered text without too much feathering. However, GIFs are limited to 256 colours (from a palette of 17 million). Almost everything you can do with GIFs, you can do with PNGs with similar performance. However, there are two things you can't really use PNGs for:

  • Transparency: Although the PNG standard supports transparency, most modern browsers don't support it.
  • Animation: GIFs support animations as well. Again, PNGs do too, it' just that nobody supports it.
JPEGs (actually to be exact JFIFs (JPEG file interchange format) are good for photographs and anything with smooth gradations. They have a full palette of 17 million colours available to them. However, they suck for anything with sharp edges, like text, diagrams etc. This is because of the way that they work. JPEG uses a discrete cosine transform, which means that due to the Gibbs phenomena, sharp edges don't come out too well, with blurring and random colours either side of sharp changes in colour. However, for a given file size for photographs, JPEGs will beat GIFs any time. Also, JPEG is a lossy image format, if you need pixel-for-pixel exact reproduction of the original image (e.g. you're giving the image to someone to use for a poster), you should not use JPEG. Some image tools actually allow you to trade off quality of the image for the compression ratio, and there is a rarely used lossless JPEG mode.

PNGs are still a bit of a dark horse. They can do most things that GIFs can do (with the exceptions mentioned above), but they can also encode images with more colours than GIFs. You can choose whether you want 8-bit (256 colours), 16-bit (65,000 colours), or 24-bit (17 million colour) images. It even supports both lossy and lossless compression, though it does not offer the compression ratio of JPEG, even in lossy mode. But they don't suffer the nasty side-effects of the JPEG encoding either -- they can handle sharp edges just fine. This makes PNG a good transfer medium. The problem is that most image tools and browsers don't fully support the PNG format.