Textalternativen

Serverseitige Image-Maps ersetzen

Regel: server-side-image-map
Schweregrad: Gering
WCAG-Stufe A

Warum das wichtig ist

Eine serverseitige Map schickt Pixelkoordinaten an den Server; die Ziele existieren nur als Positionen in einem Bild. Für Tastatur und Screenreader bleibt nichts übrig, womit sie arbeiten könnten.

So beheben Sie es

Ersetzen Sie ismap durch eine clientseitige <map> mit <area>-Elementen, jedes mit Alternativtext.
Besser noch: Ersetzen Sie die Karte durch echte Links oder Schaltflächen über dem Bild.

Im Markup

Fehlerhaft

<a href="/map"><img src="offices.png" ismap></a>

Korrekt

<img src="offices.png" alt="Our offices" usemap="#offices">
<map name="offices">
  <area shape="rect" coords="0,0,60,40" href="/berlin" alt="Berlin">
</map>

Die Anforderung dahinter

Diese Regel ist eine Art, die folgenden WCAG-2.2-Erfolgskriterien zu verfehlen. Das W3C, das den Standard herausgibt, erläutert jedes davon:

2.1.1 Tastatur (öffnet in neuem Tab) — WCAG-Stufe A

Weiterführende Quellen

Deque University zu server-side-image-map (öffnet in neuem Tab)

Deque entwickelt axe-core, die quelloffene Prüf-Engine unseres Scanners. Ihre Seite dokumentiert die Regel so, wie die Engine sie umsetzt.

Automatische Prüfungen finden Fehler, die ein Browser nachweisen kann. Ob eine Untertitelspur inhaltlich stimmt, ob ein Alternativtext wirklich hilft oder ob sich eine Seite durchgängig mit der Tastatur bedienen lässt, kann nur ein Mensch beurteilen.