Minimizing GIF File Sizes

When you are designing and producing graphics for the Web, it is of utmost importance to keep your file sizes as small as possible. The standard guideline for estimating download time over a modem is 1 second per kilobyte. Of course, actual download times will vary widely, but it at least gives you a ballpark number to use for comparisons.

There are a few simple strategies you can follow to minimize the size of your GIF files.

Design Strategies

You can help keep file size under control by the design decisions you make. After a while, designing for the Web becomes second nature.

Limit dimensions

Though it may seem obvious, the easiest way to keep file size down is to limit the dimensions of your graphic. There aren’t any numerical guidelines here; just don’t make graphics larger than they need to be.

  • Scale large images down (see Section 3.2.5.2 in Chapter 3).

  • Crop out any extra space around the important areas of your image.

  • Avoid large graphics if they are not absolutely necessary.

Design with flat color

You can make design decisions that will take advantage of the way GIF compresses files. If you design your graphics with flat color from the beginning, you are basically giving the LZW compression the kind of file it likes—rows of repetitive pixel colors.

  • Fill areas with solid colors rather than gradients (fades from one color to another).

  • Limit the amount of photographic material in your GIFs (use JPEGs for photo images).

  • Favor horizontal fields of color ...

Get Web Design in a Nutshell now with the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.