BoZine Help: Selecting Image File Formats

Tips and Techniques from Bovine Design

Selecting the Optimal Image File Format:
GIF vs. JPEG

It is vital that Web designers save images in the optimal format—that format which will produce an image with maximum quality at the minimum file size. Saving an image in a non-optimal format can dramatically increase file size and download time, as well as significantly degrade quality.

But selecting the optimal format—GIF or JPEG—can be a tricky process. Comparing image characteristics summarized in the following table should improve your odds of choosing the optimal file format without experiments.

Image format	GIF	JPEG
Acronym definition	Graphics Interchange Format	Joint Photographic Experts Group
HTML suffix	filename.GIF	filename.JPG
Compression method	Lossless: Algorithm scans for blocks of color; no part of the image is eliminated	Lossy: Algorithm uses contrast to eliminate detail
Image characteristics optimally compressed	Any image containing blocks of color, such as logos or cartoons	Any image containing significant detail and/or color transitions, such as color photographs
Transparency support (background color rendered invisible)	Available; use GIF89a Photoshop plug-in, or PhotoGIF, available through BoxTop Software and other sources	Unavailable, but rumored to be in development
Interlacing support (image focuses during loading)	Available; use GIF89a format in Photoshop	Available; use ProJPEG, available through BoxTop Software and other sources
Bit-Depth, number of colors	up to 8-bit, or 256 colors	24-bit, or millions of colors
Example, Graphic Art	GIF yields best compression because of large blocks of colors	JPEG yields best compression because of high level of detail and multiple color transitions
Example, Photograph	GIF allows for transparent background. Small file size achieved through bit-depth adjustments	JPEG yields best compression on most photographs

Most of the time, classifying the image according to the aspects presented in the above table—especially the image characteristics—will result in optimal format choices and compression. Note that in certain instances, a photo or other image containing color gradiations that normally would be optimized in the JPEG format will need to be saved as a GIF file. One such example presents itself if the designer requires a transparent background, since transparency support is not yet available for JPEG files.

But if you are still unclear about whether to save an image in the GIF or JPEG formats after using the table, try each method, then compare the files. Although the smallest file will usually produce the optimal choice, always compare image quality as well, since small files can result in quality degredation below acceptable thresholds.

Return to Help Pages Index