Web design and animation:
Appropriate and Inappropriate Uses

Jim Levin

Animation is a powerful way to attract attention and so putting animations on your web pages is a quick way to make them attractive. Gif animations are especially attractive, since you can simply save them from another web page (assuming you have copyright permission) and insert them into your own web page without having to worry about Java applets or Javascript.

However, an animation not only attracts attention to the web page it is on, but it attracts attention to itself. It is very difficult to look at other elements on a web page that has animations. Most of the gif animations you'll find on the web are set to continue to animate forever. When you put an animation on a web page, ask yourself "Do I want people to look at other things on this page besides the animations?". If the answer is yes, then you're in a quandry. How can you use the animation to make your page more attractive but not distract attention from what you want people to see or read?

Fortunately, there is a fairly simple solution to this quandry. It is simple to take any given gif animation file and change it so that it animates only for a certain length of time, and then stops. That way, it attracts attention to the page, but then stops so people can see and read the other things on the page. There are simple applications for both Macintosh and Windows that allow you to set the "looping" count for an animated gif, so that it animates for a limited time, then stops.

For Macs, you can use GifBuilder which is free with a small download file (304 KB) http://homepage.mac.com/piguet/gif.html . Once you download this application,

  1. Start up GifBuilder
  2. Open your animated gif file
  3. Select Options -> Looping
    You'll see: Gifbuilder looping window
  4. Click on the "times" button and type in some small number
  5. Save the file

For Win, you can use GIF Construction Set which is shareware (US$20) and a bit larger download file (1.9 MB) http://www.mindworkshop.com/alchemy/gifconcl.html . Once you download this application,

  1. Start up GIF Construction Set
  2. Open your animated gif file
  3. Select "Loop" in the window, then "Edit"
    GIf Construction Set window
  4. Type in some small number
  5. Save the file


That's all you need to do - now you have an animated gif that animates when your page is loaded, but that stops after a short while so that people can see the other parts of your web page.