Posted: 20 July 01 | Last modified: 20 July 01
While there are no universal truths dictating when to use GIF or JPEG, you should tend to use GIF when working with text and geometric shapes or if you need transparency, but tend to use JPEG when working with continuous tone images. Of course, the licensing issues with GIF complicate the issue even more.
The GIF file format is based on LZW compression patented by Unisys. Oversimplifying the concept, LZW compression works best when data patterns are repeated. For example, if there are large areas of the image that are a single color, then the color is being repeated, therefore LZW compression will work very well.
The color palette for GIF is limited to 256 colors. Different programs deal with this problem in different ways, but dithering is usually part of the solution.
There may by legal/licensing issues regarding the use of GIF formatted images on your web pages. I am not a lawyer and I am not offering any advice or opinion on this topic. Unisys has an article on their website is more confusing than clarifying.
The Joint Photographic Experts Group developed the JPEG format to produce standards for continuous tone image coding. In other words, they produce standards for files (and the programs that read and create those files) that have lots of different colors and shades. As opposed to image files that use few colors, such as cartoon art.
JPEG also uses compression, but chooses amongst different methods based on the program that creates the image.
The color palette for JPEG is 24-bit (vs. 8-bit for GIF). You will find this referred to as true color sometimes.
In general, use GIF for hard edges, such as geometric shapes and text.
| Image 1 | Image 2 |
| GIF | JPEG |
JPEG cannot have transparency; GIF can. Transparency allows you to specify that certain parts of the image have no color. The color of the element that contains the GIF will be visible wherever the GIF is marked as transparent.
Image 1 has a transparent area and therefore looks more integrated with the table. (The table is the entity that contains the GIF. I added bgcolor="black" to the two table cells containing the images. This was to force a contrasting background color to the image.) The JPEG version has a border of white because it cannot preserve transparency.
Since most photographs are sophisticated enough to have continuous tone, a good rule of thumb is to use JPEG for your photos.
Please leave a small tip in the tip jar if you learned something.
Send an email to comments@hunterthinks.com.