Frontend Accessibility
Use this skill to make frontend work accessible without turning every task into a full compliance report.
Routing
- For concise product/accessibility framing, read
references/accessibility.md. - For implementation details, keyboard patterns, ARIA rules, forms, focus, testing, and common frontend pitfalls, read
references/frontend-a11y.md. - For small UI fixes, apply the checklist below before loading a reference.
Checklist
- Prefer native HTML controls before ARIA.
- Make every interactive element keyboard reachable and operable.
- Preserve visible focus states with sufficient contrast.
- Use labels, names, descriptions, and status announcements where behavior is not obvious.
- Verify no nested interactive controls, click-only controls, or focus traps.
- Check color contrast, reduced motion, hit area size, error messaging, and responsive order.
- Test at least keyboard tab flow and one assistive-technology-friendly DOM inspection.
Output
When reporting work, mention the accessibility behavior changed and the verification performed.