WCAG 2.2 & ARIA Authoring Practices

Why it matters

WCAG AA is a contractual and regulatory requirement in most enterprise and public-sector work. Retrofitting it after handoff is the single most expensive design mistake available.

Key principles

1. Perceivable - 4.5:1 contrast for body text, 3:1 for large text and UI components; never encode meaning in colour alone.
2. Operable - every interaction reachable by keyboard, with a visible focus indicator and no keyboard traps.
3. Understandable - predictable navigation, clear labels, and error messages that say how to fix the problem.
4. Robust - use semantic HTML first; reach for ARIA only when no native element exists.
5. WCAG 2.2 adds focus appearance, dragging alternatives, target size (24x24 CSS px minimum), and accessible authentication.

Resources

Foundations, principles, tutorials, community Figma files, icon sets, and templates.

• FoundationWCAG 2.2 standard
• ReferenceHow to Meet WCAG - filterable quick reference
• PrinciplesARIA Authoring Practices Guide - patterns
• TutorialWAI tutorials - forms, tables, menus, images
• TutorialInclusive Components - Heydon Pickering
• TemplateWebAIM Contrast Checker