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

Einige Elemente haben eine Rolle, die es nicht gibt

Einige Elemente haben ein role-Attribut mit einem falsch geschriebenen, erfundenen oder abstrakten Wert. Assistive Technologien erkennen dadurch nicht, worum es sich handelt.

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

Warum das für Ihre Kunden wichtig ist

Screenreader lesen ein Menü, einen Tab, ein Pop-up oder einen Button womöglich als normalen Text vor oder überspringen ihn. Wer darauf angewiesen ist, findet Navigation, Filter oder Bedienelemente im Checkout unter Umständen nicht.

Wen es betrifft

blinde Kundinnen und Kunden
Screenreader-Nutzer
Nutzer von Sprachsteuerung

So beheben Sie es

Verwenden Sie nur gültige ARIA-Rollen aus der WAI-ARIA-Spezifikation, korrekt und kleingeschrieben, zum Beispiel role="button", role="navigation" oder role="dialog". Abstrakte Rollen wie "widget", "landmark" oder "input" sind nicht erlaubt. Noch besser: das native HTML-Element verwenden (<button>, <nav>, <dialog>) und die Rolle entfernen.

Bei Shopify

Meist in eigenem Theme-Code oder App-Widgets wie Menüs, Slidern und Pop-ups. Korrigieren Sie die Rolle in den Liquid-Sections oder -Snippets des Themes; bitten Sie App-Entwickler, Rollen aus ihren Apps zu korrigieren.

Bei Shoptet (CZ)

In Standard-Templates selten; eher in eigenem Code oder eingebundenen Skripten. Bitten Sie Shoptet oder eine Partneragentur, Template und eigenen Code zu prüfen.

Bei PrestaShop

Meist in Theme-Templates oder Modulen wie Menüs und Slidern. Korrigieren Sie die Rolle in den .tpl-Dateien des Themes oder in überschriebenen Modul-Templates.

Bei WooCommerce

Meist in Themes, Page Buildern oder Slider- und Pop-up-Plugins. Korrigieren Sie die Rolle in Child-Theme-Templates; Markup aus Plugins melden Sie dem Plugin-Entwickler.

Standards

Standards
Standard	Abschnitt
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-roles. dequeuniversity.com, github.com, www.w3.org

Einige Schaltflächen haben keinen Namen
WCAG 4.1.2 A
Die Seite enthält veraltetes Markup für blinkenden Text
WCAG 2.2.2 A
Barrierefreiheits-Attribute haben falsche Werte
WCAG 4.1.2 A
Einige Schalter und Kontrollkästchen haben keinen Namen
WCAG 4.1.2 A

Alle Regeln, die wir prüfen