Better accessibility with a user-centric view
summary
Demo shows a screen reader reading misordered headings, hidden elements ignored by assistive tech, and wrong language tags so navigation and comprehension break; claims: fix semantic heading hierarchy and ensure visible labels and tabindex so focusable items land; specific rules: set lang attribute (React default is English and Next has none), make tappable targets at least 24×24, implement SPA history for back button, add autocomplete and clear error feedback so forms actually work.
AI-written summary · about
chapters (9)
- 0:00Start
- 7:49Heading levels
- 9:30Focus
- 10:19Language settings
- 14:16Cecily
- 14:32Button size
- 14:57Visible label in buttons
- 15:46Feedback in the system
- 18:30Multiple ways
related talks
33mMarkup matters
01h 12mPractical Tips for Building More Accessible Front-Ends by Sara Soueidan
41mTales of Accessibility Failures
33mAccessibility Done Right
01h 07mA web for anyone, anywhere, anytime
16mDemystifying accessibility in React apps
26mAccessibility Is a Marathon, not a Sprint
34mBuilding Accessible Web Apps in React