Warum jede Website tastaturbedienbar sein muss

Die WCAG 2.1 Richtlinie 2.1 „Über die Tastatur zugänglich“ (Keyboard Accessible) stellt sicher, dass alle Funktionen einer Website über die Tastatur bedienbar sind. Mit dem BFSG 2025 wird dies für deutsche Unternehmen zur rechtlichen Pflicht – und das ist gut so, denn Tastatur-Zugänglichkeit ist eine der fundamentalsten Anforderungen digitaler Barrierefreiheit.

Stellen Sie sich vor, Sie könnten Ihre Maus plötzlich nicht mehr benutzen. Vielleicht ist sie kaputt, die Batterie leer, oder Sie haben sich den Arm verletzt. Könnten Sie Ihre Website noch vollständig nutzen? Für Millionen von Menschen ist genau das die tägliche Realität: Blinde und sehbehinderte Nutzer navigieren ausschließlich mit der Tastatur und Screenreader, Menschen mit motorischen Einschränkungen verwenden spezielle Eingabegeräte, die Tastatureingaben simulieren, und viele Power-User bevorzugen die Tastatur aus Effizienzgründen. Wenn Ihre Website nicht vollständig per Tastatur bedienbar ist, schließen Sie all diese Menschen aus.

Wer ist auf Tastatur-Zugänglichkeit angewiesen?

Menschen mit motorischen Beeinträchtigungen können oft keine präzisen Mausbewegungen ausführen. Sie nutzen stattdessen die Tastatur oder spezialisierte Eingabegeräte wie Mundsteuerungen, Kopfzeiger oder adaptive Schalter, die alle Tastatureingaben simulieren. Blinde und stark sehbehinderte Nutzer arbeiten grundsätzlich mit der Tastatur in Kombination mit einem Screenreader, da der Bildschirm für sie nicht oder kaum sichtbar ist.

Dazu kommen temporäre Einschränkungen wie ein gebrochener Arm oder eine Sehnenscheidenentzündung, sowie Power-User, die bewusst Tastaturkürzel nutzen, weil sie damit schneller arbeiten können. Tastatur-Zugänglichkeit ist also nicht nur eine Frage der Barrierefreiheit, sondern auch der Benutzerfreundlichkeit für alle.

Tastatur und Maus auf einem Holztisch neben einer Tasse Kaffee und verstreuten Kaffeebohnen.

Geltungsbereich:

Gilt für alle Unternehmen, die mehr als 9 Beschäftigte haben oder deren Jahresumsatz 2 Millionen Euro übersteigt.

ONLINE -INTERAKTIONEN:

Webseiten, Plattformen, und Apps für den Austausch mit Kunden

Die wichtigsten Erfolgskriterien

Tastatur (Level A)

Alle Funktionalitäten einer Website müssen über die Tastatur zugänglich sein. Die einzige erlaubte Ausnahme betrifft Funktionen, die vom Pfad der Nutzerbewegung abhängen, wie etwa Freihand-Zeichnen.

Wichtige Tastatur-Navigation:

  • Tab: Vorwärts durch alle interaktiven Elemente
  • Shift + Tab: Rückwärts durch interaktive Elemente
  • Enter: Links und Buttons aktivieren
  • Leertaste: Buttons aktivieren, Checkboxen umschalten
  • Pfeiltasten: In Menüs navigieren, durch Tabs wechseln
  • Esc: Dialoge schließen, Aktionen abbrechen

 

Keine Tastaturfalle (Level A)

Nutzer dürfen niemals in einem Bereich gefangen werden, aus dem sie mit der Tastatur nicht mehr herauskommen. Dies ist ein kritischer Fehler, der die Website vollständig unbenutzbar macht.

Häufige Tastaturfallen:

  • Modale Dialoge ohne Esc-Funktion
  • Eingebettete iFrames ohne Escape-Mechanismus
  • Custom-Komponenten, die den Fokus einfangen
  • Video-Player ohne Tastatursteuerung

Wenn spezielle Tastenkombinationen nötig sind, dokumentieren Sie diese deutlich sichtbar. Besser ist es jedoch, Standard-Mechanismen zu verwenden.

Zeichen-Tastenkürzel (Level A)

Einzelzeichen-Shortcuts (z.B. „S“ für Suche) müssen bestimmte Regeln erfüllen, damit sie nicht mit Eingaben kollidieren oder Screenreader-Befehle überschreiben.

