Zum Inhalt springen
Pandus

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

Selbst gebaute Menüs oder Listen sind fehlerhaft aufgebaut

Einige selbst gebaute Komponenten wie Menüs, Tab-Leisten oder Auswahllisten enthalten nicht die Einträge, die sie benötigen.

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

Warum das für Ihre Kunden wichtig ist

Screenreader-Nutzer hören womöglich ein leeres Menü oder eine leere Liste oder können nicht zwischen Tabs und Optionen wechseln. Navigation und Filter werden dadurch schwer bedienbar.

Wen es betrifft

  • Screenreader-Nutzer
  • blinde Kundinnen und Kunden

So beheben Sie es

Geben Sie jedem ARIA-Container die erforderlichen untergeordneten Rollen, zum Beispiel role="menuitem" in role="menu", role="tab" in role="tablist", role="option" in role="listbox". Ist die Komponente kein echtes Menü, entfernen Sie stattdessen die Rolle.

Bei Shopify

Meist Theme-Menüs, Tabs oder App-Widgets mit ARIA-Rollen. Korrigieren Sie die Rollen in den Liquid-Sections und im JavaScript des Themes; App-Widgets melden Sie dem App-Entwickler.

Bei Shoptet (CZ)

Meist Menüs oder Tabs des Templates. Melden Sie es Shoptet oder einer Partneragentur.

Bei PrestaShop

Meist Menüs, Tabs oder Module der Facettensuche. Korrigieren Sie es in den Templates und im JavaScript des Themes oder Moduls.

Bei WooCommerce

Meist Menüs, Tabs oder Slider aus dem Theme, aus Page-Buildern oder Plugins. Korrigieren Sie es im Child-Theme-Code oder melden Sie es dem Plugin-Entwickler.

Standards

Standards
StandardAbschnitt
WCAG 2.2 1.3.1 (A) Info and Relationships
WCAG 2.1 1.3.1 (A) Info and Relationships
WCAG 2.0 1.3.1 (A) Info and Relationships
EN 301 549 4.1.1 9.1.3.1
EN 301 549 3.2.1 9.1.3.1
Section 508 2017 E205.4
ДСТУ EN 301 549 2022 9.1.3.1

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

Alle Regeln, die wir prüfen