Alt Attribut
Das Alt-Attribut (Alt = Alternative) im Quelltext einer Webseite stellt eine alternative Beschreibung für Bilder dar. Sollte ein Bild nicht geladen werden können, wird die alternative Beschreibung angezeigt. Suchmaschinen nutzen das Alt-Attribut um den Inhalt des Bildes zu erkennen, da Bilddateien selbst noch immer nicht direkt ausgelesen werden können. Ebenfalls nutzen Screenreader dieses Attribut, diese Lesen die Inhalte dem Nutzer vor, diese werden oft von sehbehinderten Menschen genutzt.
Inhaltsverzeichnis
Aufbau und Beispiel
Das Alt-Attribut wird im Quelltext der Webseite direkt innerhalb des IMG-Tags genutzt. Nachfolgend der Aufbau im Gesamtzusammenhang.
<img src="ordner/bild.jpg" alt="Hier eine Beschreibung des Bildes">
Der in Anführungszeichen stehende Teil alt=““ enthält die eigentliche Beschreibung. Diese wird angezeigt, falls das Bild nicht geladen werden kann.
Alt-Tag vs. Title-Tag
Fälschlicher Weise werden Alt-Attribute oftmals dazu genutzt, um zusätzliche Informationen zu einem Bild anzubieten. Dies verfehlt jedoch den eigentlichen Sinn, eine Beschreibung zur Verfügung zu stellen. Zusätzliche Informationen sollten daher immer im Title-Tag des Bildes zur Verfügung gestellt werden.
<img src=“ordner/bild.jpg“ alt="Hier eine Beschreibung des Bildes" title="Hier zusätzliche Informationen">
Der Title-Tag wird wie das Alt-Attribut im IMG-Tag des Bildes (im Quelltext der Webseite) platziert. Der Title-Tag wird in allen gängigen Browsern als Tool-Tipp dargestellt. Beim Mouse-Over erscheint der Text, der im Title-Tag hinterlegt worden ist.
Somit besteht der Unterschied zum Alt-Attribut darin, dass der Title-Tag für den Nutzer beim Mouse-Over sichtbar wird und zusätzliche Informationen zum Bild anbietet und das Alt-Tag in der Regel für den User nicht sichtbar wird (Ausnahme defekte Bild-Dateien).
Der Title-Tag kann ebenfalls in einem Link genutzt werden, um weitergehenden Informationen zum Linkziel zur Verfügung zu stellen. Nachfolgend ein Beispiel der Einbindung in HTML.
<a href="https://www.advidera.com" title="Eine Agentur für digitales Marketing">
Longdesc für tiefergehende Informationen
Longdesc (Long = Lang; Desc = Beschreibung) betitelt ein Attribut, welches die Möglichkeit bietet, eine lange Beschreibung eines Bildes zur Verfügung zu stellen. Das longdesc-Attribut wird ebenfalls im IMG-Tag ausgewiesen.
<img src="ordner/bild.jpg" alt="Hier eine snnvolle Beschreibung" longdesc="ordner/beschreibung-zum-bild.html">
Im Gegensatz zum Alt-Attribut oder auch dem Title-Tag können die weiterführenden Informationen auf einer seperaten HTML-Datei dargestellt werden. Weitere Möglichkeiten der Einbindung können hier nachgelesen werden (Link).
Aktuell unterstützt nach W3C School kein Browser das longdesc-Attribut. Dies kann sich doch in naher Zukunft ändern.
| Browser | Support longdesc |
| Chrome | Nicht unterstützt |
| Internet Explorer | Nicht unterstützt |
| Mozialla Firefox | Nicht unterstützt |
| Safari | Nicht unterstützt |
| Opera | Nicht unterstützt |
Stand 11.05.16 – Quelle http://www.w3schools.com/tags/att_img_longdesc.asp
Alt Attribute SEO (Suchmaschinenoptimierung)
In der Suchmaschinenoptimierung spielen die Alt Attribute nach wie vor eine wichtige Rolle. Dessen Optimierung ist zur Onpage-Optimierung zu zählen. Neben dem verbesserten Nutzererlebnis durch den vorhandenen Alt-Tag (indirekter Rankingfaktor), kann auch die Relevanz zu bestimmten Suchbegriffen (Keywords) durch den Alt-Tag gesteigert werden. Daher ist es sinnvoll wichtige Suchbegriffe, die ebenfalls die Inhalt des Bildes beschreiben mit in die alternative Beschreibung aufzunehmen. Keyword Stuffing sollte jedoch in jedem Fall vermieden werden, dies könnte als Webspam eingestuft werden.
Neben einer Optimierung der organischen Suchergebnisse, ist durch die Nutzung der Alt-Attribute eine Verbesserung der Sichtbarkeit innerhalb der Bildersuche möglich. Durch die Bildersuche kommen potenzielle Neukunden auf Ihre Webseite. Der Tile-Tag darf nicht mit dem Meta Title verwechselt werden.