Animations, Visual Effects

Downloadable page: Download Lesson on Animations, Visual Effects

The Standards

Section 508 Standards:

WCAG 2.0 Guidelines:

  • Guideline 2.2.2 Links to an external site. "Pause, Stop, Hide: For moving, blinking, scrolling, or auto-updating information, all of the following are true: (Level A)" (W3C)
    • Moving, blinking, scrolling: For any moving, blinking or scrolling information that (1) starts automatically, (2) lasts more than five seconds, and (3) is presented in parallel with other content, there is a mechanism for the user to pause, stop, or hide it unless the movement, blinking, or scrolling is part of an activity where it is essential; and
    • Auto-updating: For any auto-updating information that (1) starts automatically and (2) is presented in parallel with other content, there is a mechanism for the user to pause, stop, or hide it or to control the frequency of the update unless the auto-updating is part of an activity where it is essential.
  • Guideline 2.3.1 Links to an external site. "Three Flashes or Below Threshold: Web pages do not contain anything that flashes more than three times in any one second period, or the flash is below the general flash and red flash thresholds. (Level A)" (W3C)

What do the Standards Mean?

For individuals with photosensitive seizure disorders, flashing or blinking lights can trigger seizures. Many animations (e.g. gif animation), visual effects (e.g. transitions in slides or videos) and objects that automatically update (e.g. RSS feeds) on web pages, videos, slide presentations, and games have rapid flashing or blinking components. Whether the resource is dangerous to individuals with photosensitivity depends on the speed and size of the animation; for instance, if the object is large and blinks more than three times in a second then it is dangerous. If the requirements are not met then that resource should not be used.

Whenever animations and visual effects are presented in a resource, ensure that any content conveyed by those animations and visual effects are also detailed in the accompanying text. In addition, provide a method for users to pause, stop or slow down the animation, visual effect or automatically updating objective. An example would be allowing users to control the play and speed of the automatic refresh of an RSS feed.

How to Test an Object?

One easy method for assessing whether or not an object meets the above standards is checking to see if the resource blinks or flashes more than three times in a single second. If it does then that animation, visual effect or object could potentially cause individuals with photosensitivity to have a seizure.

There are also tools available that can assess an object for issues related to photosensitivity. Review the page in week 6 for more information.

Tips for Using Animations and Visual Effects

While it is possible to make blinking objects safe, it is often easier and quicker to forgo using any blinking and flashing animations, visual effects or other related objects. Also, when creating slide presentations and videos, use simple, slow transitions and visual effects.

Resources

Information on this page is from the following resources about Animations, Visual Effects:

  • WebAIM Seizure Disorders. Links to an external site.Retrieved December 30, 2015.
    • WebAIM is a non-profit organization associated with the Center for Persons with Disabilities at Utah State University. It is one of the leading resources for information on accessibility.

Estimated time: 14 minutes