Barrierefreies Webdesign ein zugängliches und nutzbares Internet gestalten

Alternativtextoptimierung abhängig vom Code veröffentlicht in 2017

Die Herausforderung, die richtige Textalternative für eine Grafik zu formulieren, wird nicht nur durch die Inhalte in der Grafik oder den Kontext bestimmt. Auch der Code kann die Anforderung an den Alternativtext beeinflussen.

Als Beispiel soll eine Teaser-Grafik in einem typischen Anreißertext dienen:

Screenshot eines Teasers: links ein Bild und rechts eine Überschrift, eine kurze Beschreibung und ein Link

Welcher Alternativtext sollte für die Grafik vergeben werden? Die meisten Personen würden einen Text der Art "Hand, die zwischen mehreren Fotos auswählt" – also einen identifizierenden Alternativtext – wählen.

Häufig sind Teaser-Grafiken aber auch anklickbar, und sowohl Grafik als auch Überschrift werden beide mit der gleichen Detailseite verlinkt. Verlinkte Grafiken benötigen generell einen funktionalen Alternativtext, der den Linkzweck bestimmen lässt.

Funktionale Alternativtexte für verlinkte Teaser-Grafiken

Wenn der Überschriftentext den Zweck des Links – also den Aufruf der verlinkten Seite – bestimmen lässt, dann ist der Überschriftentext ein geeigneter funktionaler Alternativtext für die Grafik. Dazu kommt, dass die Web Content Accessibility Guidelines (WCAG) 2.0 verlangen, dass Komponenten der Webseite mit gleicher Funktionalität auch Zeile206: DB-Eintrag ungültig: - Zeile: 206