Monster der Webseitenoptimierung – Das fehlende ALT-Attribute Monster

ALT-Attribute sinnvoll optimieren und richtig einsetzen

Gute Bilder für Deine Webseite zu finden, ist zweifellos sehr wichtig für ein ansprechendes Design. Vergiss aber nicht, die Bilder beim Einfügen auch mit alternativen Texten zu hinterlegen. Das ist zum einen notwendig, damit auch an Screenreadern ein barrierefreies Surfen möglich ist und zum anderen, damit Suchmaschinen die Bilder optimal auslesen können. Man unterscheidet bei Bildbeschreibungen zwischen ALT- und Title-Attributen. Im CMS hast Du meist die Möglichkeit, diese in ein vorgefertigtes Feld einzutragen, während Du das Bild einfügst.

Das ALT-Attribut beschreibt den Inhalt der Grafik oder des Bildes. Wird ein Bild aus technischen Gründen nicht angezeigt, kann der Nutzer wenigstens ahnen, was es beinhaltet. Dank dieses Attributs erkennen Suchmaschinen den Bildinhalt. Existiert das Bild schon lange im Netz, ist es noch im Cache und in der Universal Search auffindbar – unabhängig von der Funktionalität Deiner Webpräsenz. Deine Seite kann also allein über das optimierte Bild gefunden werden.

Das ALT-Attribut sieht im Quellcode wie folgt aus:

Das Title-Attribut (Universal-Attribut) siehst Du am Bildschirm beziehungsweise auf dem Display mit kurzer Verzögerung, wenn der Cursor auf dem Bild ruht. Selbst wenn es keine technischen Ladefehler gibt und alle Dateien richtig verknüpft sind, ist das Tag sehr wichtig, insbesondere wenn keine Bildunterschrift vorhanden ist.

Abbildung 1: Foto mit Title-Attribut

So schlägt das Monster in der Praxis zu

Angenommen, Du startest einen Blog mit Artikeln zur Münchener Region mit dem Ziel, mittelfristig Kunden zu gewinnen, die bei Dir Touren buchen. Du legst im Herbst los mit einem Blogpost, zum Beispiel „Ein Herbstspaziergang an der Isar“. Hinzu kommt ein atmosphärisch passendes Landschaftsfoto. Versteckt lauert siegessicher das Monster: Es hält das Bild unter Verschluss, wenn Du kein ALT-Attribut hinterlegst. So ist es für Google Images und für Deine potenziellen Kunden schlicht unsichtbar.

Aufpassen solltest Du auch beim Löschen eines alten Bildes aus Deinem Datenverzeichnis. Wenn Du vergisst, das neue Bild mit der Webseite zu verknüpfen, sehen Besucher Deiner Seite nur einen Platzhalter. Der Clou: Bis Du es merkst und den Fehler behebst, sieht man trotzdem den Zusammenhang mit dem Text.

Abbildung 2: ALT-Attribut als Platzhalter

Das Monster gibt sich geschlagen, denn Dein aussagekräftiges ALT-Attribut kommt nun zum Einsatz. Mit der Botschaft hält es Leser trotz des fehlenden visuellen Elements auf der Seite, vorausgesetzt der Text ist gut und die Seite lädt schnell.

Bilder optimieren mit Ryte

Ryte hilft Dir mit umfassenden Reports, Deine Bilder zu optimieren. Im Seitenmenü findest Du im Modul Website Success unter dem Punkt „Dateien“ den Unterpunkt „Bilder“. Der Bereich „Status Codes“ sagt aus, ob alle visuellen Elemente überhaupt auf der Seite vorhanden und richtig verknüpft sind. Nur dann wird der Status Code 200 ausgeliefert.

Abbildung 3: Graph Status Codes

Mit dem Alt Texte Report („Dateien“ > „Bilder“ > „Alt Texte“) findest Du zudem alle Bilder, die kein Alt-Attribut enthalten. In Deinem CMS kannst Du sie nachträglich einfügen und optimieren.

Abbildung 4: Alt Texte Report

Fazit

Bilder ohne alternative Texte nutzen weder Webcrawlern noch Lesern. Achte darauf, dass Du jedes grafische Element – mit Ausnahme von Schmuckelementen wie Linien oder Buttons – korrekt benennst und relevante Keywords einfügst. Prüfe auch, ob ein Copyright erwähnt werden muss.

Kennst Du schon die anderen Monster der Webseitenoptimierung:

Das Weiterleitungs-Monster

Das hreflang-Monster

Das Thin Content Monster

Das 404 Monster

Das verwaiste Seiten Monster

Das falsche Canonical Tag Monster

Das Duplicate Content Monster

Das Monster der langsamen Ladezeit

Das Monster der internen Verlinkung