2.1.1 Tastatur

1. Was ist das Ziel dieses Kriteriums?

Nicht jeder kann eine Maus benutzen – und das aus ganz unterschiedlichen Gründen. Manche Menschen sind blind und können daher keine Zeiger verfolgen. Andere haben motorische Einschränkungen und können präzise Mausbewegungen nur schwer kontrollieren. Wieder andere nutzen assistive Technologien wie Sprachsteuerung oder Mundsteuerung.

Das Ziel von Erfolgskriterium 2.1.1 der WCAG ist daher glasklar: Alles, was du mit der Maus machen kannst, muss auch über die Tastatur funktionieren. So wird sichergestellt, dass jeder deine Website bedienen kann – unabhängig davon, welche Eingabemethode er verwendet.

Kurz gesagt: Jede Funktion, jeder Button, jedes interaktive Element muss auch ohne Maus erreichbar und bedienbar sein.

2. Was fordert das Erfolgskriterium genau?

Die Anforderung ist eigentlich simpel, aber weitreichend: Alle Funktionen deiner Website müssen über eine Tastaturschnittstelle bedienbar sein – ohne dass spezielle Zeitanforderungen für einzelne Tastaturanschläge nötig sind.

Konkret bedeutet das:

  • Alle Buttons, Links und Formularelemente müssen per Tab-Taste erreichbar sein
  • Interaktive Elemente müssen sich per Enter-Taste oder Leertaste aktivieren lassen
  • Navigation durch Menüs muss mit Pfeiltasten möglich sein
  • Drag-and-Drop-Funktionen brauchen Tastatur-Alternativen (z.B. Ausschneiden/Einfügen)
  • Modale Dialoge müssen per Escape-Taste schließbar sein

Eine wichtige Ausnahme gibt es: Funktionen, die zwingend auf die Bewegungsrichtung angewiesen sind – wie freihändiges Zeichnen oder Aquarellmalerei – müssen nicht tastaturzugänglich sein. Aber Achtung: Das bezieht sich nur auf die grundlegende Funktion, nicht auf die Eingabetechnik. Ein Textfeld bleibt ein Textfeld, auch wenn jemand per Handschrift darauf schreibt.

3. Warum ist das wichtig für Barrierefreiheit?

Stell dir vor, du surfst im Internet, aber deine Maus ist kaputt – frustrierend, oder? Für viele Menschen ist das Alltag. Blinde Menschen können Mauszeiger nicht sehen, Menschen mit Tremor können sie nicht präzise steuern, und Menschen mit Tetraplegie nutzen oft alternative Eingabegeräte.

Tastaturzugänglichkeit schafft echte Teilhabe, weil sie:

  • Blinden Menschen ermöglicht, mit Screenreadern alle Funktionen zu nutzen
  • Menschen mit motorischen Einschränkungen alternative Eingabegeräte verwenden lässt
  • Nutzern von Sprachsteuerung den Zugang über simulierte Tastatureingaben eröffnet
  • Menschen mit Sehbehinderungen das Navigieren ohne Mausverfolgung ermöglicht
  • Temporary eingeschränkten Personen hilft (z.B. mit Gips am Arm)

Und nicht zuletzt: Viele Power-User arbeiten sowieso lieber mit Tastaturkürzeln – sie sind oft schneller als die Maus.

4. So setzt du das Kriterium erfolgreich um

Die gute Nachricht: Moderne Browser und Frameworks machen vieles automatisch richtig. Aber ein paar bewährte Praxis-Tipps gibt es trotzdem:

Die Grundregeln:

  • Verwende semantisches HTML: <button>, <a>, <input> statt generische <div>-Elemente
  • Achte auf eine logische Tab-Reihenfolge – wichtige Elemente zuerst, von links nach rechts, von oben nach unten
  • Sorge für sichtbare Fokus-Indikatoren – Nutzer müssen sehen, wo sie gerade sind
  • Implementiere Tastaturkürzel für häufige Aktionen
  • Biete Skip-Links für wiederkehrende Navigation

