WCAG 2.1 - 2.1.4
Character Key Shortcuts
Wenn ein Tastenkürzel in Inhalten implementiert ist, das nur Buchstaben (einschließlich Groß- und Kleinbuchstaben), Satzzeichen, Zahlen oder Symbolzeichen verwendet, dann trifft mindestens eines der folgenden Kriterien zu:
Inhalt
Was steht in den Guidelines zum Success Criterium 2.1.4 - Character Key Shortcuts?Was Bedeutet das Success Criterium 2.1.4 - Character Key Shortcuts?Warum ist es so wichtig, das Success Criterium 2.1.4 - Character Key Shortcuts zu beachten?Was hat das Success Criterium 2.1.4 - Character Key Shortcuts mit dem BFSG zu tun?Lösungen für 2.1.4 - Character Key Shortcuts anhand von CodebeispielenWie löse ich Verstöße gegen das Success Criterium 2.1.4 - Character Key Shortcuts?Was steht in den Guidelines zum Success Criterium 2.1.4 - Character Key Shortcuts?
Implementationshinweise
- Turn off: Ein Mechanismus steht zur Verfügung, um die Verknüpfung auszuschalten;
- Remap: Ein Mechanismus steht zur Verfügung, um die Tastenkombination neu zuzuordnen, um eine oder mehrere nicht druckbare Tastaturtasten (z. B. Ctrl, Alt) einzuschließen;
- Active only on focus: Der Tastenkürzel für ein Benutzeroberflächenkomponente ist nur aktiv, wenn diese Komponente den Fokus hat.
Was Bedeutet das Success Criterium 2.1.4 - Character Key Shortcuts?
Das Erfolgskriterium 2.1.4 der WCAG betrifft Tastenkombinationen (Shortcuts), die nur aus einzelnen Zeichen bestehen (z. B. das Drücken einer Taste wie 'A' ohne Modifizierer wie Shift, Alt oder Ctrl). Solche Shortcuts können zu Problemen führen, insbesondere für Menschen, die alternative Eingabemethoden wie Spracherkennung oder Schaltersteuerungen nutzen. Diese Personen könnten versehentlich Shortcuts auslösen, die nicht beabsichtigt waren. Das Kriterium fordert deshalb:
- Wenn eine einzelne (character) Taste als Shortcut verwendet wird, muss eine der folgenden Möglichkeiten gegeben sein:
- Der Shortcut kann deaktiviert werden,
- Der Shortcut kann auf eine Kombination umgestellt werden (z. B. nicht nur 'A', sondern 'Alt+A'),
- Die Funktion des Shortcuts ist nur aktiv, wenn das entsprechende UI-Element fokussiert ist.
Wenn Sie Tastaturkürzel auf Ihrer Website einsetzen, prüfen Sie bitte, ob diese ohne Modifikatortaste auskommen und überlegen Sie, wie Sie Nutzenden ermöglichen können, sie abzuschalten oder umzubelegen.
Warum ist es so wichtig, das Success Criterium 2.1.4 - Character Key Shortcuts zu beachten?
Viele Menschen mit Behinderungen nutzen alternative Eingabemethoden. Dort kann es passieren, dass Buchstaben gedrückt werden, ohne dass dies gewollt ist (zum Beispiel durch Spracherkennung oder andere Hilfsmittel). Wenn dann unerwartet Funktionen ausgelöst werden, kann das die Bedienung der Seite unmöglich machen oder sogar zu Datenverlust führen. Es ist daher wichtig, Nutzenden die Kontrolle über solche Shortcuts zu geben.
Was hat das Success Criterium 2.1.4 - Character Key Shortcuts mit dem BFSG zu tun?
Das BFSG (Barrierefreiheitsstärkungsgesetz) schreibt die Einhaltung der EN 301 549 und damit der WCAG 2.1-Level AA vor. SC 2.1.4 ist Teil dieses Standards. Wenn Ihre Website einzelne Zeichen (zum Beispiel Buchstaben) als Tastenkurzbefehle verwendet, OHNE die Möglichkeit diese zu deaktivieren, umzubelegen oder solche Shortcuts an den Fokus zu binden, ist Ihre Website nicht BFSG-konform. Sie riskieren damit rechtliche Konsequenzen und schließen Nutzer:innen von der Bedienbarkeit Ihrer Angebote aus.
Lösungen für 2.1.4 - Character Key Shortcuts anhand von Codebeispielen
Falscher Code
<input onkeydown="if(event.key==='b'){boldText();}" placeholder="Type some text...">Korrekter Code
<input onkeydown="if(event.altKey && event.key==='b'){boldText();}" placeholder="Type some text...">
<!-- oder: --><input id="editor" onkeydown="if(event.key==='b' && event.target === document.activeElement){boldText();}">Im schlechten Beispiel wird beim Drücken von 'b' – egal wo und wann – die Funktion ausgelöst. Das kann zu Konflikten und ungewollter Aktivierung führen, insbesondere für Nutzer:innen von Sprachsteuerung. Im guten Beispiel wird die Funktion nur durch 'Alt+b' ausgelöst (eine Modifikator-Taste ist nötig) oder der Shortcut reagiert nur, wenn das Eingabefeld fokussiert ist. So wird versehentliches Auslösen verhindert.
Falscher Code
document.addEventListener('keydown', (e) => {
if(e.key === 's') save();
});Korrekter Code
let shortcutsEnabled = true;
document.addEventListener('keydown', (e) => {
if(shortcutsEnabled && e.altKey && e.key === 's') save();
});
// Eine Option in den Einstellungen könnte z.B. shortcutsEnabled = false setzen.Im schlechten Beispiel ist 's' allein ein globaler Shortcut, der immer funktioniert – das ist problematisch. Im guten Beispiel wird eine Modifikator-Taste genutzt UND der Shortcut kann in den Einstellungen deaktiviert werden.
Wie löse ich Verstöße gegen das Success Criterium 2.1.4 - Character Key Shortcuts?
Unser Accessibility Audit bietet Ihnen die Möglichkeit, mittels unseres AI-basierten Barrierefreiheits-Assistenten, vollautomatisch konkrete Lösungsvorschläge für Ihre Seite zu erstellen. Dafür scannen wir Ihre Website und ihren Quellcode, finden Problemstellen und zeigen Ihnen anhand Ihres eigenen Websitecode fertige Lösungen zum Kopieren und Einfügen. Starten Sie jetzt den Accessibility Audit kostenlos.