Using Animated GIFs

Nowhere has GIF animation made a larger impact than in banner advertising. Ad agencies aren’t stupid . . . they know that adding motion and flashing to a web page is a sure-fire way to attract attention. And it’s true—adding animation is a powerful way to catch a reader’s eye.

But beware that this can also work against you. Many users complain that animation is too distracting, making it difficult to concentrate on the content of the page. Although it adds a little “pizzazz” to the page, overall, too much animation can actually spoil the user’s enjoyment of your page.

Use animated GIFs wisely. A few recommendations:

  • Avoid more than one animation on a page.

  • Use the animation to communicate something in a clever way (not just as gratuitous flashing lights).

  • Avoid animation on text-heavy pages that might require concentration to read.

  • Consider whether the extra bandwidth to make a graphic “spin” is actually adding value to your page.

  • Decide if your animation needs to loop continuously.

  • Experiment with timing. Sometimes a long pause between loops can make an animation less distracting.

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.