Mit der Tabulatortaste durch die Elemente navigieren, mit ihnen interagieren und sicherstellen, dass sie sich entsprechend den Erwartungen verhalten: Aktivieren durch Enter oder Leertaste, weitere Interaktionsmöglichkeiten oft durch Pfeiltasten.
Navigation und Interaktion
Tabulator-Taste
Den Fokus vorwärts oder rückwärts bewegen, mit der Tabulatortaste. Vorwärts –> Tab (⇥), Tab (⇥), Tab (⇥) Rückwärts –> Shift + Tab (⇧⇥), Shift +Tab (⇧⇥)
Link oder Button/Schalter aktivieren
Mit der Enter-Taste (↵) aktivierst du den Link, ist dasselbe wie wenn du mit der Maus klickst. Löst eine Aktion aus, wie zum Beispiel ein Formular absenden.
Formularfelder
Die Textfelder erreichst du mit der Tab-Taste, diese können auf gewohnter Weise ausgefüllt werden.
Pfeil-Tasten
Pfeil runter oder auf rauf wählt Radio-Buttons aus. Auch Auswahllisten kann von einer Option zur weiteren Option gesprungen werden. Mit dem Pfeil nach unten kann schrittweise gescrollt werden. (⇩) (⇧) (⇨) (⇦)
Leertasten
Mit der Leertaste kann die Option von einer Auswahlliste bestätigt werden. (␣)
Escape
Mit dieser Esc-Taste (⎋) kann ein Popup oder sonstige Elemente geschlossen werden.
Optimale Nutzung für alle
Alle Funktionen auf der Webseite sollten ohne Maus nutzbar sein.
Menschen mit motorischen Einschränkungen sollten die Webseite problemlos bedienen können.
Die Navigation innerhalb der Webseite sollte einfach per Tastatur möglich sein.
Es sollte eine Option geben, Tastaturkurzbefehle zu deaktivieren.
Visuelle Hinweise sollten klar anzeigen, welches Element gerade fokussiert ist.
Alle interaktiven Elemente müssen mit der Tastatur bedienbar sein.
Überprüfe deine Website oder auch andere Websiten
Klicke mit der Tabulatortaste durch die Website.
Ist die Reihenfolge logisch aufgebaut?
Sind alle fokussierbaren Elemente visuell sichtbar? Die Browser heben standardmässig das angesprungene Element mit einer gestrichelten Umrandung hervor.
Kannst du alle Elemente bedienen?
Steckst du in einer Komponente wie ein Pop-up-Fenster der Webite fest und kommst nicht mehr heraus? Vermeide Tastaturfallen.
Das Drop-Downmenü?
Formularfelder?
Teste nur mit der Tastatur auf einer Website zur Reisebuchung die Zugänglichkeit von Funktionen, wie etwa der Auswahl von Flügen und Datumsangaben. Und wie hat es geklappt?
Teste auf verschiedenen Websiten den Cookie-Banners mit der Tastatur, kannst du bestätigen und kommst in den Inhalt der Website?
