Eine Fokus-Falle ist ein Bereich oder Element einer Webseite, bei dem der Tastaturfokus gefangen ist – die Nutzenden können also per Tastatur nicht zu anderen Bereichen der Seite navigieren. Dies ist ein erhebliches Problem für die Barrierefreiheit, da Menschen mit motorischen Einschränkungen oder Screenreader-Nutzende die betroffenen Bereiche ggf. nicht verlassen können.
Fokus-Fallen können gewollt oder ungewollt sein:
Gewollte Fokus-Fallen sind zum Beispiel:
Modale Dialoge
Auswahlmenüs
Problematische Fokus-Fallen sind hingegen:
Nicht schließbare Pop-ups
Video-Player ohne Escape-Option
Eingabefelder mit fehlerhafter Validierung
Schlecht implementierte Custom-Komponenten
WCAG-Anforderungen:
Keine ungewollten Fokus-Fallen (Level A)
Mechanismus zum Verlassen vorhanden
Nutzende müssen informiert werden
Tastaturäquivalent für Mausbedienung
ARIA-Attribute korrekt setzen
Testing-Kriterien:
Navigation mit Tab und Shift+Tab prüfen
ESC-Taste testen
Fokus-Rücksetzung kontrollieren
Screenreader-Kompatibilität verifizieren
Browser-übergreifende Tests durchführen