Techniques for WCAG 2.0

Skip to Content (Press Enter)

-

G103: Providing visual illustrations, pictures, and symbols to help explain ideas, events, and processes

Applicability

All technologies.

This technique relates to:

Description

The objective of this technique is to provide visual illustrations that help users with reading disabilities understand difficult text that describes concepts or processes. The illustrations are provided in addition to the text.

Users with disabilities that make it difficult to decode words and sentences are likely to have trouble reading and understanding complex text. Charts, diagrams, animations, photographs, graphic organizers, or other visual materials often help these users. For example:

Examples

Example 1: An annual report for a company

An annual report discusses multiple factors that influenced the company's performance in the past year. The report also includes charts and graphs that illustrate how these factors interact. Each chart or graph has a text alternative as required by Success Criterion 1.1.1. Each one also has a number in its caption (e.g., “Figure 7"). These numbers are used in the text to reference the charts or graphs.

Example 2: Screen shots in technical documentation

Online documentation for a product includes step by step instructions. Each step is illustrated by a screen shot that shows the visual appearance of the screen. Each screen shot has text alternatives as required by Success Criterion 1.1.1.

Example 3: Illustrations of a complex natural event

A Web site discusses the tsunami of 2004. The site describes how the tsunami affected different places around the Indian Ocean. Photographs of the devastation in each area are included. Each photograph has a text alternative as required by Success Criterion 1.1.1. The site also explains what happens underwater during a tsunami. The explanation is accompanied by an animation that shows how a tsunami occurs and spreads over the ocean. The animation has a text alternative as required by Success Criterion 1.1.1.

Resources

Resources are for information purposes only, no endorsement implied.

(none currently listed)

Tests

Procedure

  1. Identify text that discusses ideas or processes that must be understood in order to use the content.

  2. Check if visual illustrations are available in the content or through links within the content.

  3. Check that visual illustrations show the concepts or processes discussed in the text.

Expected Results