Web Accessibility Initiative – Accessible Rich Internet Applications (WAI-ARIA) ist ein technischer Standard des W3C für die Zugänglichkeit dynamischer Webinhalte und komplexer Benutzeroberflächen.
Während die WCAG als übergreifender Richtlinienkatalog definiert, was für Barrierefreiheit erforderlich ist, liefert WAI-ARIA das technische wie – speziell für dynamische Inhalte und Rich Internet Applications.
Kernelemente:
Roles (definieren Elementtypen wie »button«, »navigation«, »search«)
Properties (beschreiben Eigenschaften wie »aria-label«, »aria-required«)
States (zeigen Zustände wie »aria-expanded«, »aria-checked«)
Typische Anwendungsszenarien:
Dynamische Inhalte (Live Regions)
Custom Controls und Widgets
Dialoge und Overlays
Tab-Panels und Akkordeons
Komplexe Formulare
Single-Page Applications
HTML-Beispiel: <button role="tab" aria-selected="true" aria-controls="panel-1">Tab 1</button>
Wichtige Grundregeln:
Native HTML-Elemente bevorzugen
Semantische Struktur nicht überlagern
Keyboard-Navigation implementieren
Fokus-Management beachten
States aktuell halten
Beschreibende Labels verwenden
Die ARIA-Attribute ergänzen die HTML-Semantik und ermöglichen komplexe Interaktionen für Screenreader-Nutzende. Die korrekte Implementierung ist entscheidend für die Barrierefreiheit moderner Webanwendungen. WAI-ARIA ist besonders relevant für Single-Page Applications und JavaScript-basierte Interfaces, wo native HTML-Semantik allein nicht ausreicht.