Weisen Sie Bildern, die als Links verwendet werden, einen Alternativtext zu, der den Zweck des Links beschreibt. Manchmal benutzen Sie keinen Text, sondern ein Bild als Link zu einer anderen Seite. Anstelle des Linktextes „Weiter“ können Sie beispielsweise die Grafik eines Pfeils nach rechts verwenden. Stellen Sie in diesem Fall sicher, dass der Alternativtext des Bildes den Zweck des Links beschreibt.
- Beispiel: „Nächste Seite“ ist ein besserer Alternativtext als „Blauer Pfeil nach rechts“.
Durch die Einhaltung dieser Regeln stellen Sie sicher, dass Bilder, die als Links verwendet werden, für Besucher, die das Bild nicht sehen können, verständlich sind. Dies ermöglicht es ihnen, die Webseite ohne Probleme zu navigieren. Einem Bild sollte stets ein Text zugewiesen sein, damit seine Bedeutung auch für einen sehbehinderten Menschen verständlich ist.
Wie wendet man dies an?
Vorherige und nächste (previous and next)
Ein News-Archiv enthält Links am Ende der Seite, um durch das Archiv zu navigieren. Die Alt-Texte der Bilder, die für „previous“ und „next“ verwendet werden, beschreiben den Zweck des Links (previous/next) und nicht das, was auf dem Bild zu sehen ist (Pfeile).
<a href=”archive/page-1.html”>
<img src=”Pfeil nach links.png” alt=”Vorherige Seite” />
</a>
<a href=”archive/page-3.html”>
<img src=”Pfeil nach rechts.png” alt=”Nächste Seite” />
</a>
Kontaktseite
Im Navigationsmenü verwendet eine Website ein Bild eines Umschlags als Link zur Kontaktseite. Der Alt-Text des Bildes beschreibt den Zweck des Links (Kontakt) und nicht das, was auf dem Bild gezeigt wird (weißer Briefumschlag/envelope).
<a href=”Contact.html”>
<img src=”envelop.png” alt=”Kontakt” />
</a>
Für Redakteure
Bilder, die als Links verwendet werden, können in den Inhalten erscheinen, die der Redakteur verwaltet.
Für Designers (Ersteller)
Bilder, die als Links verwendet werden, können in Strukturelementen einer Webseite erscheinen, wie sie beispielsweise das Navigationsmenü verwaltet.