Yale C/AIM Web Style Guide




Design and AV elements

Digital Video

Digital Audio

GIF Animation

The GIF file format has an option for creating animations that provides web site designers with a low-tech option for adding moving images to web pages. The software used to create animated GIFs is free and easy to use. And since GIF is a format supported by most browser software, you can add animations to your pages with the assurance that most visitors to your site will be able to view them. However, there are two main drawbacks to using animated GIFs, the first of which is file size and the second, distraction.

How it works
The animation option combines any number of GIF still images into a single file. There are a number of animation programs that will convert your still "frames" into an animated GIF; we use a freeware program called GifBuilder. Using a simple drag-and-drop interface, we import PICT files created in PhotoShop. GifBuilder will accept an imported palette or create a custom palette, and it allows you to set frame durations, transparency, and playback options such as looping. Once we have set all the parameters and previewed the animation, we save the file, at which point GifBuilder packages the still images together as a single animated GIF.

How much it weighs
Bandwidth is an important consideration when creating animated GIFs. Since this is an uncompressed file format, each frame in the animation carries its full weight, so if you have 10 frames of 10k PICTs, you end up with a 100k file to push through the wire. However, since animated GIFs do "stream" in the sense that they begin to play before they are fully downloaded, there is some flexibility. It may be too much to ask viewers to wait for a 100k GIF still image to load, but a 100k GIF animation that begins to play after 40k has loaded is certainly reasonable.
Enhancement or distraction?
Animation should be meaningful, not distracting. Ideally, it should add something to the content of your page. What it definitely should not do is disrupt your reader's concentration with needless chatter.
Splash screens are a good place to use animation. Animated images can provide just the right amount of pizzazz to attract viewers into your site. But be sure to keep the file size modest. Requiring a lengthy download right at the start of your site will lose all but the most committed viewers.
If you are using animation as content e.g., to help illustrate a concept or technique open the animation in a secondary window using the TARGET="main" parameter of the A HREF tag. That way your readers can view the animation and then close the window. If you present the animation on the main content page it will interfere with the other page elements.


Siegel, D. 1996. Creating killer web sites. Indianapolis: Hayden Books. www.killersites.com


Rainer Maria Rilke: 3 Gedichte

Jones and Jones

Copyright 1997 P. Lynch and S. Horton,
   all rights reserved. Yale University   Revised January 1997.