Das Prüfverfahren zur BITV


Sie sind hier: BITV-Test > Liste der Erfolgskriterien > Prüfkriterium 4.1.2a (6 von 49)


zum WCAG-Test wechseln


Blättern: zum ersten Prüfschritt zum vorhergehenden Prüfschritt zum nächsten Prüfschritt zum letzten Prüfschritt

Prüfschritt 4.1.2a
Name, Rolle, Wert verfügbar

Technische Angaben

Version bis 10.07.2017 | Aktuell
BITV-Bedingung 4.1.2 Name, Rolle, Wert
WCAG-Erfolgskriterium 4.1.2 Name, Rolle, Wert
Bewertungsalternativen ja / eher erfüllt / teilweise erfüllt / eher nicht erfüllt / nein / nicht anwendbar
Gewichtung hohes Gewicht (3 Punkte)
Bezieht sich auf einzelne Webseite
Prüfschritt erfüllt Interaktive Bedienelemente wie Links und Schaltflächen haben programmatisch ermittelbare Namen und Rollen.
Prüfschritt nicht anwendbar Die Seite enthält keine interaktiven Bedienelemente.

Was wird geprüft?

Falls nicht-semantische Elemente (etwa div oder span) mithilfe von JavaScript zu Links oder Bedienelementen umfunktioniert werden, wird die Semantik mit Hilfe von WAI-ARIA Rollen und Eigenschaften bereit gestellt.

Alle selbst gestalteten Komponenten einer Website (also Elemente oder Widgets, die nicht auf interaktiven HTML-Elementen beruhen) sind so umgesetzt, dass die semantischen Informationen (Name, Rolle, Eigenschaften) vorhanden sind. Werden nicht semantische Elemente (etwa div oder span) eingesetzt und mithilfe von JavaScript zu Bedienelmenten umfunktioniert, wird die Semantik mithilfe von WAI-ARIA bereitgestellt.

Die wechselnden Zustände der Bedienelemente werden nicht nur visuell über CSS und Javascript abgebildet, sondern auch über scriptgesteuerte Änderung der Werte der ARIA-Attriubte, damit die Semantik auch bei nicht-visueller Nutzung verfügbar ist.

Warum wird das geprüft?

Die üblichenStandard-HTML-Bedienelemente wie Links (a-Element) und Formularelemente (input, button, checkbox etc.) haben Namen, Rollen, Wert und Zustände, sofern sie gemäß Spezifikation umgesetzt sind und sind die für Hilfsmittel wie Screenreader generell erkennbar sind. So bekommen etwa blinde Nutzer mit, wenn sie auf einen Link tabben und können diesem dann folgen. Auch Zustände, beispielsweise einer Checkbox (ausgewählt oder nicht ausgewählt) werden vermittelt. Interaktive Schaltflächen sollten deshalb mit Hilfe von geeigneten HTML-Elementen umgesetzt werden, damit ihre Bedeutung klar wird.

Falls ungeeignete (weil nicht semantische) Elemente (etwa div oder span) mithilfe von JavaScript zu Links oder Bedienelementen umfunktioniert werden, kann die Semantik mit Hilfe von WAI-ARIA bereit gestellt werden. Dies betrifft auch Komponenten (Widgets wie z.B. Tabpanels, Akkordeons etc.), die in nativem HTML so nicht zur Verfügung stehen und mit Hilfe von nicht semantischen Elementen und Scripten umgesetzt sind. WAI-ARIA Attribute helfen, diese zu verstehen, indem semantische Informationen vom Browser an die Hilfsmitteltechnologien übermittelt werden.

Die WAI-ARIA Auszeichnung ist für viele Nutzer älterer Browser und Screenreader nicht erkennbar, deshalb ist diese Technik ohne geeignete Fallbacks nicht empfehlenswert. Dennoch wird hier geprüft, ob bei Verwendung nicht semantischer Elemente diese wenigstens für Nutzer neuerer Browser und Hilfsmittel zugänglich gemacht worden sind.

Wie wird geprüft?

1. Anwendbarkeit des Prüfschritts

Der Prüfschritt ist anwendbar, wenn die Seite interaktive Bedienelemente (Links, Formularelemente, oder programmierte Elemente, die auf onclick oder andere Event Handler reagieren) enthält.

