Common ways we break accessibility and how to avoid them
summary
Over 70% of websites break accessibility, leaving 10–20% of customers unable to use them; this talk shows concrete fixes: removing CSS like outline:none hides the focus ring and breaks keyboard users, restoring browser defaults or adding a custom visible ring fixes it; adding tabindex=0 reintroduces keyboard access to interactive elements; using the focus-visible polyfill preserves visuals for mouse users while exposing focus to keyboard users; auto-captions on YouTube are a usable starting point but require manual edits to be readable.
AI-written summary · about
chapters (18)
- 0:00Intro
- 0:33Chrome only sites
- 1:45One browser
- 2:58Introduction
- 4:16Web accessibility definition
- 4:50Disability categories
- 5:56Kayak UK
- 9:15Key message
- 9:55Focus ring
- 11:10When to evolve
- 16:12Test with your mouse
- 23:47Headings
- 24:44Multiple headings
- 25:19Section headings
- 25:48Shortcut headings
- 26:54Video captions
- 28:40Auto captions
- 29:48Conclusion
related talks
41mTales of Accessibility Failures
46mFocusing on Focus
35mInaccessible websites? - it's you, not JavaScript
26mMake the internet a better place - with coding for accessibility
41mWhat If We Talked About Web Accessibility?
32mDemystifying Accessibility
30mAccessible.JS
53mDoing Responsive Right: Accessibility Lessons from the Field