Zum Inhalt springen
Pandus
de Sprache ändern
Menü

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

Die ganze Seite ist für Screenreader ausgeblendet

Das <body>-Element der Seite hat aria-hidden="true". Damit werden Screenreader angewiesen, den gesamten Inhalt zu ignorieren.

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

Warum das für Ihre Kunden wichtig ist

Screenreader-Nutzer finden nichts zum Vorlesen: kein Menü, keine Produkte, kein „In den Warenkorb“ und keinen Checkout. Für sie wirkt der Shop leer, und sie gehen.

Wen es betrifft

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

So beheben Sie es

Entfernen Sie aria-hidden vom <body>-Element. Meist setzt ein Skript für ein Pop-up, einen Warenkorb-Drawer, ein Cookie-Banner oder ein mobiles Menü das Attribut, solange das Fenster offen ist, und entfernt es danach nicht wieder. Um den Hintergrund auszublenden, verwenden Sie das Attribut inert oder ein natives <dialog> auf dem Inhalt, nicht auf <body>, und achten Sie darauf, dass das Pop-up selbst nicht im ausgeblendeten Teil liegt.

Bei Shopify

Meist eine Pop-up-, Newsletter-, Cookie- oder Warenkorb-Drawer-App oder das Drawer-Skript des Themes. Deaktivieren Sie Apps nacheinander, um die Quelle zu finden, und korrigieren Sie dann das Theme-JavaScript oder melden Sie es dem App-Entwickler.

Bei Shoptet (CZ)

Meist ein Pop-up- oder Add-on-Skript oder eigener Code im Template. Melden Sie es Shoptet oder einer Partneragentur und entfernen Sie eigene Skripte, die aria-hidden auf <body> setzen.

Bei PrestaShop

Meist ein Modal-, Cookie- oder Newsletter-Modul oder das JavaScript des Themes. Suchen Sie das Skript, das aria-hidden auf <body> setzt, und korrigieren Sie es oder melden Sie es dem Modul-Entwickler.

Bei WooCommerce

Meist ein Pop-up-, Cookie-, Mini-Warenkorb- oder Mobilmenü-Plugin oder der Page-Builder. Deaktivieren Sie Plugins auf einer Staging-Kopie nacheinander, um die Quelle zu finden, und melden Sie es dem Plugin-Entwickler.

Standards

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

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

Ähnliche Prüfungen

Alle Regeln, die wir prüfen