GIF vs. JPG vs. PNG

Excerpted from "Cheap Web Tricks: Build and Promote a Successful Web Site Without Spending a Dime" by Anne Martinez. Copyright (c) 2001, Anne Martinez. Reproduced with permission of the McGraw-Hill Companies, Inc.

As you continue your journey into webmasterhood, you're going to discover that graphical images used on Web pages come in one of three varieties: GIF, JPG, or PNG. Which format a particular image uses is apparent in its file name, which will end in either .gif, .jpg, or .png (for example, myphoto.jpg).

NOTE: In 1995 UNISYS announced that it holds the patent on the compression algorithm used in the GIF file format and would require people to pay licensing fees for the privilege of using it. Despite dire warnings from uninformed Web page authors claiming otherwise, this doesn't mean that anyone who creates or uses a GIF image has to pay royalties. It's authors of programs that output GIF images that are on the hook.

When you create an image for use on your site, you will have to choose which format that image will utilize. How do you decide? In a nutshell, GIF files (GIF stands for Graphics Interchange Format) are best for images with fewer, more distinct colors. It's best for line art and simple icons. It also supports animation graphics. The JPG (aka JPEG for Joint Photographics Expert Group) format allows more colors (including shades of gray). It works best for photographs and photolike images. GIF (pronounced "jiff" or "giff") and JPG (pronounced "jay-peg") are the most widely used image formats on the Web.

PNG (pronounced "ping") stands for Portable Network Graphics. It's the latest graphics file format, and for that reason not all browsers support it fully. It's also much less widely used, but it may become more popular. It was created as an alternative to GIF, and offers more features that mostly propeller-heads care about. The rest of us will probably benefit from it too if it becomes widely accepted, but for now, GIF and JPG are still the way to go for most of us. The following table summarizes the differences between these formats.

Format Uses

GIF Images with a few distinct colors, including line art and simple colors. Supports animation.

JPG Images with lots of colors and or shades, such as photos and lifelike images. No animation.

PNG Upcoming format. Combines best features of GIF and JPG. Use sparingly for now, but keep an eye on it for future use.

If you don't choose the ideal format, it's not a disaster. What will happen is that your file will probably be larger than necessary, which means it will take longer to download. It's also likely that your image will not be as sharp and distinct as it could be.
###

HOME articles tutorials tool directory training books about