Zum Inhalt springen
Pandus
de Sprache ändern
Menü

WCAG-A/AA-Anforderung Priorität: Schwerwiegend

Versteckte Elemente sind per Tastatur weiterhin erreichbar

Einige Bereiche der Seite sind für Screenreader ausgeblendet, erhalten aber trotzdem den Tastaturfokus.

Dieser Text wurde automatisch übersetzt und noch nicht von Muttersprachlern geprüft.

Warum das für Ihre Kunden wichtig ist

Tastaturnutzer landen auf unsichtbaren Links, Screenreader-Nutzer auf stummen oder unbenannten Elementen. Bei geschlossenen Menüs oder Pop-ups wird die Navigation im Shop dadurch verwirrend.

Wen es betrifft

  • Screenreader-Nutzer
  • Tastaturnutzer
  • blinde Kundinnen und Kunden

So beheben Sie es

Platzieren Sie keine fokussierbaren Elemente innerhalb von aria-hidden="true". Wenn Sie ein Menü oder einen Dialog ausblenden, nehmen Sie es auch aus der Fokusreihenfolge: mit dem Attribut hidden, display:none, inert oder tabindex="-1" auf den enthaltenen Bedienelementen.

Bei Shopify

Meist Off-Canvas-Menüs, Drawer, Pop-ups oder Karussells im Theme oder in Apps. Korrigieren Sie die Ausblende-Logik im JavaScript oder Liquid des Themes; App-Widgets melden Sie dem App-Entwickler.

Bei Shoptet (CZ)

Meist Menüs, Karussells oder Pop-ups des Templates. Melden Sie es Shoptet oder einer Partneragentur.

Bei PrestaShop

Meist mobile Menüs, Karussells oder Modal-Module. Korrigieren Sie es in den Templates und im JavaScript des Themes oder melden Sie es dem Modul-Entwickler.

Bei WooCommerce

Meist mobile Menüs, Slider, Pop-up- oder Cookie-Plugins. Korrigieren Sie es im Child-Theme-Code oder melden Sie es dem Plugin-Entwickler.

Standards

Standards
StandardAbschnitt
WCAG 2.2 4.1.2 (A) Name, Role, Value
WCAG 2.1 4.1.2 (A) Name, Role, Value
WCAG 2.0 4.1.2 (A) Name, Role, Value
EN 301 549 4.1.1 9.4.1.2
EN 301 549 3.2.1 9.4.1.2
Section 508 2017 E205.4
ДСТУ EN 301 549 2022 9.4.1.2

Automatische Prüfung: axe-core-Regel aria-hidden-focus. dequeuniversity.com, github.com, www.w3.org

Ähnliche Prüfungen

Alle Regeln, die wir prüfen