Viele Menschen bedienen Websites nicht mit der Maus. Manche nutzen die Tastatur, andere spezielle Eingabegeräte, Screenreader, Schaltersteuerung oder Sprachsteuerung. Und genau deshalb ist die Tastaturbedienung einer der wichtigsten Tests für Barrierefreiheit.
Das Gute daran: Du brauchst für einen ersten Test kein teures Tool und keine komplizierte Software. Du brauchst nur deine Website, eine Tastatur und ein bisschen Geduld.
Der Test ist simpel: Maus weglegen und schauen, ob du trotzdem ans Ziel kommst.
Klingt einfach. Ist es aber oft nicht. Denn dabei fallen Probleme auf, die man mit der Maus nie bemerkt: unsichtbarer Fokus, unlogische Reihenfolge, nicht erreichbare Buttons, Dropdowns, die nicht öffnen, Cookie-Banner, die alles blockieren, oder Popups, aus denen man nicht mehr herauskommt.
Warum Tastaturbedienung so wichtig ist
Eine Website ist erst dann wirklich gut bedienbar, wenn wichtige Funktionen nicht von einer Maus abhängig sind.
Das betrifft zum Beispiel:
Menüs, Links, Buttons, Kontaktformulare, Buchungskalender, Warenkörbe, Checkouts, Login-Bereiche, Cookie-Banner, Popups, Filter, Tabs und Akkordeons.
Wenn eines dieser Elemente nur mit der Maus funktioniert, schließen wir Menschen aus. Und selbst für Nutzer ohne dauerhafte Einschränkung kann das problematisch sein. Vielleicht ist die Maus kaputt. Vielleicht wird ein Tablet mit Tastatur genutzt. Vielleicht kann jemand wegen einer Verletzung gerade nicht gut klicken.
Barrierefreiheit ist hier also nicht nur ein Spezialthema. Sie macht die Website robuster und einfacher nutzbar.
Die wichtigsten Tasten für den Test
Für einen ersten Tastaturtest reichen wenige Tasten.
Tab springt zum nächsten bedienbaren Element.
Shift + Tab springt zurück.
Enter aktiviert Links und viele Buttons.
Leertaste aktiviert Checkboxen, Buttons oder Schalter.
Pfeiltasten steuern oft Dropdowns, Radio-Buttons, Slider oder Menüs.
Escape sollte Menüs, Popups oder Dialogfenster schließen.
Mehr brauchst du am Anfang nicht.
Wenn du mit diesen Tasten nicht durch eine Website kommst, liegt sehr wahrscheinlich ein Problem vor.
Schritt 1: Maus wirklich weglegen
Der häufigste Fehler beim Testen: Man nutzt doch zwischendurch die Maus.
Nicht machen.
Lege die Maus bewusst zur Seite. Starte auf der Startseite und drücke Tab. Beobachte, wohin der Fokus springt.
Frage dich:
Sehe ich, welches Element aktiv ist?
Ist die Reihenfolge logisch?
Kann ich Links öffnen?
Kann ich Buttons aktivieren?
Komme ich durch das Menü?
Kann ich wieder zurück?
Bleibe ich irgendwo hängen?
Schon nach wenigen Sekunden merkt man oft, ob eine Website grundsätzlich tastaturfreundlich ist oder nicht.
Schritt 2: Sichtbaren Fokus prüfen
Der Fokus ist die Markierung, die zeigt, welches Element gerade ausgewählt ist.
Ohne sichtbaren Fokus ist Tastaturbedienung fast unmöglich. Man drückt Tab, aber weiß nicht, wo man gelandet ist.
Ein guter Fokus kann zum Beispiel so aussehen:
klarer Rahmen, farbige Umrandung, deutlicher Schatten, Unterstreichung oder sichtbare Hintergrundänderung.
Schlecht ist ein Fokus, der kaum zu erkennen ist. Noch schlechter ist gar kein Fokus.
Viele Websites entfernen den Fokus aus Designgründen. Das sieht vielleicht „sauber“ aus, ist aber für Tastaturnutzer ein echtes Problem.
Schritt 3: Tab-Reihenfolge testen
Die Reihenfolge sollte nachvollziehbar sein.
Normalerweise erwartest du ungefähr:
Logo, Hauptnavigation, wichtige Buttons, Inhalt, Formulare, Footer.
Problematisch wird es, wenn der Fokus wild springt:
erst ins Menü, dann in den Footer, dann zurück nach oben, dann in ein unsichtbares Element, dann irgendwo in die Mitte.
Das verwirrt Nutzer und macht die Bedienung anstrengend.
Teste besonders Seiten mit komplexem Layout: Startseite, Leistungsseiten, Kontaktseite, Shop, Checkout, Terminbuchung und Landingpages.
Schritt 4: Hauptmenü testen
Das Menü ist einer der wichtigsten Bereiche.
Prüfe:
Kannst du jeden Menüpunkt mit Tab erreichen?
Kannst du Menüpunkte mit Enter öffnen?
Sind Untermenüs erreichbar?
Bleiben Dropdowns offen, während du darin navigierst?
Kannst du Untermenüs mit Escape schließen?
Ist erkennbar, welcher Menüpunkt aktiv ist?
Viele Dropdown-Menüs funktionieren nur per Hover. Also nur, wenn man mit der Maus darüberfährt. Das ist für Tastaturnutzer schlecht.
Wenn dein Menü Unterpunkte hat, müssen diese auch ohne Maus erreichbar sein.
Schritt 5: Mobile Navigation nicht vergessen
Auch mobile Menüs sollten getestet werden. Besonders Hamburger-Menüs machen häufig Probleme.
Prüfe:
Kann der Menübutton mit Tastatur erreicht werden?
Öffnet sich das Menü mit Enter oder Leertaste?
Ist der Fokus im geöffneten Menü sichtbar?
Kann man alle Links erreichen?
Kann man das Menü wieder schließen?
Springt der Fokus nach dem Schließen sinnvoll zurück?
Auch wenn mobile Geräte oft per Touch bedient werden, ist die Tastaturbedienung wichtig. Viele Nutzer verwenden externe Tastaturen, Hilfstechnologien oder alternative Eingabegeräte.
Schritt 6: Links und Buttons prüfen
Links und Buttons müssen erreichbar und aktivierbar sein.
Teste dabei nicht nur, ob man sie anklicken könnte, sondern ob sie mit Tastatur wirklich funktionieren.
Achte auf:
Ist der Link erreichbar?
Ist der Fokus sichtbar?
Ist der Linktext verständlich?
Löst Enter die richtige Aktion aus?
Ist ein Button wirklich ein Button?
Funktioniert die Leertaste bei Schaltern oder Checkboxen?
Ein häufiger Fehler: Elemente sehen aus wie Buttons, sind technisch aber schlecht umgesetzt. Dann funktionieren sie mit der Maus, aber nicht sauber mit der Tastatur.
Schritt 7: Kontaktformulare testen
Formulare sind eine der wichtigsten Teststellen.
Gehe mit Tab durch jedes Feld.
Prüfe:
Ist die Reihenfolge logisch?
Sind alle Felder erreichbar?
Sind Labels sichtbar und verständlich?
Kannst du Checkboxen aktivieren?
Kannst du Dropdowns bedienen?
Kannst du das Formular absenden?
Sind Fehlermeldungen erreichbar?
Bleiben eingegebene Daten erhalten?
Teste auch absichtlich Fehler. Lass ein Pflichtfeld leer oder gib eine falsche E-Mail-Adresse ein. Danach solltest du klar erkennen, was korrigiert werden muss.
Schritt 8: Checkout und Buchung testen
Wenn deine Website einen Shop, eine Terminbuchung oder eine Anmeldung hat, ist dieser Bereich besonders wichtig.
Teste den kompletten Ablauf ohne Maus:
Produkt auswählen, Variante wählen, in den Warenkorb legen, Warenkorb öffnen, zur Kasse gehen, Formular ausfüllen, Zahlungsart wählen, bestätigen.
Bei Terminbuchungen:
Kalender öffnen, Datum wählen, Uhrzeit wählen, Daten eintragen, Buchung absenden.
Wenn du irgendwo hängenbleibst, ist das nicht nur ein Barrierefreiheitsproblem. Es kann direkt Umsatz oder Anfragen kosten.
Schritt 9: Popups und Cookie-Banner prüfen
Popups sind oft die Stelle, an der Tastaturnutzer feststecken.
Teste:
Wird der Fokus ins Popup geführt?
Kannst du alle Buttons im Popup erreichen?
Kannst du es mit Escape schließen?
Gibt es einen gut erreichbaren Schließen-Button?
Bleibt der Fokus im Popup, solange es offen ist?
Springt der Fokus nach dem Schließen sinnvoll zurück?
Cookie-Banner solltest du ebenfalls genau prüfen. Wenn ein Cookie-Banner nicht mit Tastatur bedienbar ist, blockiert er im schlimmsten Fall die ganze Website.
Schritt 10: Fokusfallen erkennen
Eine Fokusfalle entsteht, wenn du mit der Tastatur in einem Bereich landest und nicht mehr herauskommst.
Das kann passieren bei:
Popups, eingebetteten Kalendern, Karten, Videos, Slidern, Chat-Widgets, Cookie-Bannern oder externen Formularen.
Teste mit Tab und Shift + Tab, ob du wieder herauskommst.
Wenn du nur noch im Kreis durch dieselben Elemente springst und keinen Ausweg findest, ist das eine große Baustelle.
Schritt 11: Versteckte Elemente prüfen
Manchmal springt der Fokus auf Elemente, die gar nicht sichtbar sind.
Das fühlt sich seltsam an: Du drückst Tab, aber auf dem Bildschirm passiert scheinbar nichts. Vielleicht ist der Fokus gerade auf einem unsichtbaren Menüpunkt, einem versteckten Slider-Button oder einem geschlossenen Popup.
Das sollte nicht passieren.
Interaktive Elemente, die gerade nicht sichtbar sind, sollten normalerweise auch nicht im Tastaturfluss auftauchen.
Schritt 12: Slider, Tabs und Akkordeons testen
Moderne Websites nutzen gerne interaktive Elemente. Tabs, Akkordeons, Slider, Karussells und ausklappbare Boxen sehen gut aus, können aber mit Tastatur schwierig sein.
Prüfe:
Kannst du das Element erreichen?
Kannst du es öffnen oder wechseln?
Ist sichtbar, welcher Tab aktiv ist?
Kannst du ein Akkordeon schließen?
Sind Pfeile oder Steuerbuttons erreichbar?
Stoppt ein automatischer Slider?
Ist der Inhalt vollständig erreichbar?
Wenn ein Akkordeon nur per Maus klickbar ist, ist es nicht sauber zugänglich.
Schritt 13: Fokus darf nicht verdeckt werden
Manchmal ist der Fokus vorhanden, aber nicht sichtbar, weil etwas darüberliegt.
Typische Ursachen:
Sticky Header, Cookie-Banner, Chat-Widget, fixe Footer-Leiste, Popups oder überlappende Layouts.
Teste besonders auf kleinen Bildschirmen.
Wenn du per Tab navigierst, sollte das aktive Element im sichtbaren Bereich liegen. Es sollte nicht hinter einem Header verschwinden oder am unteren Rand von einem Banner verdeckt werden.
Schritt 14: Externe Tools mitprüfen
Viele Websites binden externe Dienste ein:
Calendly, Zahlungsanbieter, Newsletter-Tools, Chat-Widgets, Karten, Bewertungsboxen, Kursplattformen oder Buchungssysteme.
Für Nutzer gehört das alles zur Website.
Prüfe also auch diese Elemente mit Tastatur. Gerade externe Tools sind oft die eigentlichen Problemstellen.
Wenn der eigene Inhalt gut bedienbar ist, aber der Zahlungsanbieter nicht, scheitert der Nutzer trotzdem.
Schritt 15: Auf mehreren Seiten testen
Teste nicht nur die Startseite. Viele Probleme sitzen auf Unterseiten.
Wichtige Seiten sind:
Startseite, Navigation, Kontaktseite, Formularseite, Produktseite, Warenkorb, Checkout, Terminbuchung, Login, Kundenkonto, Blogartikel, Landingpages und Footer.
Bei WordPress-Seiten mit Pagebuildern kann jede Seite anders aufgebaut sein. Ein Button auf der Startseite funktioniert, ein anderer auf der Landingpage vielleicht nicht.
Typische Probleme bei der Tastaturbedienung
Die häufigsten Fehler sind:
kein sichtbarer Fokus,
zu schwacher Fokus,
unlogische Tab-Reihenfolge,
Dropdown-Menüs nur per Hover,
Buttons nicht erreichbar,
Popups nicht schließbar,
Fokus bleibt im Cookie-Banner hängen,
unsichtbare Elemente bekommen Fokus,
Formularfelder sind nicht sauber beschriftet,
Slider sind nicht steuerbar,
Checkout funktioniert nur mit Maus,
externe Tools sind nicht bedienbar.
Viele dieser Fehler fallen erst auf, wenn man wirklich ohne Maus testet.
Ein einfacher 10-Minuten-Test
Wenn du wenig Zeit hast, mach diesen kurzen Test:
Öffne die Startseite.
Drücke Tab und beobachte den Fokus.
Gehe durchs Hauptmenü.
Öffne ein Dropdown.
Gehe zu einem Button und aktiviere ihn.
Öffne die Kontaktseite.
Fülle das Formular ohne Maus aus.
Provoziere eine Fehlermeldung.
Schließe Cookie-Banner oder Popup mit Tastatur.
Teste danach die mobile Ansicht.
Wenn du dabei hängenbleibst, hast du schon die wichtigsten Probleme gefunden.
Was tun, wenn du Probleme findest?
Notiere jedes Problem möglichst konkret.
Nicht nur:
„Tastatur geht nicht.“
Besser:
„Dropdown im Hauptmenü öffnet sich nicht mit Enter.“
„Fokus im Kontaktformular ist nicht sichtbar.“
„Cookie-Banner kann mit Tab erreicht, aber nicht geschlossen werden.“
„Nach Fehlermeldung springt der Fokus nicht zum Formular zurück.“
„Im Checkout ist die Zahlungsart nicht per Tastatur auswählbar.“
Je genauer du das Problem beschreibst, desto leichter lässt es sich beheben.
Reicht ein automatisches Tool?
Automatische Tools können helfen. Sie finden manche technische Fehler. Aber Tastaturbedienung muss man praktisch testen.
Ein Tool merkt nicht immer, ob die Reihenfolge logisch ist. Es weiß nicht zuverlässig, ob ein Popup sich verständlich anfühlt. Und es kann nicht beurteilen, ob du als Nutzer wirklich ohne Maus ans Ziel kommst.
Deshalb gilt:
Automatische Prüfung ist gut.
Manueller Tastaturtest ist Pflicht.
Gerade die größten Probleme findest du oft nur durch echtes Durchklicken mit der Tastatur.
Kurze Checkliste
Prüfe deine Website mit diesen Fragen:
Sind alle wichtigen Funktionen mit Tastatur erreichbar?
Ist der Fokus immer sichtbar?
Ist die Tab-Reihenfolge logisch?
Können Dropdowns geöffnet und geschlossen werden?
Sind Popups und Cookie-Banner bedienbar?
Gibt es keine Fokusfallen?
Werden unsichtbare Elemente übersprungen?
Sind Formulare komplett nutzbar?
Funktionieren Shop, Checkout oder Buchung ohne Maus?
Sind externe Tools mitgetestet?
Wenn du diese Punkte sauber prüfst, findest du die größten Baustellen sehr schnell.
Fazit: Tastaturtest zeigt gnadenlos, wie gut eine Website wirklich funktioniert
Der Tastaturtest ist einer der einfachsten und ehrlichsten Tests für Barrierefreiheit.
Er zeigt dir sofort, ob deine Website wirklich bedienbar ist oder ob sie nur mit Maus gut funktioniert.
Mein praktischer Rat: Teste nicht nur vorsichtig die Startseite. Gehe echte Nutzerwege durch. Kontakt aufnehmen. Termin buchen. Produkt kaufen. Formular absenden. Cookie-Banner schließen. Popup öffnen und schließen.
Genau dort zeigt sich, ob die Website alltagstauglich ist.
Eine gute Tastaturbedienung hilft nicht nur Menschen mit Behinderung. Sie macht die Website sauberer, logischer und zuverlässiger. Und das merkt am Ende jeder Nutzer, auch wenn er gar nicht darüber nachdenkt.
Dieser Artikel gibt eine allgemeine Orientierung und ersetzt keine Rechtsberatung.