Using the aViewer accessibility object inspection tool

on YouTube ↗52m

" summary

aViewer inspects the accessibility APIs behind web content and shows the DOM code plus the accessibility tree, API roles, states and relations across Internet Explorer and Firefox (Chrome exposes only partial info). UI features include watch cursor, watch focus and highlight rectangles, a blue inline tooltip, copy-to-clipboard and up/down navigation through the tree. Demos show why turning an image into a usable control requires role + tabindex + key handlers (native buttons avoid all that) and it runs on Windows 7/8/8.1.

AI-written summary · about

" chapters (11)

1. 0:00Start
2. 5:59The Accessibility Tree
3. 7:57Explorer
4. 14:15Toolbar
5. 14:41Watch Cursor
6. 14:57Show Highlight Rectangle
7. 17:19Desktop Mode
8. 18:46Tree View Contents
9. 26:18Object Attributes
10. 29:30Html Button
11. 35:42Labelings

" related talks

• 43mBeyond the DOM: what’s in the accessibility tree for you?Bram Duvigneau · Frontend United 2018
• 12mHarnessing the Accessibility TreeCorina Murg · SquiggleConf 2024
• 50mDebugging broken accessibilitySarah Higley · Inclusive Design 24 (#id24) 2020
• 21mTesting A11y: Validating Web App AccessibilityShawn Harris · Frontend Nation 2024
• 56mQuick Start for Evaluating and Testing Web AccessibilityJared Smith, Jonathan Whiting · Web Accessibility in Mind Conference 2022
• 31mDecoding web accessibility through testingAnuradha Kumari · Vue.js Nation 2023
• 27mTime Traveller's Guide to Accessibility MechanicsLéonie Watson · DevDays Europe 2019
• 41mWhat If We Talked About Web Accessibility?Olivier Leplus · DevFest Toulouse 2018