Barrierefreiheit
Fokus ist für Tastaturnutzer unsichtbar
Woran du es erkennst
Bedienelemente unterdrücken die Fokusmarkierung per CSS, ohne sie zu ersetzen — wer sich mit der Tabulatortaste bewegt, sieht nicht, wo er gerade steht.
Warum es zählt
Ohne sichtbare Fokusmarkierung verlieren Menschen, die ausschließlich die Tastatur benutzen, jede Orientierung auf der Seite. Betroffen sind viele Menschen mit motorischen Einschränkungen — und alle, die aus Gewohnheit die Tastatur bevorzugen. Die Seite ist ohne Maus faktisch unbedienbar.
So behebst du es
- Unterdrücke die Fokusmarkierung nie ohne gleichwertigen Ersatz; gestalte stattdessen :focus-visible mit einem klar erkennbaren, kontrastreichen Rahmen.
- Achte darauf, dass der Fokus nicht von anderen Elementen verdeckt wird und genug Kontrast zum Untergrund hat.
- Nutze :focus-visible statt :focus, damit der Rahmen bei Tastaturbedienung erscheint, aber nicht bei jedem Mausklick — das entspricht der Erwartung.
- Gehe die gesamte Seite einmal mit der Tabulatortaste durch und prüfe, dass jedes Bedienelement sichtbar reagiert, auch die selbstgebauten.