Accessibility Testing with AI Agents

Accessibility isn't optional — it's a requirement. But testing it manually is tedious and error-prone. Certyn's accessibility tree tool gives AI agents the same view that screen readers use, enabling automated accessibility audits.

The Accessibility Tree

Every web page has two trees: the DOM tree (what developers see) and the accessibility tree (what assistive technologies see). The accessibility tree strips away visual details and exposes the semantic structure: roles, names, states, and relationships.

Certyn can read this tree instantly, without needing a screen reader installed.

What the Agent Sees

The accessibility tree output looks like this:

[navigation] "Main"
  [link] "Home"
  [link] "Products"
  [link] "About"
[main]
  [heading] "Welcome" (level=1)
  [textbox] "Search" (focused)
  [button] "Submit" (disabled)

Each node shows:

• Role — what kind of element it is (button, link, heading, etc.)
• Name — the accessible label
• States — focused, disabled, checked, expanded, etc.
• Level — for headings (h1 = level 1)

What to Test

Missing labels

Forms without labels are the most common accessibility issue. The agent can check if every input has a descriptive name in the accessibility tree.

Heading hierarchy

Headings should follow a logical order (h1 → h2 → h3). Skipping levels confuses screen reader navigation.

Interactive elements

Every button, link, and form control should have:

• A descriptive accessible name
• The correct ARIA role
• Proper state indicators (disabled, expanded, etc.)

Keyboard navigation

While the accessibility tree doesn't directly test keyboard navigation, it reveals whether interactive elements are properly exposed to assistive technologies.

Example Scenarios

Audit the signup form

"Get the accessibility tree of the signup form and check if all inputs have proper labels."

Check heading structure

"Get the full accessibility tree and verify the heading hierarchy follows h1 → h2 → h3 without skipping levels."

Verify modal accessibility

"Open the settings modal and get its accessibility tree. Check if it has the dialog role and proper focus management."

Scope to a specific element

Use a CSS selector to focus on one part of the page: "Get the accessibility tree of the navigation bar (selector: nav)."

Tips

• The accessibility tree is more token-efficient than screenshots for understanding page structure
• Use max_depth to limit how deep the tree goes on complex pages
• Focus on forms, navigation, and interactive components first
• Combine with inspect_dom for detailed HTML + ARIA attribute inspection