Accessibility
Check that everyone can use your app — keyboard users, screen reader users, and people with visual differences.
Run this audit after building forms, navigation, or interactive components. Essential for MMP and beyond.
Accessibility isn't optional — it's about including everyone.
Why This Matters
One in four adults has a disability that affects how they use technology. Building accessible products isn't just good ethics — it's good business. And many accessibility improvements (like keyboard navigation) benefit all users, not just those with disabilities.
What to Check
Four areas to verify. Each area has key questions to answer:
Keyboard Navigation
Can users navigate without a mouse? Check that all interactive elements are reachable via Tab, focus is visible, and there are no keyboard traps.
Screen Readers
Can users understand what's on screen? Check that images have alt text, forms have labels, and headings create a logical structure.
Visual Clarity
Can users see and read content? Check that text has good contrast, information isn't conveyed by color alone, and content works when zoomed.
Motion & Animation
Is animation safe and optional? Check that animations can be paused and respect user preferences for reduced motion.
Stage Expectations
What 'good enough' looks like at each stage:
Light check
No keyboard traps
Basic semantic HTML
Aware of major barriers
Light check
Core flows keyboard accessible
Focus visible on interactive elements
Main headings structured
Full audit
WCAG 2.1 AA on primary paths
Screen reader tested
Color contrast validated
Full audit
Full WCAG 2.1 AA compliance
Tested with assistive tech
Accessibility statement published
Common Issues
Problems we see often and how to fix them:
Focus indicator removed for aesthetics
Add custom focus-visible styles instead of removing focus entirely
Form inputs without labels
Add explicit <label> elements with for attribute pointing to input id
Images missing alt text
Add descriptive alt text, or empty alt='' for decorative images
Gray text with poor contrast
Use a contrast checker and increase contrast to at least 4.5:1
Links that just say 'click here'
Use descriptive link text that makes sense out of context
Run with AI: Tell your agent "Run the Accessibility audit at MMP level" or use /audit accessibility. The agent will check your codebase for common accessibility issues.
Next Steps
Related audits and resources: