Accessibility Tree

Was steht im Accessibility Tree?

Laut MDN erzeugt der Browser den Baum aus dem DOM und den Accessibility-Schnittstellen der jeweiligen Plattform. Jeder Eintrag hat vier Eigenschaften. Der Name benennt das Element, zum Beispiel den Linktext „Weiterlesen“. Die Beschreibung ergänzt Zusatzinformationen. Die Rolle gibt den Typ an, etwa Schaltfläche, Navigation oder Liste. Der Zustand zeigt, ob etwas aktiviert oder aufgeklappt ist.

Ob ein Element im Baum auftaucht, steuert man über Markup und Stile. Mit display: none wird ein Element aus dem Baum entfernt, aria-hidden="true" verbirgt es vor Screenreadern. Semantisches HTML und ARIA-Attribute beeinflussen Rolle, Name und Zustand.

Die Chrome DevTools zeigen den Baum an. Im Elements-Panel öffnet man den Tab Accessibility und aktiviert „Show accessibility tree“.

Bedeutung für KI-Agenten

Auch Programme können den Baum nutzen. Playwright MCP von Microsoft arbeitet laut Projektbeschreibung mit dem Accessibility Tree statt mit Bildern und braucht keine Bilderkennung. Das spart Tokens und vermeidet Mehrdeutigkeiten, die bei Screenshots auftreten. Wie andere Agenten Seiten lesen, ist je Produkt verschieden. Sauberes HTML mit sprechenden Namen hilft daher Menschen mit Screenreader und dürfte auch Agenten helfen (Einschätzung).

Google nennt den Accessibility Tree in seinen Empfehlungen für agentenfreundliche Websites (web.dev, Stand April 2026) als eine Quelle, über die Agenten eine Seite erfassen, und rät zu semantischem HTML und per for verknüpften Labels. Ein Beitrag von searchVIU (2026) verweist auf eine Studie der UC Berkeley und der University of Michigan (CHI 2026). Darin löste ein Computer-Use-Agent 60 Alltagsaufgaben unter Windows mit Maus und Bildschirmansicht in rund 78 % der Fälle. Allein per Tastatur, wie bei der Nutzung mit Screenreader, waren es rund 42 %.

Beispiel

<button aria-label="Warenkorb öffnen">
  <svg aria-hidden="true" width="16" height="16"><path d="..."/></svg>
</button>

Im Accessibility Tree erscheint ein Eintrag mit der Rolle „button“ und dem Namen „Warenkorb öffnen“. Das Icon fehlt im Baum.

Häufige Fragen

Ist der Accessibility Tree dasselbe wie das DOM? Nein. Er ist eine abgeleitete Teilmenge, die nur Elemente mit Bedeutung für Hilfstechnologien enthält.

Was ist das Accessibility Object Model? Eine Initiative der Web Incubator Community Group (WICG). Sie soll Entwicklern eine JavaScript-API geben, mit der sie den Baum verändern und perspektivisch auch auslesen können. Der Stand ist ein Entwurf der Community Group.

Stand: 8. Oktober 2026