←  Alle Begriffe
T
Barrierefreiheit

Tastaturnavigation

Tastaturnavigation ermöglicht die vollständige Bedienung einer Oberfläche ohne Maus oder Touchscreen.

Bei guter Tastaturnavigation lassen sich alle interaktiven Elemente in einer sinnvollen Reihenfolge erreichen und bedienen. Wichtig sind dabei klar sichtbare Fokuszustände, nachvollziehbare Tab-Reihenfolgen und die Unterstützung gängiger Tastaturinteraktionen. Die Umsetzung sollte möglichst auf nativen Webstandards basieren und durch Tests mit Tastatur sowie assistiven Technologien überprüft werden. Eng verbunden ist der Begriff mit Fokus-Indikator und Barrierefreiheit.

Weiterlesen

Fokus-Indikator

Barrierefreiheit

ARIA

FAQ

Tastaturnavigation

Welche Fehler treten bei Tastaturnavigation häufig auf?
Per CSS entfernte Fokusmarkierungen, klickbare div-Elemente ohne Tastaturzugriff, Fokusfallen in Modals und Menüs sowie eine Tab-Reihenfolge, die der visuellen Ordnung widerspricht. Auch fehlende Skip-Links verlängern Wege. Die meisten Fehler entstehen durch eigene Bausteine anstelle nativer Elemente. Ein kurzer Tab-Durchlauf deckt diese Probleme meist schnell auf.
Warum ist Tastaturnavigation für Barrierefreiheit relevant?
Menschen mit motorischen Einschränkungen sowie Nutzer von Screenreadern und Schaltern bedienen Oberflächen nicht per Maus. Fehlt die Tastaturbedienung, sind Inhalte und Funktionen für sie nicht erreichbar. Die WCAG verlangen sie bereits auf Stufe A. Auch Vielnutzer profitieren von schnellerer Bedienung.
Wie wird Tastaturnavigation in der Praxis getestet?
Mit der Tastatur allein: Maus beiseitelegen, die Seite mit Tab durchlaufen und prüfen, ob jedes interaktive Element erreichbar, bedienbar und sichtbar fokussiert ist. Zu beachten sind Reihenfolge sowie Fokusfallen in Dialogen und Menüs. Automatisierte Tools finden nur einen Teil der Probleme, deshalb bleibt der manuelle Test nötig.
Welche Tasten sind bei Tastaturnavigation üblich?
Tab und Umschalt+Tab bewegen den Fokus vor und zurück, Enter aktiviert Links und Buttons, die Leertaste Buttons und Checkboxen, Pfeiltasten steuern Auswahlgruppen und Menüs, Escape schließt Dialoge. Native HTML-Elemente bringen dieses Verhalten mit, eigene Widgets müssen es nachbauen. Abweichungen von diesen Mustern verwirren Nutzer und sollten vermieden werden.