Perceivable
Information and user interface components must be presentable to users in ways they can perceive.
1.1 Text Alternatives
Provide text alternatives for non-text content.
Success Criteria
- 1.1.1 Non-text Content (Level A) - All non-text content has a text alternative
// Good: Image with alt text
<img src="chart.png" alt="Sales increased 25% in Q4 2024" />
// Good: Decorative image
<img src="decorative-border.png" alt="" role="presentation" />
// Bad: Missing alt text
<img src="important-info.png" />
1.2 Time-based Media
Provide alternatives for time-based media.
Success Criteria
- 1.2.1 Audio-only and Video-only (Level A) - Provide alternatives
- 1.2.2 Captions (Level A) - Provide captions for audio content
- 1.2.3 Audio Description (Level A) - Provide audio description for video
1.3 Adaptable
Create content that can be presented in different ways without losing meaning.
Success Criteria
- 1.3.1 Info and Relationships (Level A) - Use semantic HTML
- 1.3.2 Meaningful Sequence (Level A) - Reading order makes sense
- 1.3.3 Sensory Characteristics (Level A) - Don't rely solely on shape, size, or location
1.4 Distinguishable
Make it easy to see and hear content.
Success Criteria
- 1.4.1 Use of Color (Level A) - Color is not the only way to convey information
- 1.4.3 Contrast (Minimum) (Level AA) - Text has 4.5:1 contrast ratio
- 1.4.4 Resize Text (Level AA) - Text can be resized up to 200%