A: Bestimmte ARIA-Rollen müssen in spezifischen, übergeordneten Eltern-Rollen enthalten sein (WCAG 1.3.1)
aria-required-parent
Stellt sicher, dass Elemente mit ARIA-Rollen, welche übergeordnete Rollen voraussetzen, auch in diesen enthalten sind.
Das bedeutet
Bestimmte Rollen benötigen einen konkreten Eltern-Container – z. B. tab → tablist, option → listbox, menuitem → menu/menubar, radio → radiogroup, treeitem → tree, listitem → list. Fehlt der übergeordnete Kontext, ist die Struktur für Assistive Technologien nicht erkennbar.
Auswirkung
Screenreader-Ansagen, Tastatur-Navigation und Fokus-Logik funktionieren unzuverlässig. Das erschwert Orientierung und Bedienung und verletzt WCAG 1.3.1 (A).
Empfehlung
-
Wenn möglich, native HTML verwenden (<ul>/<li>, <fieldset>/<legend>, <button>).
-
Rollen korrekt schachteln und im DOM abbilden (kein Ersatz durch aria-owns).
Beispiel
Problematisch:
<div role="tab">Über uns</div>Besser:
<div role="tablist"><button role="tab">Über uns</button></div>