Für interaktive Elemente:

  • Buttons: Per Enter-Taste und Leertaste aktivierbar
  • Links: Per Enter-Taste aktivierbar
  • Formulare: Per Tab navigierbar, per Enter absendbar
  • Dropdown-Menüs: Per Pfeiltasten und Enter bedienbar
  • Modale Dialoge: Per Escape schließbar, Fokus beim Öffnen und Schließen korrekt setzen

Technische Umsetzung:

  • Event-Handler sowohl für Maus (onclick) als auch Tastatur (onkeydown) setzen
  • ARIA-Attribute für custom Controls nutzen: role, aria-label, aria-expanded
  • tabindex nur sparsam einsetzen – meist ist er nicht nötig
  • Bei complex Widgets Libraries wie React-ARIA oder ähnliche verwenden

Tools zum Testen:

  • Einfach mal die Maus weglegen und nur mit Tab, Enter, Escape und Pfeiltasten navigieren
  • Browser-Entwicklertools nutzen – sie zeigen oft Fokus-Probleme an
  • Screenreader-Software testen (NVDA ist kostenlos)

5. Warum dieses Erfolgskriterium für Unternehmen relevant ist

Tastaturzugänglichkeit ist kein nettes Add-on – sie ist ein echter Business-Vorteil, der sich in verschiedenen Bereichen auszahlt.

1. Zielgruppe erweitern

In Deutschland leben etwa 7,8 Millionen Menschen mit Schwerbehinderungen – das ist ein Markt von mehreren Millionen potentiellen Kunden. Dazu kommen Menschen mit temporären Einschränkungen, ältere Nutzer und Power-User, die Tastaturkürzel bevorzugen. Mit tastaturzugänglichen Websites schließt du niemanden aus.

2. Produktivität steigern

Viele deiner eigenen Mitarbeiter arbeiten effizienter mit Tastaturkürzeln – besonders in datenintensiven Anwendungen. Eine gut durchdachte Tastaturnavigation macht Software schneller und angenehmer nutzbar. Das reduziert Schulungsaufwand und erhöht die Mitarbeiterzufriedenheit.

3. Technische Robustheit verbessern

Tastaturzugänglichkeit geht oft Hand in Hand mit sauberem, semantischem Code. Das macht deine Website robuster für verschiedene Geräte, Browsererweiterungen und zukünftige Technologien. Außerdem profitieren automatisierte Tests und Web-Scraping von eindeutigen, programmatisch erkennbaren Elementen.

Und nicht zuletzt: Rechtssicherheit und Fördermöglichkeiten. Das Behindertengleichstellungsgesetz und die BITV 2.0 fordern digitale Barrierefreiheit für öffentliche Stellen bereits verpflichtend. Auch der European Accessibility Act kommt 2025 – wer vorbereitet ist, hat klare Vorteile bei Ausschreibungen und Förderanträgen.

6. Das Erfolgskriterium im Wortlaut der W3C

Erfolgskriterium 2.1.1 Tastatur (Stufe A)

Alle Funktionalitäten des Inhalts sind über eine Tastaturschnittstelle bedienbar, ohne dass spezifische Zeiteinteilungen für einzelne Tastatureingaben erforderlich sind, außer wenn die zugrundeliegende Funktion Eingaben erfordert, die vom Pfad der Nutzerbewegung und nicht nur von den Endpunkten abhängen.

Anmerkung 1: Diese Ausnahme bezieht sich auf die zugrundeliegende Funktion, nicht auf die Eingabetechnik. Wenn beispielsweise Handschrift zur Texteingabe verwendet wird, erfordert die Eingabetechnik (Handschrift) pfadabhängige Eingaben, aber die zugrundeliegende Funktion (Texteingabe) nicht.

Anmerkung 2: Dies verbietet nicht und soll auch nicht davon abhalten, zusätzlich zur Tastaturbedienung Mauseingaben oder andere Eingabemethoden bereitzustellen.

← Zurück zur WCAG-Übersicht