Building Accessible Interfaces

Accessibility failures are concentrated in a few places: custom controls built from divs, inputs without labels, invisible focus, low-contrast "subtle" text, and modals that trap nothing or everything. Check those first; they cover most real users' problems and most automated findings.

Contents

• Step 1 — Semantic HTML first
• Step 2 — Every control has a name
• Step 3 — Keyboard and focus
• Step 4 — Contrast, measured
• Step 5 — Motion, zoom and touch
• Step 6 — Automated checks plus a manual pass
• Native apps
• Anti-patterns

Step 1 — Semantic HTML first