Accessibility · Cluster

ARIA Practice

Custom widgets and live regions.

  1. 01 The Role Attribute as a Contract With the Accessibility Tree How a role token rewrites what the accessibility tree exposes, why it adds no behaviour, and how the first valid token in a list wins. foundational · Sep 9, 2026
  2. 02 Mirroring Widget State Into ARIA Attributes Without Drift Why every interactive custom widget keeps state in two places, which attributes the tree actually reads, and how a render boundary prevents the two copies from disagreeing. foundational · Apr 28, 2024
  3. 03 How Live Regions Turn DOM Mutations Into Speech Live regions do not announce anything themselves; they mark a subtree as interesting so that mutations inside it are queued, and politeness, atomicity, and relevance decide what is spoken. foundational · Apr 7, 2025
  4. 04 Roving tabindex and aria-activedescendant as Competing Models Two ways to keep one tab stop inside a composite widget: moving real DOM focus between items, or holding focus on a container and pointing at an item. Their costs differ in event routing, virtualisation, and IME handling. intermediate · Aug 17, 2026
  5. 05 Hiding Subtrees Without Breaking Focus or the Tree display none, visibility hidden, aria-hidden, and the hidden attribute remove content from different layers. Choosing wrong leaves focusable nodes inside invisible subtrees or visible text absent from the tree. intermediate · Jul 21, 2026
  6. 06 The Combobox Popup Contract: Ownership, Focus, and Announcement What a text input and its suggestion list must agree on to be one widget: the popup relationship, where DOM focus lives during typing, and who announces the active option. intermediate · Jul 3, 2026
  7. 07 Modal Inertness: What a Dialog Must Remove From the Rest of the Page A dialog is modal only if the rest of the document is unreachable by keyboard, pointer, and the accessibility tree. The containment mechanics, and the focus restoration that fails when the trigger is gone. intermediate · Sep 18, 2024
  8. 08 Implicit Live Values in status, alert, log, and timer Roles Live roles carry default politeness and atomicity from their definitions, so the role chooses behaviour the author never wrote. Where those defaults help, and where overriding them produces a contradictory tree. advanced · Apr 3, 2026
  9. 09 Live Regions Under Re-Rendering: Why Framework Updates Announce Nothing A live region depends on text mutations inside a stable node. Diffing renderers replace nodes, batch writes, and mount regions on demand, which silences announcements in ways that look random. advanced · Mar 8, 2024
  10. 10 Custom Widgets Over Virtualized Content When only the visible window of a list exists in the DOM, the accessibility tree holds a fragment of the data. Position, size, and the active item have to be reported through attributes rather than structure. advanced · Jul 4, 2026