Hintergrund
- Tastatur:
- schnell
- effektiv
- Maus:
- mühsam
- langsam
In der EU treten ab dem Juni 2025 neue und strengere Regelungen für Barrierefreiheit auch bei Software in Kraft (EU-Richtlinie 2019/882). Es scheint also an der Zeit, dass Software durchgehend Barrierefei wird. Ein Aspekt von Barrierefei ist es, Software so zu programmieren, dass eine sinnvolle Tastaturbedienung möglich ist.
Meiner Erfahrung nach sind viele Software-Entwickler der Auffassung, es sei extrem aufwendig Web-Sites so zu programmieren, dass eine Tastaturbedienung möglich ist. In Wahrheit ist das aber gerade bei Web-Sites relativ einfach möglich.
Außerdem wird in diesen Zusammenhang gerne auf die Tab-Taste verwiesen, die ja grundsätzlich immer verfügbar ist. Das stimmt zwar, ist aber meist kein Ersatz für Tastenkombinationen, die bestimmte Elemente direkt ansprechen. Welcher Benutzer möchte immer wieder unzählige Male Tab drücken müssen, um zum Ziel zu kommen? Hinzu kommt, dass es oft sehr schwer ist nachzuverfolgen, welches Element jeweils den Fokus hat.
Umsetzung
Diese Web-Site zeigt wie es geht. Web-Entwickler können und dürfen sich alle Aspekte in der Oberfläche selbst und im Debug-Modus des Browsers ansehen.
Tastenkombinationen festlegen und verwalten
Es ist wichtig, Tastenkombinationen zu wählen, die nicht mit den Tastenkombinationen des Browsers in Konflikt stehen. Die guten Nachrichten: die gängigsten Browser verwenden mehr oder weniger dieselben Tastenkombinationen. Das Web (LLMs) liefert auf Anfrage entsprechende Listen.
Empfehlung
- Während der Entwicklung der Bedieneroberfläche eine Liste der verfügbaren (und vom Browser nicht verwendeten) Tastenkombinationen aufbauen.
- Bei Seiten, die keine Eingabefelder haben, tut es auch ein einfacher Tastendruck wie irgendein Buchstabe oder eine Zahl. Es muss also nicht immer eine Tastenkombination sein.
Programmierung
Das Modul '/res/keyboardControl.js' in diesem Web zeigt exemplarisch was notwendig ist (ziemlich wenig und minimaler Zeitaufwand). Durch das Einbinden eines solchen Skripts auf den jeweiligen Seiten werden die Tastaturbindungen aktiviert. Zusätzlich sollten die Link-Texte ('a/href'-Tags) um eine Anzeige für die Tastenkombinationen ergänzt (dazu unten mehr).
Im Fall dieser Web-Site und so wie sie aufgesetzt ist, können die Tastenkombinationen für den Kopf- und den Fussbereich zentral im einem Modul (hier: '/res/keyboardControl.js) gesteuert werden. Tastenkombinationen, die speziell für einzelne Seiten gelten, müssen im Gegensatz dazu natürlich auf den jeweiligen Seiten mit einem eigenen Skriptblock definiert werden.
Tastenkombinationen anzeigen
Natürlich nützen die Tastenkombinationen wenig, wenn der Benutzer nicht weiß, dass es welche gibt. Deswegen sind Styles definiert, die die entsprechenden Tastenkombinationen anzeigen. Abhängig davon, ob die Seiten auf einen Desktop-Browser oder einem mobilen Gerät angezeigt werden, werden die Tastenkombinationen angezeigt oder nicht.
Einschränkungen
Anzeige der Tastenkombination
Die Anzeige der Tastenkombinationen nimmt relativ viel Platz ein, was etwas unschön ist. Eine bessere Lösung habe ich nicht gefunden. Ein Tooltipp scheint mir keine Lösung zu sein, denn wenn man erst die Maus auf das Element schieben muss, um die Tastenkombinationen zu sehen, ist der ganze Sinn nicht mehr gegeben.
Ob das unterdrücken der Anzeige der Tastenkombinationen auf allen Mobilgeräten immer zuverlässig funktioniert, weiß ich nicht. Es kann Situationen geben (insbesondere auf Tablets), in denen das nicht funktioniert und die Tastenkombinationen ungewollt doch erscheinen.
Probleme mit dem Eingabefokus
Nutzer können irritiert sein, wenn die Tastenkombinationen manchmal nicht zu funktionieren scheinen. Das passiert, wenn das Browserfenster zwar im Vordergrund zu sein scheint, das Browserfenster aber nicht den Fokus hat oder wenn der Anzeigebereich des Browsers nicht den Fokus hat, sondern z. B. die Adressleiste. Hier weiß ich keine bessere Lösung als zu versuchen, den Anwender auf das Problem aufmerksam zu machen, so wie es in Hinweise zur Bedienung der Web-Site per Tastatur: Alt-X drücken gemacht ist.
Client-Seitiges Skripting
Die Umsetzung erfordert JavaScript (JS) - also Client-Seitiges Skripting. Obwohl JS mittlerweile sehr weit verbreitet ist, ist das mit Sicherheitsrisiken verbunden. Das gilt sowohl für vom Entwickler ungewollte Sicherheitslücken als auch für gewolltes auspoinieren von Benutzerdaten und Benutzerverhalten. Ich sehe das kritisch aber leider gibt es keine mir bekannte Alternative.
Selbstverständlich benutze ich keine Spoinagefunktionen (Benutzerdaten und Benutzerverhalten wird nicht gespeichert). Und ich binde keine fremden Dienste ein, die das tun könnten.
Außerdem sind die Skripte so aufgesetzt, dass Sicherheitsrisiken soweit wie möglich vermieden werden.