Skip to Content
NASA - Goddard Space Flight Center    + NASA HomePage
Goddard Section 508 Web Best Practices
NASA HomePage Goddard Space Flight Center HomePage
 
Learning About Section 508 Developing for Section 508 Testing for Section 508
+ Home
 
Developing for Section 508
Section 508 Living Examples
Section 508 Checklist
 
Section 508 Web Accessibility - Text Equivalent Animation and Video Guidelines

§1194.22(a) A text equivalent for every non-text element shall be provided (e.g., via "alt", "longdesc", or in element content).


Checkpoint
Does the page contain animation elements?

Explanation
The definition of animation in this context covers anything that moves:

  • Videos
  • marquee banners
  • animated gifs
  • continuous still-photo feeds


Checkpoint
Does the page contain a decorative only animation element that does not contain the appropriate alt attribute value?

Explanation
Decorative-only animation does not contain any important information of any kind, but is used for aesthetic reasons only.

Guidelines
If the element is in the form of an animated .gif file, make sure that the <img> tag contains an alt attribute that describes what is happening in the element.

If the element is used only for layout (e.g. an animated border within a table cell), the <img> tag may contain an empty alt attribute to reduce the amount of needless narrative those who require assistive technology will hear.

NOTE: some user agents and assistive technologies prefer that empty alt attributes contain a blank space (e.g. <img src="movingborder.gif" alt=" ">), while others prefer that it contain no space whatsoever (e.g. <img src="movingborder.gif" alt="">). However, technical trends seem to indicate that the latter example will be the accepted standard.


Checkpoint
Does the page contain a text displaying animation element that does not have a duplicate alt attribute value?

Explanation
A marquee banner displaying text can be created using a Java applet, or it can be an animated .gif file.

Guidelines
Text displayed in an animated .gif file must be duplicated in the <img> tag's alt attribute.

NOTE: marquee banners created by Java applets should be checked against the Text Equivalent Scripts checklist.


Checkpoint
Does the site contain motions and changes of subject matter that are not accompanied by accurate descriptions?

Explanation
This checkpoint includes videos and continuous still-photo feeds (e.g. single-frame views that might be sent by a satellite camera or a webcam with low bandwidth).

Guidelines
Because continuous still-photo feeds are positioned on a site with only one <img> or <object> tag, there will only be one alt attribute. Verbiage for this attribute must describe the general theme of the series of photos being displayed. If the themes or actions depicted by the various photos are too unrelated, a link leading to detailed descriptions should be included.

Videos are also positioned on a site with only one <object> tag, and also have only one opportunity for the developer to describe the action via the alt attribute. If the action or dialog is too detailed, a link leading to detailed transcripts should be included.


Checkpoint
Is the alt description longer than one sentence?

Explanation
Many images, especially continuous still-photo feeds, will require somewhat lengthy description. Not all assistive technologies can read aloud alt attributes longer than a few dozen words. Additionally, not all user agents can accommodate an alt attribute longer than a few dozen words.

Guidelines
The 'D' link method: create a link, using the letter 'D' as the hyperlink, that leads to a detailed description of the information conveyed by the graphic image, video, or marquee banner. Make sure that the 'D' link is positioned next to or directly underneath the image, so that assistive technology will announce it immediately after it announces the image.

<img src="salesgraph.gif" alt="sales chart for the 3rd quarter">
<a href="salesgraph.html" title="Read detailed information about the sales for the 3rd quarter">D</a>

Including the title attribute within the <a href> tag will inform both sighted and assistive technology users of the 'D' link's intent.

The longdesc attribute method: in addition to including a brief description for a graphic image, video, or marquee banner, also include the longdesc attribute and a link to a more detailed description.

<img src="salesgraph.gif" longdesc="salesgraph.html" alt="sales chart for the 3rd quarter">

NOTE: there is not much---if any---support for the longdesc attribute by current user agents and assistive technologies, although that is expected to change. In fact, it is a good idea to incorporate both the longdesc attribute and the 'D' link, and it requires minimal work. Of course, be mindful that both the longdesc attribute and the 'D' link point to the same file.

Detailed descriptions of the information conveyed by the graphic image, video, or marquee banner can also be included as regular page content that is positioned in direct relation to the animation image.


+ Privacy Policy and Important Notices NASA logo

Curator: Courtney Ritz
NASA Official: Joe Stevens
Last Updated: March 6, 2009