What is an accessibility tree and how do I view it?


I've been told to make sure my site has an accessibility tree. What is an accessibility tree? How do I view it?


An accessibility tree is a part of your website's DOM. All accessible objects are created in the accessibility tree for each DOM element that needs to be exposed to assistive technologies.

To view the accessibility tree:

In Chrome, right-click anywhere on the page and select “Inspect” to open Chrome Developer Tools. Under the “Elements” tab, click the “Accessibility” tab. The first item in the list is the Accessibility Tree.

In Firefox, right-click anywhere on the page and select "Inspect Element" to open Firefox Developer Tools. Click on the "Accessibility" tab. Turn On the accessibility features option. After it loads, the Accessibility Tree will populate.