2. Prüfung

  1. Seite im Firefox aufrufen
  2. Bedienelemente der Seite auf korrekte Semantik prüfen:
    • Gibt es offensichtliche Links oder Schaltflächen ohne href-Attribut? Dies lässt sich z.B. mit Hilfe der Web Developer Toolbar über die Funktion Informationen > Verweisdetails anzeigen feststellen.
    • Gibt es Formularelemente wie Checkboxen oder Radio-Buttons, die von der systemüblichen Darstellung abweichen, da sie mit anderen Elementen wie div oder img nachgebildet wurden?
    • Gibt es auf der Seite selbstgebaute Widgets wie etwa Schieberegler?
  3. Wenn keine solchen Bedienelemente vorhanden sind, ist der Prüfschritt erfüllt, die Prüfung wird abgebrochen.
  4. Seite im Internet Explorer aufrufen.
  5. Den aViewer in der Web Accessibility Toolbar öffnen und geskriptete Bedienelemente mittels Durchtabben mit dem Watch Fokus-Werkzeug oder - bei nicht tastatur-fokussierbaren Elementen - durch Darüberbewegen des Watch Cursor-Werkzeugs untersuchen. Dabei Ausgabe im aViewer beobachten (die Ausgabe reagiert etwas träge).
  6. Wenn im aViewer unter HTML > Element name unsemantische Elemente (etwa div, span oder auch a ohne href-Attribut) erscheinen, prüfen, ob dann über WAI-ARIA eine passende Rolle (etwa role="button") zugewiesen wird. Im Zweifelsfall die WAI-ARIA Role, State, and Property Quick Reference konsultieren.

  7. Prüfen, ob über WAI-ARIA Name, Eigenschaften und gegebenenfalls Zustände abgebildet werden. Im Zweifelsfall die WAI-ARIA Authoring Practices 1.1 konsultieren.
  8. Achtung: Beim Durchtabben erscheint der Eintrag [+] ARIA im Navigationsbaum auf der linken Seite des aViewers manchmal reduziert, obwohl die fokussierten Elemente ARIA-Rollen oder -Attribute haben. Die Untereinträge müssen dann durch Klick auf [+] ARIA ausgeklappt werden. (Außerdem tauchen ARIA-Rollen und -Eigenschaften auch innerhalb des JavaScript-Codes auf, der unten im aViewer angezeigt wird.)

  9. Grafische Zustandsänderungen durch den geskripteten Austausch von Bildern, die anstelle von Bedienelementen eingesetzt werden, müssen auch für Hilfsmittel verfügbare sinnvolle Änderungen von alt-Attributen bzw. WAI-ARIA Eigenschaften erzeugen.

3. Hinweise

Unsemantische Elemente wie span oder div sind nur dann mit der Tastatur fokussierbar, wenn das tabindex-Attribut gesetzt wurde. Falls das nicht der Fall ist, müssen Elemente also gegebenenfalls mit dem Cursor-Werkzeug des aViewers untersucht werden.

Für die Prüfung von komplexen Widgets sollte der Screenreader ergänzend genutzt werden. Ansonsten ist die stichprobenartige Prüfung mit dem Hilfsmittel sinnvoll.

4. Bewertung

Nicht erfüllt:

Wichtige Bedienelemente sind mit unsemantischen HTML-Elementen oder a-Elementen ohne href-Attribut umgesetzt, ohne dass die Semantik mit WAI-ARIA nachgebildet wurde.

Einordnung des Prüfschritts

Formulierung BITV 2.0

4.1.2 Name, Rolle, Wert

Für alle Komponenten der Benutzerschnittstelle sind Name und Rolle durch Programme erkennbar. Zustände, Eigenschaften und Werte, die von Nutzerinnen und Nutzern eingestellt werden können, können auch durch ein Programm gesetzt werden. Bei Änderungen dieser Zustände, Eigenschaften und Werte erhalten Benutzeragenten, einschließlich assistiver Technologien, eine Mitteilung.

Abgrenzung von anderen Prüfkriterien

In diesem Prüfschritt geht es nicht um die Bewertung der Tastaturbedienbarkeit geskripteter Bedienelemente. Dies ist Gegenstand von Prüfschritt 2.1.1a "Ohne Maus nutzbar".

Einordnung des Prüfschritts nach WCAG 2.0

Guideline

Success criterion

Techniques

General Techniques
HTML Techniques
ARIA Techniques

Failures

Quellen

WAI-ARIA Spezifikation

ARIA in HTML

ARIA-Widgets

Blättern: zum ersten Prüfschritt zum vorhergehenden Prüfschritt zum nächsten Prüfschritt zum letzten Prüfschritt