refactor-ui-a11y
Accessibility & Responsive Gate (WCAG 2.2 AA) — refactor-chain · do-the-work (UI · gate)
Bundle: refactor-chain (self-diagnosing, self-healing fix-it pipeline). Phase: do-the-work (UI lane) · Prerequisite: refactor-ui-components (and the tokens + visual/mobile pass) · Next: refactor-code-principles → the review gate. Adaptivity / conditional: repo-agnostic; standards apply to any web or mobile UI. This is the gate of the UI lane — it both fixes and blocks "done" until AA passes.
Purpose
Make the UI usable by everyone — people using a keyboard, a screen reader, high-zoom, or a phone at a large text size — and prove it against WCAG 2.2 AA. This step audits and fixes the accessibility and responsive defects the earlier UI steps didn't own: insufficient contrast, missing labels/roles, broken focus order, no visible focus, keyboard traps, layouts that don't reflow, and text that doesn't scale. As the lane's gate, it doesn't just advise — it fixes what it can and blocks the lane from being called done until the core AA criteria pass.
When to use
- Trigger phrases: "make this accessible", "fix the contrast", "add ARIA/roles/labels", "make it keyboard-navigable", "fix the focus order", "check WCAG", "screen-reader support", "fix the responsive layout", "it breaks on mobile", "it doesn't reflow", "text doesn't scale".
- As the closing gate of any UI lane (tokens → visual/mobile → components → a11y).
- When the diagnostic pass flags accessibility or responsive risk.