Skip to main content

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%