GIF vs. JPEG GIF and JPEG (JPG) image formats are different. You should know which to use when. Here are some examples.

There are different types of image files. You'll get the best results if you know which type to use when.Web browsers mainly support two different image formats: GIF (pronounced "Jiff") and JPG (also known as JPEG, and pronounced "JAY-peg"). These formats refer to methods for compressing the information that describes the images.

GIF GIF is best for images that have solid colors, text, and line art. It is good for computer-generated images, such as those produced by a drawing program like Corel Draw. It is also best when the image has detail, like text, where every pixel (dot on the screen) counts. It does well with images that are made up of a limited number of colors. It does not compress photographs very well, especially images that show texture or color gradations, or that are 24-bit color. GIF is a "lossless" form of compression. Every pixel in the original image is preserved. GIFs are rarely used for large images on web pages because the benefits of no-loss are not visible to all but the most technical of viewers, but the huge differences in file size, and therefore download time, are noticeable to all.

JPG (JPEG) JPG is best for photographs, and scanned photographs, of natural images. JPG gets its good compression by doing approximations, and is not as good for images where every pixel counts, or when you can get compression by using less than 24-bit color. It is usually a "lossy" compression, where you do not get back every pixel exactly as it was in the original image. There are different levels of JPG compression, ranging from little loss of detail and poor compression ("higher quality") to possible loss of detail with great compression ("lower quality"). On web sites, it's often best to use the greater compression, even if it means loss of detail ("lower quality") because it saves download time. The software you use to edit or scan your images often has a setting to control the JPG quality. You can always link the low quality image to another page with a higher quality, perhaps larger, image for people who want to print out as good a copy as possible.

So GIF is better for solid colors, exact detail, and small text. JPG may lose the details and is often bigger.

GIF 1,542 bytes This is an example of using a GIF for line art. It is compressed well and rendered well.

JPG 5,433 bytes This is an example of using a JPG inappropriately for line art. Note the loss of detail and poor compression.

JPG is better for photographs. The same picture as a GIF will probably be bigger (therefore take longer to load in a browser) and look no better or worse.

GIF 30,327 bytes About 10seconds to This is an example of using a GIF for a photograph. Note the poor compression (almost 2 times bigger than the JPG), and 8-bit 256-color image.

JPG 15,996 bytes About 6seconds to This is an example of using a JPG for the same photograph. Note the good compression and 24-bit, full- color image. (You will see the color difference best on a PC with a video card displaying more than 256 colors).

Thank you for watching