zurück zu Grafiken - Schriftgrafiken

Beispiel: Alternativtext und Bildbeschreibung bei Grafiken

Diese Seite dient zum Testen, ob und welche Grafik-Attribute im Browser als Tooltip beim Maus-Überfahren (engl. Mouse over) angezeigt werden. Gehen Sie mit dem Mauszeiger über die jeweilige Grafik und testen Sie, wie die verschiedenen Varianten von Ihrem Browser interpretiert werden!

Grafik mit alt-Attribut

Bei der nachfolgenden Grafik ist das alt-Attribut mit dem Inhalt "Inhalt des alt-Attributes" hinterlegt:

<img src="dummy.png" width="40" height="40" alt="Inhalt des alt-Attributes" />

Grafik mit title-Attribut

Bei fehlendem alt-Attribut geben manche Validatoren einen Hinweis aus, dass selbiges nicht angegeben ist! Die Variante "Grafik mit title- aber ohne alt-Attribut" wird daher hier nicht weiter untersucht.

Grafik mit alt- und title-Attribut

Bei der nachfolgenden Grafik ist das alt- und title-Attribut mit den Inhalten "Inhalt des alt-Attributes" (im alt-Attribut) sowie "Inhalt des title-Attributes" (im title-Attribut) hinterlegt:

<img src="dummy.png" width="40" height="40" alt="Inhalt des alt-Attributes" title="Inhalt des title-Attributes" />

Grafik mit alt-, title- und longdesc-Attribut

Bei der nachfolgenden Grafik ist das alt-Attribut mit dem Inhalt "Inhalt des alt-Attributes", das title-Attribut mit dem Inhalt "Inhalt des title-Attributes" sowie das longdesc-Attribut mit Verweis auf die Datei "grafiken-beispiel-beschreibungsdatei.html" hinterlegt:
D

<img src="dummy.png" width="40" height="40" alt="Inhalt des alt-Attributes" title="Inhalt des title-Attributes" longdesc="longdesc.html" />
<a href="grafiken-beispiel-beschreibungsdatei.html">D</a>

Achtung: Da der Linktext des D-Link nur einen Buchstaben enthält, geben manche Validatoren einen Hinweis aus, der besagt, dass der Linktext ("D") nicht aussagekräftig ist! Problematisch ist diese D-Link-Variante aus Sicht barrierefreier Web-Gestaltung auch, wenn bei mehreren Grafiken auf einer Seite ein solcher "D"-Verweis hinterlegt ist. Dann verweisen nämlich gleiche Linktexte ("D") auf unterschiedliche Ziele (Beschreibungsdatei 1. Grafik, Beschreibungsdatei 2. Grafik usw.)!

zurück zu Grafiken - Schriftgrafiken