Is your website flickering?

Alexis Wilke's picture
Height of Operative Control Relative to a Vertical Plane

Today I was visiting the American Cancer Society when I stumble upon a strange sentence... Now I'll have to think about means to inform Snap! users whenever they are creating a page that could be affected.

The sentence goes like this:

Pages shall be designed to avoid causing the screen to flicker with a frequency greater than 2 Hz and lower than 55 Hz.

The figure to the right shows the accessibility of an handicapped person in a wheelchair.
Click on the picture to see the full figure from
Section 508 paragraph 1194.41.

I understood the sentence, it means that there should be no animations running at the wrong speed on your website pages. 2 Hz pretty much means that nothing moves (static text and images.) 55 Hz is roughly the speed at which your eyes see,, if something goes at 55 Hz or more, then your eyes cannot see any jitter or flashing effects (i.e. flicker.)1

The sentence comes from Section 508, a set of regulations that you want to comply with so as to be able to tell your users that your website is accessible by visually, auditory or motor impaired people.

A certain number of people are susceptible to changing lights when at the wrong frequency (between 2 and 55 Hz). Computer monitors displaying an animation are often running between 12 and 30 Hz. Such animations can cause seizures in people who have photosensitive epilepsy2.

Especially bad are Flash or GIF animated ads. Many of those are at the wrong speed and can cause problems.

So... to comply with Section 508 frequency limits:

  • Do not use the <blink> HTML element or any equivalent3
  • Do not use the <marquee> HTML element or any equivalent
  • Do not use Flash or GIF animations where not necessary (i.e. falling snow flakes in your background?!)
  • Test your site when you magnify the font (try Ctrl + and Ctrl - on your keyboard, it works in most browsers.)

In general, the following are acceptable:

  • Animations that fade things in and out are acceptable as long as it is not a permanent stream and the animation is smooth
  • Videos played full speed (50 to 60 fields a second, or 25 to 30 images); slow motion video effects must not slow down the frequency at which images are being played to the users

Complete Reference: Section 508.

  • 1. Note that a movie video in the US runs at 50 Hz, and in Europe it goes at 60 Hz. This means videos are fine.
  • 2. Another aspect to animations: blind people cannot see them. So unless your website is about such, plastering it with animations is probably not a good idea. In any event, when adding animations, it is a good idea to describe them with the alternate attribute. This works for blind people and engineers who use text browsers such as Lynx.
  • 3. The <blink> and <marquee> tags are not directly accessible in Snap! so you certainly won't run in this problem easily. However, we accept Flash animations which can produce these HTML effects.