WCAG 2.2 Accessibility Remediation Blueprint
Remediate a web app to WCAG 2.2 AA via combined automated and manual audit, component-level fixes, CI-enforced accessibility tests, and governance through the Definition of Done.
What and Why
WCAG 2.2 (W3C Recommendation, October 2023) is the current accessibility standard, adding criteria such as Focus Not Obscured, Dragging Movements, Target Size (Minimum), and Accessible Authentication. Conformance to Level AA is increasingly required by law (ADA case law, EU EN 301 549 / European Accessibility Act, Section 508). Beyond compliance, accessibility broadens your audience and improves usability for everyone. This blueprint remediates an existing app to WCAG 2.2 AA and keeps it there.
Phases
Audit. Combine automated scanning (axe, Lighthouse) with manual testing using screen readers (NVDA, VoiceOver), keyboard-only navigation, and zoom/contrast checks. Map every issue to a specific success criterion and severity. Automated tools catch only part of the problem; manual review is essential.
Prioritization. Rank issues by user impact and legal risk: blockers (keyboard traps, missing labels, unusable forms) first, then perceivable/operable issues, then refinements. Group recurring patterns (e.g., a shared component used everywhere).
Remediation. Fix at the component-library level so corrections propagate. Add semantic HTML, ARIA only where needed, visible focus indicators, sufficient contrast, proper labels, and the new 2.2 criteria (target size, focus visibility, accessible auth). Avoid ARIA misuse.
Automated testing. Integrate axe-core into CI and add accessibility assertions to component and end-to-end tests so regressions fail the build. Add linting (eslint-plugin-jsx-a11y).
Governance. Add accessibility to the Definition of Done, train designers and developers, and schedule periodic manual audits. Publish an accessibility statement.
Key Risks and Mitigations
- Legal exposure: Prioritize blockers and document conformance; produce a VPAT/accessibility statement.
- Regression: Enforce automated checks in CI and component tests.
- Scope creep: Fix shared components first for maximum coverage per effort.
Recommended Tooling
axe-core/axe DevTools, Lighthouse, NVDA/VoiceOver, eslint-plugin-jsx-a11y, Playwright with accessibility assertions, and a design system with accessible components.
Success Metrics
Measured WCAG 2.2 AA conformance, falling accessibility-issue density, no new violations passing CI, and improved user satisfaction among assistive-technology users.
Prerequisites
A component-based UI, CI pipeline, and stakeholder commitment. Treat accessibility as ongoing engineering, not a one-time project.