Minimizing GIF File Sizes 279
GIF
Minimizing GIF File Sizes
Web Design in a Nutshell, eMatter Edition
survive a reduction to 5-bit color (just 32 pixel colors). Of course, the bit-depth at
which the image quality becomes unacceptable depends on the specific image and
on your personal preferences.
Reducing the number of colors actually works in two ways. First, clusters of simi-
larly colored pixels suddenly become the same color, creating more pockets of
repeating pixels for LZW compression to work on. For that reason, fewer image
colors take better advantage of GIF’s compression scheme, resulting in smaller
files.
Also, lower bit depths require less actual data to describe the colors in the image.
Even if no pixels change color, a 5-bit graphic file will be smaller than an 8-bit
version of the same image.
Limit Dithering
When a true color image is reduced to an Indexed color palette of only 256 colors,
dithering usually occurs.Ditheringis the random dot pattern that results when
colors are approximated by mixing similar and available colors from a limited
palette. Dithering is relevant to GIF file size because it interrupts the clean areas of
flat color that are conducive to efficient LZW compression, and can make the file
size larger than it needs to be.
Bear in mind, however, that dithering also enables you to maintain image quality
and character at lower bit depths, and in this respect can be considered an effi-
cient optimization tool. Lower bit depths generally result in smaller file sizes.
If you are serious about optimizing your GIFs, you can approach the challenge at
the pixel level and control the dithering in your image. Dithering options are
addressed where applicable in the following tools section.
Tools for Optimizing GIFs
Although Adobe Photoshop offers basic controls for minimizing GIF files, a new
breed of tools has arrived that have been built specifically for the creation of web
graphics. Not surprisingly, optimization is a key feature of each of them. This
section looks at some available techniques and tools for slimming your GIFs with
special attention paid to reducing bit-depth and adjusting dithering.
Adobe Photoshop (4.0 and 5.0)
Photoshop allows you to reduce the bit-depth (number of colors) in the Adaptive
Palette only, at which time it gives you the option of 2- through 8-bit encoding.
Once a custom palette is specified (such as the Web Palette), the bit-depth control
is disabled.
This trick for reducing the number of colors in a Web Palette image requires three
steps:
- Convert the file to Indexed Color using the Web Palette, thus ensuring that all
the colors in the image are browser-safe. - Convert the image to RGB format.