Accessibility Tree

Accessibility Tree image
The accessibility tree is a behind-the-scenes structure that helps assistive technologies like screen readers understand what is on a web page. It is created by the browser and is based on the information in the DOM along with roles, names, states, and other properties added through HTML and ARIA.

While the DOM shows everything that exists on a page, the accessibility tree only includes the parts that are meaningful for users who rely on assistive tools. For example, decorative icons or hidden elements might be skipped in this tree.
This tree acts as a filtered and simplified version of the user interface. It helps people with disabilities understand and interact with content by providing an accessible version of what is visually shown.

Testers can inspect the accessibility tree using browser tools to check whether buttons, links, labels, and other elements are properly exposed for assistive technologies. This helps ensure that the product is usable for everyone, including those with visual or motor challenges.
Explore MoT
Leading with AI - The London Edition image
Fri, 19 Jun
A half-day educational experience to navigate the world of AI
A Software Tester’s Guide To Chrome Devtools image
Learn how to dig deeper into the Web with the use of Devtools
This Week in Quality image
Debrief the week in Quality via a community radio show hosted by Simon Tomes and members of the community
Subscribe to our newsletter