HTML 4.0 Sourcebook
(Publisher: John Wiley & Sons, Inc.)
Author(s): Ian S. Graham
ISBN: 0471257249
Publication Date: 04/01/98

Interlaced GIF Images

The GIF format stores images as a sequence of thin (1 pixel high) horizontal strips. Usually these are stored one after the other, so that when a browser receives an image file, it receives the first (top) strip, followed by the second, the third, and so on. If your browser displays the image as it is being downloaded, the image appears to “wipe” in, starting at the top and wiping downwards.

However, as you have certainly noticed, this does not always happen. Sometimes the image opens rather like a venetian blind—a rough outline of the image appears first and detail is gradually added. This occurs due to an optional GIF89 feature called interlacing. With interlaced GIF images, the strips are stored in nonconsecutive order. For example, the strips might be stored in the order 1, 11, 21, 31, 41, and so on, followed by 2, 12, 22, et cetera. A rough outline of the image is obtained from the first batch of slices, while subsequent batches fill in the gaps and refine the image. In the end, both kinds of images take nearly the same time to arrive, but to the user the presentation of an interlaced GIF can be more appealing, since the outline of the entire image appears more quickly. However, interlaced images are slightly larger than non-interlaced ones. Whether or not they are appropriate then depends on the nature of the image and speed requirements.

Most standard image processing programs, including those mentioned at the beginning of this section, are capable of producing interlaced GIFs. The image processing tool GIFtool, described later in this chapter, can add interlacing to your GIF images should your other tools not be able to do so.

Transparent GIF Images

Unlike X-Bitmaps, GIF images have no implicit transparent color. This is inconvenient if the image is simply a black-and-white logo, a colored bullet on a plain background, or an equation to be presented inline with the text. Fortunately, the GIF89 format lets you declare one of the color indexes as transparent—as with X-Bitmaps, these transparent pixels let the background underlying the pixel show through. For this to be useful, you must find the color index value corresponding to the color you want to make transparent (usually the background) and use a program to modify the image file and make this color transparent. Some ways of doing this are outlined in the following sections.

Transparency (Macintosh)

Aaron Giles of Cornell University Medical College has developed an elegantly useful program called transparency, which is a simple graphical tool for editing GIF images and making one of the colors transparent.

You operate transparency either by dragging a file to the program icon or by double-clicking on the icon and opening the desired GIF image file. To select the transparency color, you simply place the mouse pointer inside the image and hold down the mouse button. You are presented with the color palette for the image and can select the color you wish to make transparent by putting the mouse pointer over the desired color and releasing the button. You can choose to have no transparent color by selecting the “NONE” bar at the top of the palette. Upon releasing the mouse button, there is a short pause, after which the image is redrawn with the selected color rendered transparently. You now select the “Save as GIF89 . . .” menu from the pull-down File menu to save the newly transparent version.

Transparency is available at a number of anonymous FTP sites, including:

ftp://uiarchive.cso.uiuc.edu/pub/systems/mac/info-mac/gst/grf/transparency-10.hqx

ftp://ftp.uwtc.washington.edu/pub/Mac/Graphics/

Giftrans (UNIX and PC-DOS)

Giftrans is a simple command-line C-language program, written by Andreas Ley, that can convert any GIF files into the GIF89A format, making one of the colors transparent in the process. Giftrans is available in source code (for compilation on any platform, but most specifically for UNIX workstations) and as an executable program for PCs running DOS or a DOS session under Windows.

Typically, giftrans is used as follows

giftrans -t xx image.gif > transp_image.gif

which translates the file image.gif into transp_image.gif and makes the color labeled by xx transparent. There are several ways of labeling the color, the most common being:

•  Specify the absolute RGB value for the color (as a 24-bit RGB value). For example, the command

    giftrans -t #ffffff image.gif > transp_image.gif

makes the color white transparent (ffffff is the RGB code for white).

•  Specify the color index value. For example, the command

   giftrans -t 21 image.gif > transp_image.gif

makes the color found in color index 21 transparent.

How do you find the color index or RGB value of the color you want transparent? To find this information, you need a graphics program that can tell you the color indices or RGB values for a given pixel. Several shareware graphics programs can do this—xv is a common UNIX program suitable for this task. With xv, you load the image file, place the mouse over the desired color, and depress the left mouse button. This gives the mouse coordinates with respect to the upper left-hand corner of the image, plus color information for the pixel. This is presented in the following format:

132, 34  5 = 203, 203, 203 (0, 1, 79 HSV)

The first two numbers are the x and y coordinates of the pixel. The number just before the equals sign is the color index, while the next three numbers are the RGB values for this color (in decimal numbers). The numbers in parentheses are an alternate color coding scheme. Similar information is available from common tools for PC (Paint Shop Pro, PhotoShop, Corel Draw) and Macintosh (Graphic Converter, PhotoShop, etc.).

Now that you know the color you want to make transparent, giftrans provides two ways to do so—using the color index:

giftrans -t 5 image.gif > transparent_image.gif

or the RGB value:

giftrans -t #cbcbcb image.gif > transparent_image.gif