Website Accessibility Examples That Hinder Accessibility
summary
Demos show screen readers, VoiceOver and voice control breaking when ARIA names override visible text (a logout link becomes my account, violating SC 2.5.3 Label in Name), emojis and image alt text bloat accessible names, and tabindex on every table cell forces 61 TAB keypresses to reach the end. DevTools and live region demos prove fixes: use aria-describedby for extra info, empty alt or aria-hidden for decorative images, prefer native controls, and keep automated testing with assistive tech.
AI-written summary · about
chapters (10)
- 0:00Introduction
- 3:49Accessibility mistakes harm
- 7:48Accessible names
- 16:06ARIA label verbosity
- 20:43Alt text mistakes
- 25:16When image descriptions go too far
- 29:06Saying 'image is an image'
- 30:16Keyboard focus and tabindex
- 36:43Focus management fails
- 38:10Summary
related talks
33mAccessibility Done Right
31mBringing the Web Back to the Blind
27mMaking Interactions Accessible to All Users
25mReal Life Accessibility: Have you HEARD your site?
41mTales of Accessibility Failures
41mWhat If We Talked About Web Accessibility?
47mBuilding Accessible Web Components
52mCommon Accessibility Pitfalls