Geben Sie einen alternativen Text zu Bildern, die als Schaltfläche oder anderes Formular-Element in einem Formular verwendet werden. In einigen Formularen werden Bilder als Schaltfläche oder anderes Formular-Element verwendet. So kann beispielsweise ein Bild eines grünen Pfeils als Sendeknopf verwendet werden. Und in einer Dropdown-Liste der möglichen Farben können anstelle einer textuellen Beschreibung Bilder der Farben angezeigt werden.

Wie wendet man das an?

Stellen Sie sicher, dass Bilder in einem Formular einen Alt-Text haben, der dem Zweck des Bildes entspricht. Jemand, der nur die Alt-Texte lesen kann, sollte auch das Formular ausfüllen können. Das bedeutet, dass der Alt-Text manchmal keine wörtliche Beschreibung dessen enthalten sollte, was zu sehen ist, sondern eine Beschreibung des Zwecks des Bildes. Der grüne Pfeil, der als Sendeknopf verwendet wird, ist daher besser geeignet, den Alt-Text zu „senden“ als der grüne Pfeil nach rechts.

Beispiele

Bilder als Auswahlmöglichkeit

Wenn Sie zwischen verschiedenen Bildern in einem Formular wählen können, von denen jedes eine andere Option hat, dann sollten diese Bilder einen Alt-Text erhalten, der beschreibt, was auf dem Bild gezeigt wird. Im folgenden Beispiel können Sie zwischen 2 Farben einer Flasche wählen: grün und rot. In den Alt-Texten steht „Grünes Glas“ und „Rotes Glas“.

<label for="option1">
<input type="radio" id="option1">
<img src="flasche-grün.jpg" alt="Grünes Glas" />
</label>
<label for="option2">
<input type="radio" id="option2">
<img src="flasche-rot.jpg" alt="Rotes Glas" />
</label>

Bild als Button (Taste) verwendet

Wenn ein Bild als Schaltfläche verwendet wird, z.B. als Sendetaste, dann sollte der alternative Test den Zweck der Schaltfläche beschreiben und nicht unbedingt das, was auf dem Bild gezeigt wird. Zum Beispiel ist „Senden“ ein besserer Alt-Text als „grüner Pfeil nach rechts“.

<input type="image" src="knopf.jpg" alt="senden" />
 

Wie trägt dies zu einer besseren Webseite bei?

Sehbehinderte Besucher können das Bild nicht sehen. Durch die Angabe einer Beschreibung des Bildes stehen ihnen die Informationen im Bild weiterhin zur Verfügung. Sie können das Formular wie jeder andere auch ausfüllen und absenden.

Für Developer (Entwickler)

Der Entwickler muss sicherstellen, dass Bilder, die als Buttons (Tasten) oder andere Formular-Elemente verwendet werden, einen guten Alt-Text erhalten, da der Redakteur dies im Allgemeinen im Content Management System (CMS) nicht ändern kann.