RedGrittyBrick

Image File Formats

Choice

Some people say that JPEG is always better than GIF.

To me, with these images, GIF gives as good quality as JPEG. Even for photos! For plain text or flat-colour drawings, GIF gives a better quality result. GIF is nearly always smaller than uncompressed JPEG. Compressed JPG wins on size (not quality) for these photographic images.

Conclusion

Don’t use JPEG for text! Use JPEG for photos.

Formats

GIF

Oldest. Only 256 colours. Transparency. Animation. Patent issues.

JPG

Lossy. No transparency. No animation. Designed for photos.

PNG

Latest. Alpha transparency. Lossless.

Examples

When you create a JPEG file you can specify an image-quality or compression-factor. A higher compression-factor leads to smaller JPEG files but with a poorer visual quality. In the images below, 100% means uncompressed, 75% means compressed for smaller size at the expense of poorer quality images.

Text on flat background

JPEG 100% (4736 bytes)
JPEG 100% (4736 bytes)
JPEG 75% (1713 bytes)
JPEG 75% (1713 bytes)
GIF (3904 bytes)
GIF (3904 bytes)
PNG 100% (764 bytes)
PNG 100% (764 bytes)

The JPEG versions have fuzzy letters and the smaller jpeg shows some unpleasant artifacts in the background. Overall the GIF image is better quality than JPEG, PNG is equally good and is a lot smaller than JPEG or GIF

Text on graduated background

JPEG 100% (7478 bytes)
JPEG 100% (7478 bytes)
JPEG 75% (2791 bytes)
JPEG 75% (2791 bytes)
GIF (5182 bytes)
GIF (5182 bytes)
PNG 100% (4172 bytes)
PNG 100% (4172 bytes)

This time the compressed JPEG wins on size. However there is still a muddiness in the background. The GIF and PNG give good sharp text. PNG wins on size and quality.

Computer Generated Image

JPEG 100% (16132)
JPEG 100% (16132)
JPEG 75% (3975)
JPEG 75% (3975)
GIF (13464)
GIF (13464)
PNG 100% (12182)
PNG 100% (12182)

They all look the same to me. I’m surprised that GIF doesn’t look noticeably poorer than JPEG. JPEG wins on size.

Photographic Image

JPEG 100%
JPEG 100%
JPEG 75%
JPEG 75%
GIF
GIF
PNG 100%
PNG 100%

Again, there’s nothing in it as far as image quality is concerned. GIF looks as good as JPEG. JPEG wins on size.

Photographic Image

JPEG 100%
JPEG 100%
JPEG 75%
JPEG 75%
GIF
GIF
PNG 100%
PNG 100%

Again, there’s nothing in it as far as image quality is concerned. GIF looks as good as JPEG. JPEG wins on size.

Images created with Xara Webster