ARIA ist eine Ergänzung zu HTML. Es verleiht eine zusätzliche semantische Bedeutung.
Grundsätzliche Regeln zu ARIA
Wenn Sie die Wahl zwischen nativem HTML und ARIA haben, sollten Sie stets HTML den Vorzug geben.
ARIA sollte nur eingesetzt werden, wenn Sie wissen, was Sie tun und die Funktion vollständig verstanden haben. Schlechtes ARIA ist schlimmer als kein ARIA. Die ARIA-Rolle Application zum Beispiel kann eine Website für Blinde unbenutzbar machen.
Mit ARIA alleine wird eine Webseite nicht barrierefrei.
ARIA fügt keine Funktion zur Website hinzu. Insbesondere, wenn Sie Javascript einsetzen, müssen Sie zusätzliche Funktionalitäten wie Tastatur-Bedienbarkeit programmieren.
Die Aufgaben von ARIA
ARIA erfüllt verschiedene Funktionen innerhalb von Webseiten.
Es fügt dem HTML zusätzliche Semantik hinzu. Der Navigation kann die Rolle Navigation hinzugefügt werden, um die Navigation leichter mit assistiven Technologien zugänglich zu machen. Das sind die sogenannten Landmarks.
Besonders wichtig ist ARIA für programmierte Elemente wie Buttons, Slider und so weiter. Dort kann ARIA ebenfalls hinzugefügt werden, um Semantik für assistive Technologien hinzuzufügen. Das sind die sogenanten Widget-Roles.
Wenn Sie ARIA zu einem bestehenden HTML-Element hinzufügen, wird die Rolle des HTML-Elements überschrieben. Nehmen wir an, Sie zeichnen einen Link als Button aus, dann wird er sich für die assistive Technologie wie ein Button verhalten. Er taucht also nicht in der Liste der Links auf oder kann nicht in einem neuen Fennster geöffnet werden.
Name – Rolle – Wert
Der Dreiklang der Barrierefreiheit ist Name – Rolle Wert oder name – role – value.
Name ist die Bezeichnung eines Elements bzw. deren Inhalt.
Rolle ist die Aufgabe des Elements, zum Beispiel Überschrift.
Wert ist – wenn vorhanden -der Status eines Elements wie ausgewählt, nicht ausgewählt, ausgeklappt und so weiter.
Diese Informationen bringen native HTML-Elemente von Haus aus mit. Bei Javascript müssen sie zusätzlich kommuniziert werden.
ARIA kann nicht nur die Semantik, sondern auch den Status eines Elements kommunizieren. Das ist etwa bei Formular-Elementen wie Radio-Buttons, bei Akordeons und anderen Elementen interessant.
Der Status kann etwa „ausgeklappt“, „ausgewählt“ und so weiter sein.
Interessant ist ARIA auch, um Pflichtfelder in Formularen zu kennzeichnen. Entsprechende Felder werden dann von der assistiven Technologie als Pflichtfelder kommuniziert.
Eigenschaften
ARIA kann außerdem kommunizieren, dass Elemente Unterelemente haben. Oder andere Eigenschaften.
So kann ein Navigationspunkt eine dynamisch ausklappbare Unternavigation haben. Das kann ARIA kommunizieren. Denken Sie aber daran, dass ARIA nicht automatisch die Unter-Navigation auch zugänglich macht.
Auch Relationen können durch ARIA kommuniziert werden. Zum Beispiel kann es wichtig sein zu wissen, dass ein Element ein Kind-Element ist und was das Mutter-Element ist.
Dynamische Ereignisse
Single-Page-Applikationen werden immer wichtiger. Da sich hier häufig dynamische Änderungen abspielen ist es wichtig, diese an die assistive Technologie zu kommunizieren.
So können durch ARIA Regionen definiert werden, in denen dynamische Änderungen ausgegeben werden.