Skip to content

Tastaturfokus nicht sichtbar

SeriousWCAG criterion 2.4.7BFSG-relevant

What is the problem?

Beim Durchlaufen der Seite mit der Tab-Taste ist nicht erkennbar, welches Element gerade den Fokus hat — die Fokus-Umrandung wurde entfernt oder ist unsichtbar. Tastatur-Nutzer verlieren die Orientierung und können die Seite praktisch nicht bedienen.

Why does it matter?

WCAG 2.1 Erfolgskriterium 2.4.7 (Fokus sichtbar, Stufe AA) verlangt einen sichtbaren Tastaturfokus. BarriereWache prüft dies mit einem eigenen Tastatur-Kurztest über die ersten fokussierbaren Elemente — über den axe-Regelsatz hinaus. Relevant für die BFSG-Bewertung.

How to fix it

Stelle den sichtbaren Tastatur-Fokus wieder her: Entferne pauschale outline: none / outline: 0-Regeln aus dem CSS. Wenn der Standard-Ring optisch stört, gestalte ihn statt ihn zu löschen: :focus-visible { outline: 2px solid #1f6d86; outline-offset: 2px; } — so bleibt Maus-Klick ohne Ring, Tastatur-Fokus aber sichtbar.

Shopware

Meist steckt ein globales outline:none im Theme-CSS: im Theme-Child suchen und durch eine :focus-visible-Gestaltung ersetzen.

Check Shopware specifically

WooCommerce

Theme-CSS bzw. Customizer → „Zusätzliches CSS" nach outline:none durchsuchen und durch :focus-visible-Stile ersetzen. Auch Page-Builder-Einstellungen („Fokus-Rahmen entfernen") prüfen.

Check WooCommerce specifically

Shopify

Im Code-Editor die CSS-Assets nach outline durchsuchen; aktuelle Themes bringen :focus-visible-Stile mit — eigene Overrides entfernen.

Check Shopify specifically

WordPress

Im Child-Theme bzw. „Zusätzliches CSS" nach outline:none suchen und ersetzen; viele Themes bieten eine Option „Fokus-Stile" — aktivieren.

Check WordPress specifically

TYPO3

Im Site-Package-CSS nach outline:none suchen und durch :focus-visible-Gestaltung ersetzen.

Check TYPO3 specifically

Is your website affected?

The free quick check tests up to 5 pages within minutes — no registration.

Start a free quick check

Related rules

All rules