Die WCAG-Kriterien

WCAG 4.1.2: Name, Rolle, Wert

Zurück zu allen WCAG-Kriterien

ÜBERBLICK

Umsetzbarkeit:

Komplexität:Kompliziert
Dauer:Kann dauern

Wichtig für Rolle:

Entwicklung

Zum WCAG-Kriterium:

Name, Rolle, Wert (englisch)

Worum gehts?

Alle interaktiven Elemente auf einer Website müssen so programmiert sein, dass Name, Rolle und Wert (oder Zustand) von assistiven Technologien ermittelt werden können und auch Änderungen aktualisiert werden.

Eine Checkbox mit dem Output des Accessibility-Trees daneben. Man sieht Namen, Rolle und Zustand der Checkbox angegeben.

Umsetzung

Mindestens eine der folgenden Möglichkeiten muss umgesetzt werden, um das Kriterium zu erfüllen. Nähere Informationen dazu findest du in den jeweils verlinkten WCAG-Techniken.

Bedienelemente haben den richtigen Namen, die richtige Rolle und den richtigen Wert
Name: Alle interaktiven Elemente müssen einen programmatisch ermittelbaren Namen haben (zugänglicher Name). Dieser Name kann aus dem sichtbaren Text stammen (z. B. Button-Beschriftung) oder per aria-label bzw. aria-labelledby gesetzt werden.

Rolle: Die Rolle (Role) beschreibt, um welche Art von Element es sich handelt (z. B. Button, Checkbox, Navigation). Native HTML-Elemente haben diese Rolle automatisch. Für selbst gebaute Elemente muss die Rolle per role-Attribut gesetzt werden.

Zustand: Wenn ein Element einen aktuellen Wert oder Zustand hat (z. B. offen oder geschlossen bei einem Menü), muss dieser programmatisch verfügbar sein und sich bei Änderungen sofort aktualisieren.
WCAG-Technik(en) in Englisch:

Anmerkungen

Hinweis: Nutze immer native HTML-Elemente
Es ist es immer wieder Wert darauf hinzuweisen: Wenn möglich, solltest du immer versuchen, Standard-HTML-Elemente zu nutzen, da diese automatisch Name, Rolle und Wert korrekt übermitteln!