Debugging broken accessibility

on YouTube ↗50m

" summary

Concrete debugging recipes for tables, live regions and truncated-tooltips, not fluff: open Firefox and inspect the Firefox accessibility inspector tree to spot wrong roles and missing row/rowgroup structure; run NVDA and compare behavior to a vanilla HTML pattern or the ARIA practices examples; log DOM changes with a mutation observer and verify announcements with Accessibility Insights for Windows (listen for LiveRegionChanged). Root causes are often lack of semantic HTML knowledge, mistaken assumptions about screen readers, bad design choices, or inaccessible third‑party components — not a single missing aria.

AI-written summary · about

" chapters (5)

1. 0:00Start
2. 7:54the dreaded
3. 15:53the screen reader should say...
4. 33:37Return of the
5. 34:48Is this a good design?

" related talks

• 31mDecoding web accessibility through testingAnuradha Kumari · Vue.js Nation 2023
• 13mDebugging accessibility with Chrome DevTools - American Sign LanguageCynthia Shelly · Google I/O 2022
• 13mDebugging accessibility with Chrome DevToolsCynthia Shelly · Google I/O 2022
• 47mBuilding Accessible Web ComponentsRuss Weakley · Inclusive Design 24 (#id24) 2016
• 12mHarnessing the Accessibility TreeCorina Murg · SquiggleConf 2024
• 45mYou're only supposed to blow the bloody doors off!Léonie Watson · Frontend United 2017
• 41mWhat If We Talked About Web Accessibility?Olivier Leplus · DevFest Toulouse 2018
• 01h 05mAccessibility Testing 101Erissa Duvall · NDC London 2024