Stellen Sie sich Ihre Website wie ein Gebäude vor, in dem manche Besucherinnen und Besucher nur mit einer Fernbedienung – der Tastatur – unterwegs sind. Die WCAG-Regeln sorgen dafür, dass diese Menschen jedes Zimmer nutzen können:
- Alles muss per Tastatur erreichbar sein (2.1.1)
Jede Schaltfläche, jeder Link und jedes Formularfeld soll sich allein mit Tab-, Pfeil- oder Enter-Taste bedienen lassen. Es darf kein Zeitdruck entstehen. - Keine „Fokus-Falle“ (2.1.2)
Öffnet sich ein Pop-up oder rutscht ein Menü von der Seite herein, darf der Tastaturfokus dort nicht steckenbleiben. Die Esc-Taste muss das Fenster schließen, und der Fokus kehrt dorthin zurück, wo er vorher war. - Keine Ausnahmen, auch bei Spezialfunktionen (2.1.3)
Selbst ausgefallene Elemente – zum Beispiel Drag-and-Drop-Bereiche oder Zeichenprogramme – brauchen eine tastaturfreundliche Alternative, etwa Auf-/Ab-Schaltflächen. - Ein-Tasten-Kurzbefehle müssen anpassbar sein (2.1.4)
Wenn ein einzelner Buchstabe oder ein Symbol etwas auslöst, sollen Nutzende diesen Kurzbefehl abschalten oder auf eine andere Taste legen können. Ein kleiner Einstellungsdialog genügt.
2. Typische Stolpersteine und wie Sie sie blitzschnell beseitigen
- Datumsauswahl ohne Textfeld
Bieten Sie zusätzlich zum Kalender ein normales Datumsfeld an. So kann jeder das Datum direkt eintippen. - Individuell gestaltete Schieberegler
Lassen Sie die Werte auch mit den Pfeiltasten ändern und geben Sie Screenreadern den aktuellen Wert über ein unsichtbares Etikett weiter. - Video-Player ohne Tastenkürzel
Sorgen Sie dafür, dass zentrale Funktionen per Leertaste, M (Stummschalten) oder Pfeiltasten steuerbar sind. - Unsichtbarer Tastaturfokus
Versehen Sie den Fokusrahmen mit deutlichem Kontrast (mindestens 3 : 1). Entfernen Sie ihn nicht per outline: none.
Mit diesem Kurztest entdecken Sie in wenigen Minuten, ob Ihre Website wirklich tastaturfreundlich ist – von der Tab-Reihenfolge über sichtbare Fokusmarkierungen bis hin zum schnellen Audit mit Prüf-Tools.
- Tab-Test: Mit Tab vorwärts, mit Shift + Tab rückwärts durch alle Elemente springen – ist die Reihenfolge logisch?
- Fokus sichtbar machen: Der aktive Bereich braucht einen gut erkennbaren Rahmen oder Hintergrund.
- Enter & Leertaste überall aktiv: Jedes anklickbare Element muss auf diese Tasten reagieren.
- Kurzbefehle dokumentieren: Listen Sie alle Tastaturkürzel auf und geben Sie eine Einstellmöglichkeit.
- Praxis-Test: Bitten Sie Testpersonen, die Seite rein mit Tastatur und Screenreader zu nutzen.
- Automatischer Audit: Tools wie axe oder Lighthouse liefern einen schnellen Prüfbericht und konkrete Verbesserungsvorschläge.
Eine tastaturfreundliche Website ist kein Luxus, sondern ein selbstverständliches Qualitätsmerkmal – vergleichbar mit gutem Kundenservice. Mit wenigen, oft schnell umsetzbaren Anpassungen beseitigen Sie die größten Barrieren und schaffen ein Angebot, das wirklich alle Menschen nutzen können. Gleichzeitig verbessern Sie die Rechtssicherheit, die Nutzerzufriedenheit und Ihr Suchmaschinenranking. Kurz: Barrierefreiheit zahlt sich für alle aus.