Techniques for WCAG 2.0

On this page:

-

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

## Applicability

All technologies.

This technique relates to:

- Success Criterion 3.1.5 (Reading Level)
  - How to Meet 3.1.5 (Reading Level)
  - Understanding Success Criterion 3.1.5 (Reading Level)

## 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:

- Charts and graphs help users understand complex data.

- Diagrams, flowcharts, videos, and animations help users understand processes.

- Concept maps and other graphic organizers help users understand how ideas are related to each other.

- Photographs, drawings, and videos can help users understand natural or historical events or objects.

## 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.

- Hall, T., and Strangman, N. CAST: Graphic organizers. Retrieved 5 April 2005 from NCAC Publications. This article illustrates several different kinds of graphic organizers, explains how each type may be useful, and summarizes research findings that graphic organizers support learning, especially among students with learning disabilities.

- Tufte, Edward. Envisioning information. Cheshire, Conn.: Graphics Press. 1990.

- Tufte, Edward. The visual display of quantitative information. Cheshire, Conn.: Graphics Press. 1983.

- Tufte, Edward. Visual explanations : images and quantities, evidence and narrative. Cheshire, Conn.: 1997.

## Related Techniques

(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

- Checks #2 and #3 are true.

- Top
- Contents
- Intro
- Previous: Technique G102
- Next: Technique G105