Anforderungen:

  • Abschaltbar: Nutzer können Shortcuts deaktivieren
  • Neubelegbar: Tastenkombinationen sind anpassbar
  • Nur bei Focus aktiv: Shortcuts funktionieren nur bei fokussiertem Element

 

Praktische Umsetzung

Logische Tab-Reihenfolge

Die Reihenfolge beim Tabben muss logisch sein und der visuellen Lesereihenfolge entsprechen. Sie wird durch die HTML-Struktur bestimmt – vermeiden Sie tabindex-Werte größer als 0.

Wichtige Regeln:

  • Navigation vor Hauptinhalt
  • Innerhalb von Bereichen der visuellen Anordnung folgen
  • Skip-Links am Anfang für schnelles Überspringen
  • Versteckte Elemente nicht fokussierbar machen

 

Focus-Indikatoren sichtbar machen

Der Focus-Indikator zeigt, welches Element gerade aktiv ist. Er ist für Tastatur-Nutzer essentiell und darf niemals komplett entfernt werden.

Grundregeln:

  • Niemals outline: none ohne Alternative
  • Deutlich sichtbar mit ausreichendem Kontrast (3:1)
  • Unterscheidbar vom Normal- und Hover-Zustand
  • Konsistent über die gesamte Website

Häufige Probleme vermeiden

Problem: Unsichtbare Focus-Indikatoren

Viele Designer entfernen Focus-Indikatoren aus ästhetischen Gründen, was die Website unbedienbar macht.

Lösung: Gestalten Sie eigene Focus-Indikatoren, die zur Gestaltung passen, aber deutlich sichtbar sind.

Problem: JavaScript-Komponenten ohne Tastatur-Support

Viele Komponenten funktionieren nur mit der Maus, besonders Custom Dropdowns oder Date-Picker.

Lösung: Wählen Sie barrierefreie Bibliotheken oder implementieren Sie Tastatur-Support selbst. Testen Sie jede Komponente ausschließlich mit der Tastatur.

Problem: Hover-abhängige Funktionen

Inhalte, die nur beim Mouse-Hover erscheinen, sind für Tastatur-Nutzer nicht zugänglich.

Lösung: Stellen Sie sicher, dass alles, was per Hover erreichbar ist, auch per Focus erreichbar ist.

BFSG 2025 und rechtliche Konsequenzen

Fehlende Tastatur-Zugänglichkeit ist einer der schwerwiegendsten Verstöße gegen die WCAG-Richtlinien. Sie macht Websites für große Nutzergruppen vollständig unbenutzbar und führt häufig zu Abmahnungen.

Besonders risikoreiche Bereiche:

  • Checkout-Prozesse in Online-Shops
  • Buchungssysteme und Formulare
  • Kundenkonten und Login-Bereiche
  • Interaktive Tools und Konfiguratoren

Unternehmen sollten Tastatur-Zugänglichkeit höchste Priorität einräumen, nicht nur aus rechtlichen Gründen, sondern weil sie fundamental für digitale Teilhabe ist.

BarriGo. unterstützt Sie gezielt bei der Verbesserung der Tastaturbedienbarkeit

Mit BarriGo.Live Inspect können Sie Ihre Website systematisch nach WCAG 2.1 prüfen. Die Lösung erkennt automatisch viele typische Probleme, z. B. fehlende Fokusindikatoren, nicht fokussierbare interaktive Elemente oder fehlerhafte Tab-Reihenfolgen. Einige Aspekte – insbesondere komplexe Tastaturinteraktionen in benutzerdefinierten Komponenten – erfordern weiterhin manuelle Tests, doch Live Inspect legt die technische Basis für eine effiziente Qualitätssicherung.

Parallel dazu bietet das BarriGo.Tool Nutzern praktische Unterstützung: Es macht Fokuszustände deutlich sichtbar, erleichtert die Navigation per Tastatur und kann individuell angepasst werden. So kombinieren Sie technische Prüfungen mit konkreten Bedienhilfen und schaffen eine Website, die wirklich für alle nutzbar ist.

👉 Jetzt BarriGo. testen: Melden Sie sich kostenlos an und erleben Sie, wie einfach Sie visuelle Barrieren identifizieren und reduzieren können.

Weiterführende Informationen finden Sie im offiziellen WCAG 2.2 Standard: WCAG 2.2 – Richtlinie 2.1 Tastaturbedienbarkeit