Operation Manual

54 Working with Graphics, Animation, and Multimedia
Is there anything you can do to reduce the total size of your graphics,
aside from using fewer graphics? An obvious suggestion is to make
them no larger than they need to be to get your point across. Since file
size increases as the square of each dimension, shrinking both height
and width by 50% reduces the file size by 75%.
If you save graphics as GIFs (see above), you can take advantage of the
fact that GIFs, unlike most other 256-color (8-bits-per-pixel “bit
depth”) formats, don’t insist on using 8-bit pixels. If the number of
colors in the image is 128, GIFs will encode using 7 bits; with 64
colors, 6 bits, and so on. As an experiment, we tried starting with a
small image (some anti-aliased text) that only used 14 colors. With the
paint program set for 256 colors, we saved as a .GIF, yielding a file size
of 1204 bytes. After reducing the number of colors displayed in the
paint program to 16—still sufficient to display all those in the image—
we saved again, and the file size went down to 420. If you’ve got a
dozen or more small GIFs per page, those little savings can really add
up!
Paint programs handle color reduction in various ways. Some let you
set the image to either 16 or 256 colors, but not to 64 or 128; that’s still
a help if your images require 16 or fewer. Ideally, you can save with an
arbitrary number of colors, and the program will attempt to optimize
the image using that value. So you can pick any intermediate bit depth,
and find the one that works best for the specific image. To sum up:
To reduce file size, reduce the number of colors in each image, and
save as a .GIF file using the lowest acceptable bit depth your paint
program will allow.
If all this talk about image formats and bit depth has landed somewhere
slightly over your head, we have two suggestions:
(1) Spend some time with a good paint program and experiment with
the techniques introduced here.
(2) Point your Web browser to the Suggested Links in the “Web Design
from Scratch” chapter. You’ll find a wealth of advice and examples to
draw upon.
Here are a few other tips for quicker pages: Avoid large regions of
transparency. Group small objects and set your options so they’re
output as a single image. And use the correct dpi setting for images
before importing, rather than scaling large images down on the page.