Graphic's Files Formats — Image Comparison Part I

The quality of an image is dependent upon the file format used to store image data. For JPEG/ JFIF files, the data compression ratio is another factor influencing image quality.

In this first example a graphic depicting some swirls and twirls and smooth colour gradients is displayed in graphic's file types JPEG/ JFIF, PNG, and GIF. Notice the considerable estrangement effect the image experiences when displayed as an indexed, i.e. with only 256 colours, PNG or GIF file. JPEG/JFIF files show noticeable loss of quality only from around 40% compression ratio downwards.

The file size of 139kB of the original image is reduced to 58.628kb, about 41.9% of the original, when choosing 24bit PNG or to 4.653kB, about 3.3% of the original when applying 60% compression choosing JPEG/JFIF.

You see, in this example the JPEG/JFIF file format is certainly the best choice with respect to file size and image quality for serving this kind of image.

Original file type: BMP file-size: 139,926 bytes colours: 34,426 palette: 24bit/16.7M colours compression ratio: - image size: 250px * 186px resolution 96 DPI fix original image to viewport and let it scroll (does not work in IE)
file type: JPG file-size: 27,720 bytes colours: 27,731 palette: 24bit/16.7M colours compression ratio: 100%	file type: JPG file-size: 6,608 bytes colours: 29,687 palette: 24bit/16.7M colours compression ratio: 80%
file type: JPG file-size: 4,653 bytes colours: 30,182 palette: 24bit/16.7M colours compression ratio: 60%	file type: JPG file-size: 3,621 bytes colours: 30,074 palette: 24bit/16.7M colours compression ratio: 40%
file type: JPG file-size: 2,511 bytes colours: 26,181 palette: 24bit/16.7M colours compression ratio: 20%	file type: JPG file-size: 967 bytes colours: 1,353 palette: 24bit/16.7M colours compression ratio: 1%
file type: PNG file-size: 58,628 bytes colours: 34,426 palette: 24bit/16.7M colours compression rate: 9	file type: PNG file-size: 25,709 bytes colours: 256 palette: 8bit/256 colours compression rate: 9
file type: GIF file-size: 22,196 bytes colours: 256 palette: 8bit/256 colours compression ratio: -