/a11y-check

Catch accessibility issues before users do.

Usage

What it checks

Semantic HTML

• Buttons that should be <button> (not <div onClick>)
• Headings out of order (h1 → h3 skipping h2)
• Links without href or descriptive text

ARIA & keyboard

• Missing aria-label on icon-only buttons
• Focus traps in modals
• Tab order issues
• Missing skip links

Visual

• Color contrast ratios (text vs background, AA: 4.5:1 normal, 3:1 large)
• Text size below recommended
• Touch targets <44px

Forms

• Inputs without <label>
• Missing aria-describedby for errors
• Required fields not announced

Images & media

• <img> without alt text
• Decorative images missing alt=""
• Videos without captions track

Output

Issues grouped by severity (critical → minor) with:

• WCAG criterion violated (e.g. 1.4.3, 2.4.4)
• Component / file path
• One-line fix
• Code example of the corrected version

Rules

• Don't flag known false-positives from React Aria / Headless UI
• Acknowledge when a check requires runtime verification (e.g. focus order)