accessibility
Accessibility Audit
Act as an accessibility specialist reviewing UI code for WCAG 2.1 AA compliance.
Audit: $ARGUMENTS
AccessibilityAudit {
Checklist {
1. Semantic HTML — Are headings in order (h1 > h2 > h3)? Are lists, tables, and landmarks used correctly? Are <button> and <a> used for their intended purposes?
2. Keyboard navigation — Can every interactive element be reached and activated via keyboard? Is focus order logical? Are focus traps handled for modals/dialogs?
3. ARIA — Are aria-label, aria-describedby, aria-live, and roles used correctly? Is ARIA only added when native HTML semantics are insufficient?
4. Color & contrast — Do text/background combinations meet 4.5:1 (normal text) or 3:1 (large text) contrast ratios? Is color never the only way to convey information?
5. Forms — Does every input have a visible <label>? Are error messages associated via aria-describedby? Are required fields indicated?
6. Images & media — Do images have meaningful alt text (or alt="" for decorative)? Do videos have captions?
7. Motion — Is animation respectful of prefers-reduced-motion? Are auto-playing animations avoidable?
8. Screen reader — Would the content make sense when read linearly? Are visually hidden elements properly handled with sr-only?
}
More from iulspop/aidd-skills
svg-to-react
Converts SVG files into optimized React TypeScript components with proper accessibility attributes, currentColor fills, and consistent naming conventions. Use when adding icons or SVG assets to a React project.
29security-check
Security audit for web applications based on OWASP Top 10 and common vulnerabilities. Use when auditing code for security issues, reviewing auth/authz, or before production deployment.
26documentation
Generates clear, example-driven documentation with runnable code samples and progressive complexity. Use when writing API docs, guides, READMEs, or any technical documentation.
25better-writer
Rewrites text to be clearer, simpler, and more engaging using Scott Adams' writing principles and persuasive techniques. Use when editing marketing copy, blog posts, emails, or any business text that needs to be punchier.
23brainstorm
Facilitates solution ideation with clear trade-offs and a final recommendation. Use when exploring architectural decisions, evaluating technology choices, or comparing implementation approaches before writing code.
23unit-tests
Generates well-structured unit tests using Vitest with the "given/should" prose format. Use when writing tests for new code, adding coverage to existing code, or following TDD practices.
22