1.1.1
—
Non-text Content
Provide a Text Alternative for Non-Text Content
Make sure that all non-text content, such as images, videos, and audio, has a text alternative. This helps people who cannot see or hear the content to understand and interact with it.
Acceptance Criteria
- All Non-Text Content: Must have a text alternative that serves the same purpose.
- Controls and Input: If the non-text content is a control (e.g., a button) or accepts user input, it must have a name describing its purpose.
- Time-Based Media: For audio or video content, the text alternative should at least identify the content.
- Sensory Content: For content meant to create a sensory experience, provide a descriptive identification.
- CAPTCHA: Provide text alternatives describing the CAPTCHA’s purpose and offer different types of CAPTCHA for various sensory perceptions.
- Decoration and Formatting: If the content is decorative or used for formatting, it should be implemented in a way that assistive technology can ignore it.
Examples
- Image: <img src="cat.jpg" alt="A black cat sitting on a windowsill">
- Video: A video of a person giving a speech should have a transcript.
- Audio: A podcast should have a text summary or transcript.
Exceptions
- Decorative Images: Use alt="" so they can be ignored by screen readers.
- Complex Charts or Graphs: Provide a long description or data table instead of alt text.
Tips
- Focus on the essential information conveyed by the non-text content.
- Be concise but descriptive in your text alternatives.
- Use tools to help create and verify text alternatives.
How to test?
- Visual Check: Review all non-text content to ensure it has appropriate text alternatives.
- Screen Reader Check: Use a screen reader to verify that text alternatives are read out loud and provide the necessary information.
- Assistive Technology Check: Ensure that decorative or formatting content can be ignored by assistive technology.