Zum Inhalt springen
Pandus
de Sprache ändern
Menü

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

Klickbare Bildbereiche haben keine Beschreibung

Die Seite verwendet eine Imagemap (ein Bild, das in mehrere klickbare Bereiche aufgeteilt ist), und einige dieser Bereiche haben keinen Text, der sagt, wohin sie führen.

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

Warum das für Ihre Kunden wichtig ist

Screenreader-Nutzer hören nur „Link“ oder eine Dateiadresse, etwa bei einem Banner mit Links zu verschiedenen Kategorien oder einer in Zonen aufgeteilten Größentabelle. Sie können den richtigen Bereich nicht wählen und verpassen womöglich Angebote oder Produktseiten.

Wen es betrifft

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

So beheben Sie es

Geben Sie jedem <area>-Element mit href einen kurzen Alternativtext, der das Ziel nennt, zum Beispiel alt="Damenschuhe". Besser noch: Ersetzen Sie die Imagemap durch normale Links oder Schaltflächen über oder unter dem Bild; das funktioniert auch mobil zuverlässiger.

Bei Shopify

In Shopify-Themes selten. Meist stammt es aus altem HTML, das in eine Seite, einen Blogbeitrag oder eine Produktbeschreibung eingefügt wurde, oder aus einer Imagemap-App. Bearbeiten Sie das HTML im Editor oder bitten Sie den App-Entwickler, jedem Bereich einen Alternativtext zu geben.

Bei Shoptet (CZ)

In Shoptet-Templates selten. Meist HTML, das im Admin in eine Seite oder Beschreibung eingefügt wurde; ergänzen Sie den Alternativtext dort oder wenden Sie sich an einen Shoptet-Partner, falls der Code Teil des Templates ist.

Bei PrestaShop

Meist HTML in CMS-Seiten oder Produktbeschreibungen oder ein Banner-Modul. Ergänzen Sie den Alternativtext für jedes <area> im Back-Office-Editor oder im Modul-Template.

Bei WooCommerce

Meist altes HTML in Seiten oder Produktbeschreibungen oder ein Imagemap- bzw. Hotspot-Plugin. Ergänzen Sie Alternativtexte im Editor oder in den Plugin-Einstellungen oder melden Sie es dem Plugin-Entwickler.

Standards

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

Automatische Prüfung: axe-core-Regel area-alt. dequeuniversity.com, github.com, www.w3.org, www.w3.org

Ähnliche Prüfungen

Alle Regeln, die wir prüfen