Agent skill · design visual · davila7
Accessibility Auditor
Web accessibility specialist for WCAG compliance, ARIA implementation, and inclusive design. Use when auditing websites for accessibility issues, implementing WCAG 2.1 AA/AAA standards, testing with screen readers, or ensuring ADA compliance. Expert in semantic HTML, keyboard navigation, and assistive technology compatibility.
Why this skill is useful
Provides specific guidance on WCAG compliance and ARIA implementation that the AI wouldn't reliably generate on its own.
What it needs
About 6k tokens when loaded. Last updated 2026-08-06. 30,138 stars on the source repository.
What this skill does
Accessibility Auditor Comprehensive guidance for creating accessible web experiences that comply with WCAG standards and serve users of all abilities effectively. When to Use This Skill Use this skill when: Auditing websites for accessibility compliance Implementing WCAG 2.1 Level AA or AAA standards Fixing accessibility violations and errors Testing with screen readers (NVDA, JAWS, VoiceOver) Ensuring keyboard navigation works correctly Implementing ARIA attributes and landmarks Preparing for ADA or Section 508 compliance audits Designing inclusive user experiences WCAG 2.1 Principles (POUR) 1. Perceivable Users must be able to perceive the information being presented. 2. Operable Users must be able to operate the interface. 3. Understandable Users must be able to understand the information and interface. 4. Robust Content must be robust enough to work with current and future technologies. Common Accessibility Issues & Fixes 1. Missing Alt Text for Images ❌ Problem: ✅ Solution: Rules: Informative images: Describe the content/function Decorative images: Use empty alt (alt="") Functional images: Describe the action Complex images: Provide detailed description nearby 2. Low Color Contrast ❌ Problem: ✅ Solution: Requirements: Normal text (< 18px): 4.5:1 minimum (AA), 7:1 enhanced (AAA) Large text (≥ 18px or ≥ 14px bold): 3:1 minimum (AA), 4.5:1 enhanced (AAA) UI components and graphics: 3:1 minimum 3. Non-Semantic HTML ❌ Problem: ✅ Solution: Semantic Elements: <button> for buttons <a> for links <h1> - <h6> for headings (hierarchical) <nav>, <main>, <aside>, <article>, <section> for landmarks <ul>, <ol>, <li> for lists <table>, <th>, <td> for tabular data 4. Missing Form Labels ❌ Problem: ✅ Solution: Best Practices: Every form field must have an associated label Labels should be visible (don't rely on placeholder) Use aria-label only when visual label isn't possible Group related fields with <fieldset> and <legend> 5. …
How to use it
Reference it in AdaL, Claude Code, Cursor or any coding agent — nothing to install:
@skills davila7/accessibility-auditor