+49 7141 23 92 612

ALT-, TITLE-, und weitere Attribute im IMAGE-TAG

Wofür steht das ALT-Attribut in IMAGE-TAGs?
Worin besteht der Unterschied zum TITLE-Attribut?
Was bedeuten die Attribute LONGDESC und LOWSRC?
Für wen ist das von Interesse?
Der Beantwortung dieser Fragen widmen wir uns in diesem kleinen Artikel.

Teasergrafik, Abbildung des IMG-Tags

Wofür steht das ALT-Attribut in IMAGE-TAGs?
Worin besteht der Unterschied zum TITLE-Attribut?
Was bedeuten die Attribute LONGDESC und LOWSRC?
Für wen ist das von Interesse?
Der Beantwortung dieser Fragen widmen wir uns in diesem kleinen Artikel.

Das ALT-Attribut

Vereinfacht soll das ALT-Attribut (ALT = Alternativ) eine alternative Bildbeschreibung für Blinde beinhalten. Mit „blind“ meine ich hier neben Sehbehinderten auch sämtliche Suchmaschinen-Bots, die ebenfalls nicht „sehen“ können.

Ein korrekt ausgefülltes ALT-Attribut bedeutet zwar keine extreme Verbesserung im Suchmaschinen-Ranking, trägt aber dennoch einen wichtigen Teil zur HTML-Konformität und Barrierefreiheit bei. Zusätzlich kann die Bildsuche bei Suchmaschinen – ein sinnvoll ausgefülltes ALT-Attribut vorausgesetzt – Ihre Produktfotos passend zu den Suchanfragen anzeigen.

Weiterhin verwenden sog. Voicebrowser und Braillezeilen-Lesegeräte das ALT-Attribut zur Bildbeschreibung. Layoutbilder, die nicht zum kontextuellen Inhalt der Seite gehören, sollten daher ein leeres ALT-Attribut beinhalten (ALT=““), damit Ausgaben wie „… HintergrundVerlauf.jpg“ den Lesefluss dieser Ausgabegeräte nicht negativ beeinflussen.

Das ALT-Attribut sollte generell 80 Zeichen nicht überschreiten!

Das TITLE-Attribut

Das TITLE-Attribut wird als Tooltip angezeigt, wenn der Nutzer mit der Maus darüber verweilt. Es macht am meisten Sinn, wenn dahinter ein Link liegt und der Nutzer informiert wird, WOHIN verlinkt wird bzw. WAS passiert, wenn er darauf klickt.

Bei Ihrem Onlineshop könnten vermutlich fast alle TITLE-Attribute mit „zum Vergrößern anklicken“ ausgefüllt sein. Im Gegensatz zum ALT-Attribut ist das TITLE-Attribut für Suchmaschinen eher nebensächlich.

Das LONGDESC-Attribut

Das LONGDESC-Attribut beinhaltet einen Pfad zu einer umfassenden Bildbeschreibung in Form eines HTML-Dokuments (LONGDESC = LONG DEScription). Im Grunde genommen ist dieses Attribut ein aufgebohrtes ALT-Attribut und findet eine sinnvolle Anwendung in Bildergalerien, die nicht von Text umgeben sind, aber deren Bilder einer Beschreibung bedürfen, für die die rund 80 Zeichen das ALT-Attributs nicht ausreichen.

Für Fotos von Gemälden könnten z.B. Hintergrundinformationen, Interpretationen und ähnliches hinterlegt werden.
Das verwendete HTML-Dokument sollte ganz einfach mit Überschriften <h1>, <h2> … und Fließtext in <p>-TAGs aufgebaut sein.

Das LOWSRC-Attribut

Das LOWSRC-Attribut (LOWSRC = LOWSouRCe) kann wie das SRC-Attribut einen Dateipfad zu einer Grafik enthalten. Zu 56k-Modem-Zeiten machte es Sinn, dort den Pfad zu einer klein aufgelösten oder in der Qualität deutlich verringerten Version des eigentlichen Bildes zu hinterlegen. Auch Schwarz/Weiß Bitmap-Grafiken waren sehr beliebte Kandidaten, weil deren Dateigröße einen Bruchteil der eigentlichen Grafik ausmachte.

Zu Unrecht fristet das LOWSRC-Attribut ein Schattendasein. Denn die Einsatzmöglichkeiten bei Webseiten mit vielen Bildern (z.B. Produktkategorie-Übersichts-Seiten) sind vielfältig.

TIPP: Hinterlegen Sie z.B. bei allen Produktbildern den Pfad zu Ihrem Logo als LOWSRC-Attribut, so dass es als Platzhalter beim Laden der Bilder erscheint.

Beispiel für das Ausfüllen der ALT- und TITLE-Tags

Sie verkaufen in Ihrem Online-Shop eine Harpune speziell für den Walfang. Dann wäre folgender ALT-Tag neben dem Bild sinnvoll: „Harpune – speziell für den Walfang“. Damit wissen Sehbehinderte und Suchmaschinen-Bots, WAS auf dem Bild zu sehen ist.

Im TITLE-Attribut könnte in der Produktauflistung „für Produktdetails anklicken“ und in der Detailansicht des Produkts „zum Vergrößern anklicken“ stehen, sofern Ihr Onlineshop diese Funktionen an den entsprechenden Stellen bietet.

Fazit

Mit korrekt ausgefüllten Attributen Ihrer Bilder können Sie einerseits gezielt Ihre Produkte bei Suchanfragen anzeigen lassen und anderseits die Benutzerfreundlichkeit Ihrer Seite für Sehende und Sehbehinderte in Bezug auf das Bildmaterial maximieren.

Testen Sie unseren Bildbearbeitungsservice

Senden Sie uns einfach ein Bild und wir zeigen Ihnen, was wir können.
Gratis Test

Ihre Informationen

Lassen Sie uns wissen, was sie benötigen.