Prüfpunkt 2.1.2Stufe ATastatur und Fokus
Was ist eine Tastaturfalle auf einer Website?
Eine Tastaturfalle ist eine Stelle auf einer Website, an der die Tastatur-Markierung hängen bleibt: Wer mit der Tabulatortaste hineingerät, kommt mit der Tastatur allein nie wieder heraus. Für Menschen ohne Maus endet die Seite an dieser Stelle — weiterlesen, bestellen oder das Formular absenden ist unmöglich. Häufige Auslöser sind Datumswähler, Chat-Fenster, eingebettete Videos und Bildergalerien. Das WCAG-Kriterium 2.1.2 verbietet solche Fallen.
So entsteht eine Tastaturfalle
Die meisten Tastaturfallen baut niemand absichtlich. Sie entstehen durch fertige Bausteine von Drittanbietern: Ein Datumswähler fängt den Fokus ein, damit seine Kalendertage per Pfeiltaste erreichbar sind — und vergisst den Ausgang. Ein Chat-Fenster hält die Markierung in seinem Eingabefeld fest. Ein selbstgebautes Dialogfenster ohne Schließen-Schaltfläche lässt den Fokus zwischen seinen zwei Knöpfen kreisen. Mit der Maus fällt das nie auf, denn Mausnutzer klicken einfach daneben. Genau deshalb bleiben Tastaturfallen oft monatelang unentdeckt, während Tastaturnutzer die Seite in dieser Zeit an derselben Stelle aufgeben.
So misst der Prüfservice die Tastaturfalle
Der Prüfservice drückt auf Ihrer Seite echt die Tabulatortaste und protokolliert jeden Halt mit Position und Element. Kreist die Markierung zwischen denselben wenigen Elementen, ohne das Dokument-Ende zu erreichen, wertet er das als Tastaturfalle. Der Bericht benennt die beteiligten Elemente und legt ein Beleg-Bildschirmfoto bei. Kreist der Fokus innerhalb eines eingebetteten Rahmens eines Fremdanbieters, vermerkt der Bericht den Fall zur manuellen Prüfung — dort lässt sich maschinell nicht sicher entscheiden, ob es einen Ausweg gibt. Erreicht die Messung das Dokument-Ende ohne Kreisen, gilt das Kriterium als bestanden.
Beispiele
Dialog ohne Ausgang
<div role="dialog" aria-modal="true">
<p>Newsletter?</p>
<input type="email">
<!-- kein Schließen-Knopf, Escape ohne Wirkung -->
</div><dialog id="nl">
<p>Newsletter?</p>
<input type="email">
<button type="button" onclick="nl.close()">Schließen</button>
</dialog>
<!-- dialog schließt mit Escape von selbst -->Aus jedem Bereich muss die Tastatur wieder herauskommen: mit Tab, Escape oder einem beschriebenen Weg.
So gehen Sie es an
- Tabben Sie einmal komplett durch Ihre Startseite bis zum Fußbereich — bleiben Sie irgendwo hängen, haben Sie die Falle gefunden.
- Prüfen Sie jeden neu eingebauten Fremdbaustein einzeln: Datumswähler, Chat-Fenster, Karussell, Videoplayer.
- Bitten Sie Ihre Agentur, jedem Dialogfenster eine per Tastatur erreichbare Schließen-Möglichkeit zu geben, mindestens die Escape-Taste.
- Testen Sie nach jedem Update der eingebauten Bausteine erneut — eine neue Version kann eine Falle einführen.
Weiter im Prüfbereich Barrierefreiheit
- Warum brauchen Tastenkürzel aus einem einzelnen Buchstaben eine Abschaltung?Kürzel aus einem einzelnen Buchstaben lösen bei Sprachsteuerung ungewollt aus. WCAG 2.1.4 verlangt: abschaltbar, umbelegbar oder nur bei Fokus aktiv.
- Warum müssen Zeitlimits auf Websites verlängerbar sein?Zeitlimits müssen abschaltbar, anpassbar oder verlängerbar sein, weil Menschen unterschiedlich schnell arbeiten. Das verlangt WCAG-Kriterium 2.2.1.
- Warum brauchen bewegte Inhalte auf Websites eine Pause-Funktion?Alles, was sich länger als fünf Sekunden automatisch bewegt, muss sich pausieren, stoppen oder ausblenden lassen. Das verlangt WCAG-Kriterium 2.2.2.
- Wie oft darf eine Website pro Sekunde aufblitzen?Höchstens dreimal pro Sekunde darf eine Website blitzen. Der WCAG-Grenzwert schützt Menschen mit photosensitiver Epilepsie vor Anfällen.
Dieser Prüfpunkt gehört zum Prüfbereich Barrierefreiheit; dort stehen alle Prüfpunkte im Überblick. Was die Prüfung insgesamt leistet, zeigt die Leistungsseite; wie ein Ergebnis zustande kommt, erklärt das Prüfverfahren. Alle Prüfbereiche im Überblick: Wissensbasis.
Foto: Glenn Carstens-Peters, CC0
.jpg){kind=link}