Zum Inhalt springen
Pandus
de Sprache ändern
Menü

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

Selbst gebaute Schaltflächen haben keinen Namen

Einige Elemente, die als Schaltflächen, Links oder Menüpunkte dienen, wurden selbst gebaut und haben keinen lesbaren Namen.

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

Warum das für Ihre Kunden wichtig ist

Wer einen Screenreader oder Sprachsteuerung nutzt, erfährt nicht, was das Bedienelement tut, und findet so womöglich das Menü, einen Filter oder „In den Warenkorb“ nicht.

Wen es betrifft

  • blinde Kundinnen und Kunden
  • Screenreader-Nutzer
  • Nutzer von Sprachsteuerung

So beheben Sie es

Geben Sie jedem Element mit role="button", "link" oder "menuitem" einen Namen: sichtbaren Text, aria-label oder aria-labelledby. Besser: ein natives <button> oder <a href> verwenden, das auch die Tastaturbedienung mitbringt.

Bei Shopify

Meist selbst gebaute Icon-Bedienelemente im Theme oder in Apps. Ergänzen Sie Namen in den Liquid-Snippets des Themes; Elemente aus Apps melden Sie dem App-Entwickler.

Bei Shoptet (CZ)

Meist Bedienelemente aus dem Template oder aus Erweiterungen. Melden Sie es Shoptet oder einer Partneragentur.

Bei PrestaShop

Meist Bedienelemente aus dem Theme oder aus Modulen. Ergänzen Sie Namen in den .tpl-Templates oder in überschriebenen Modul-Templates.

Bei WooCommerce

Meist Bedienelemente aus Page-Buildern oder Plugins. Ergänzen Sie Namen im Child-Theme-Code oder in den Plugin-Einstellungen 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-command-name. dequeuniversity.com, github.com, www.w3.org

Ähnliche Prüfungen

Alle Regeln, die wir prüfen