file formats - jpg, gif

Image Format Comparison

GIF and JPG are the two image formats currently in wide use on the Internet. Which format should you use? The answer is - Both. Your selection of the format type depends on the type of image you are displaying, and what you wish to accomplish. How do you know which format to use and when? We'll tell you about the two formats, the pros and cons and then you'll be able to make the intelligent choice for the image formats that you want to use on your web pages.

The other factor to consider in working with these two formats is your fluency with image editors. You'll need to learn how to use some of the various image editors on the market.

Image Formats

JPG (Joint Photographic Experts Group)
The JPG format supports a palette of over 16 million colors. This allows for high quality photographic images, but that large a palette could make for huge file sizes, which is unacceptable on the Web. JPG takes care of this problem by compressing the files, but JPG's compression involves loss of data. The more you compress the image, the more quality loss you get. You need to experiment with each file to see how much you can compress it before the quality degrades too much. Still, it works wonderfully for photographic images.
For images that have less color complexity (charts, buttons, etc.), the compression is less effective. There aren't as many places to "hide" the quality loss...the images are too simple and the degradation of the image too obvious.

GIF (Compuserve Graphics Image Format)
At the most, GIF images can be only 256 different colors, so right away it looks like JPG has an advantage. But it is the fact that you can use less colors that makes GIF attractive at times. With GIF you can reduce the palette to suit the image. So, if your chorus has a logo that has only 2 or 3 colors in it, you can reduce the number of colors in the image's palette, and make the image much smaller - without the degradation in quality because compression is not necessary.
I used this technique on some of the images used on this site. "The Basics" as a JPG was 5k, while the 4 bit (16 color) GIF is only 1.6k - with no quality loss. "Links" was 4.2k as a JPG and is less than 1k as a 4 bit GIF.
Another advantage GIF has over JPG is its ability to do transparencies. If you don't know what a transparency is, look at this sample. You can obtain effects using GIF's transparency that you cannot with JPG.
There is some controversy and confusion over how to pronounce it. Some say it with a G sound, like "gift", and some use a J sound, like "giraffe". I prefer to use the J sound, as the creator of the format used the J sound and coined the joke, "Choosy programmers choose GIF."


For photographs use JPG - its larger palette and compression style make it the best choice for photos.
If you want a special effect transparency, you'll obviously need to use GIF.
For logos with few colors, try using GIF and reducing the number of colors in the palette. By experimenting, you'll be able to reduce the size and not lose any image quality at all.
For images with a larger number of colors (shading, color gradients, etc.), try both. Experiment with different palette sizes with GIF and different compression levels with JPG and see which gives you the highest quality at the smallest size.
It's not a black and white choice. You simply must take a little time to experiment with your particular images and see which works best. But this basic knowledge of the formats should help lessen the experimentation time, and increase the final quality of your images.

Home       Portfolio