01
Developers
Every WCAG 2.2 criterion mapped to the ARIA wiring, keyboard handling, and focus semantics that make it pass. Framework-specific component patterns (React, Vue, Svelte, Angular) roll out next.
WCAG 2.2 · Plain language · Linked to the spec
The developer's map to web accessibility.
Every WCAG 2.2 success criterion, explained in plain language and linked to the official W3C Understanding document.
- WCAG 2.2 criteria
- 86
- Conformance levels covered
- A–AAA
- Contrast across the site
- AAA
For the people who ship
Built for the people who actually ship accessible UI.
02
Designers
AAA colour tokens, focus indicators that survive brand reviews, and motion rules that respect reduced-motion — all grounded in the criteria below. Design-system guides expand from here.
03
QA & audit leads
Every criterion written the way an audit report cites it. Axe, Lighthouse, and case-study mappings land on top of this spine as content grows.
Long-form guides · Cluster A
Start with the criteria that fail the most.
- 1.1.1A
Non-text Content
Every image, icon, chart, form control, and embedded media needs a text alternative that conveys the same purpose — so screen readers, braille displays, and text-only browsers can access it.
Read the guide →
- 1.3.1A
Info and Relationships
Structure must be conveyed in code, not just visual styling. Use real headings, lists, tables, fieldsets, and ARIA roles so assistive tech can parse relationships.
Read the guide →
- 1.4.3AA
Contrast (Minimum)
Text must have a contrast ratio of at least 4.5:1 against its background. Large text (≥18pt or 14pt bold) may go as low as 3:1.
Read the guide →
- 2.1.1A
Keyboard
All functionality must be operable through a keyboard interface, without requiring specific timings for individual keystrokes.
Read the guide →
- 2.4.4A
Link Purpose (In Context)
The purpose of each link can be determined from the link text alone, or from the link text together with its programmatically determined context.
Read the guide →
- 2.4.7AA
Focus Visible
Every keyboard-operable component must have a visible focus indicator. Removing the outline with CSS and providing no replacement fails.
Read the guide →