In HTML ist <img> das Tag, mit dem wir ein Bild oder ein Foto auf eine Webseite setzen.
Dieses <img>-Tag hat zwei erforderliche Attribute: src gibt den Pfad zum Bild an, alt einen Alternativtext dafür. Das Attribut alt beschreibt das Bild für den Fall, dass es aus irgendeinem Grund nicht erscheint, meist wegen eines falschen Pfads.
<img src="/beispiel-bild.jpg" alt="Hier steht die Beschreibung des Bildes">Das Attribut alt ist im Tag erforderlich, trotzdem lassen viele es lieber leer oder schreiben etwas hinein, das mit dem Bild nichts zu tun hat.
Passendes Werkzeug: Sie können die Bilder auf Ihrer Seite jetzt mit unserem SEO-Werkzeug prüfen. Es analysiert nach 10 einzelnen Kriterien, nutzen Sie also unseren Alt Text Checker und holen sich die solidesten Hinweise. Der Alt Text Checker, mit dem unsere eigenen SEO-Fachleute arbeiten, steht Ihnen jetzt kostenlos offen.
Die meisten Webdesigner beachten den Alt-Text kaum oder gar nicht, weil sie nicht wissen, wie nützlich er ist, und in den meisten Kursen zu Webdesign oder SEO wird seine Bedeutung nicht deutlich gemacht.
In diesem Beitrag von Türk SEM erklären wir, was Alt-Text bedeutet, was er leistet und wie viel er hilft, wenn Sie ein Bild auf Ihre Webseite setzen. Außerdem nennen wir einige Punkte, die Sie beim Schreiben von Alt-Texten für Ihre Bilder im Kopf behalten sollten.
Wir haben es kurz gehalten, und Sie werden die richtige Verwendung genau erfassen.
Was ist Alt-Text?
Der Alt-Text heißt auch Alternativtext oder einfach das alt-Attribut.
Er ist ein knapper, beschreibender Text, der ein Bild genau wiedergibt.
Standardmäßig sehen Sie diesen Text nicht, wenn Sie eine Webseite im Browser betrachten. Trotzdem gilt: Sobald Ihr Besucher ein Bild aus irgendeinem Grund nicht sehen kann, wird der Alt-Text sichtbar. Er sollte aussagekräftig und beschreibend genug sein, um der Leserschaft eine Vorstellung davon zu geben, worum es im Bild geht und was darin steckt.
Nehmen wir an, Sie haben ein Bild wie dieses:
Statt eines allgemeinen Wortes wie Berg oder See sollten Sie vollständig beschreibend werden. Richtig ist: “Helvadere-See mit dem Hasandağı im Hintergrund”
<img src="/imgs/hasandagi.jpg" alt="Helvadere-See mit dem Hasandağı im Hintergrund">Warum zählt der Alt-Text eines Bildes?
Gehen wir durch, warum wir das alt-Attribut in das <img>-Tag schreiben sollten.
Es gibt mehrere weitere Gründe, nicht bloß einen einfachen Alternativtext zu Ihren Bildern zu setzen, sondern einen beschreibenden, aussagekräftigen:
- Wenn Sie Probleme mit der Verbindung haben oder der Pfad zu Ihrem Bild falsch eingetragen wurde, lädt Ihr Bild auf der Seite vielleicht nicht. Dann erscheint der Wert des Alt-Textes an seiner Stelle und sagt Ihren Besuchern, was dort war.
- Der Alt-Text lässt ein Bild so beschreiben, dass Suchmaschinen es zur Verbesserung der SEO Ihrer Seite nutzen können. Er gibt Suchmaschinen bessere Angaben für höhere Positionen in den SERPs, das heißt: ein passender Alt-Text hilft Ihrer Seite, weiter vorn zu ranken.
- Sehbehinderte Nutzer mit einem Screenreader können sich die Beschreibung des Bildes anhören. Die Barrierefreiheit für Menschen zu verbessern, die den Bildschirm nicht sehen, ist genau das, was Ihrem Besucher die volle Nutzung Ihrer Website erlaubt.
- Wenn Sie Ihr Bild auf eine andere Seite oder ein Dokument verlinken möchten, dient der Alt-Text als Linktext, falls das Bild nicht laden kann.
Hinweise für gute Alternativtexte
Es gibt einen bekannten Spruch: “Was sich zu tun lohnt, lohnt sich, gut zu tun.” Beim Schreiben Ihres Alternativtextes gilt ziemlich genau dasselbe: gar keinen Alternativtext zu schreiben ist besser als einen schlechten, unpassenden oder sinnlosen.
Ein paar Hinweise, die Sie beim Schreiben im Kopf behalten sollten:
Beschreiben Sie das Bild genau
Der ganze Sinn eines Alt-Textes liegt darin, dass er für das Bild einstehen kann.
Damit er diesen Zweck erfüllt, muss er das Bild genau und so beschreiben, dass die Leserschaft es sich vorstellen kann.
Ein nützlicher Hinweis: Schreiben Sie Ihren Alt-Text so, als beschrieben Sie das Bild jemandem, der es nicht sehen kann.
Halten Sie es kurz
An dieser Stelle denken Sie vielleicht, diese Alt-Texte sollten die Länge eines Absatzes haben, doch das ist nicht die richtige Verwendung. In den meisten Fällen sollten wir immer den besten Weg suchen, unsere Bilder in sechs oder sieben Wörtern zu beschreiben.
Behalten Sie im Kopf, dass Screenreader den Alt-Text bei etwa 125 Zeichen abschneiden können; innerhalb dieser Grenze zu bleiben ist also am besten. Trotzdem sollten Sie es immer vermeiden, ein einzelnes Wort als Alt-Text zu verwenden.
Beispiel: Helvadere-See und Hasandağı vom Helvadere-Park aus
Damit ist das Bild in 50 Zeichen vollständig beschrieben. Selbst wenn wir von einer Grenze von 125 Zeichen ausgehen, schaffen wir die Beschreibung meist in 60 bis 70.
Keywords ja, Keyword-Stuffing nein
Es ist normal, dass Ihnen die Wahl des Keywords beim Beschreiben eines Bildes zuerst in den Sinn kommt. Dieses Bild aber mit Keywords zu füllen, ist der falsche Weg.
Keywords im Alt-Text helfen Ihrer Seite durchaus, weiter vorn zu ranken; denken Sie aber daran, dass Suchmaschinen unbrauchbare oder schlechte Alt-Texte als Problem behandeln.
Falsch: Hasandağı, Helvadere, Aksaray, Türkei, Berg, Park, Seefoto
All das heißt nur: Verwenden Sie Bilder, die das Ansehen Ihrer Seite wirklich stärken, und beschreiben Sie sie mit den wichtigsten Keywords, nicht mit allen.
Wiederholen Sie sich nicht
Vermeiden Sie Wiederholungen ganz. Warum sollten Sie die Überschrift Ihrer Seite oder deren Titel als Alt-Text verwenden? Ihn leer zu lassen ist meist besser, als Bildunterschriften oder den Text der Seite zu wiederholen.
Unser bester Rat dazu: Wenn Sie ein Bild nicht gut beschreiben können, lassen Sie den Alternativtext leer, statt irgendeinen Text hineinzuwerfen, oder nehmen Sie die Bildunterschrift als wiederholten Alternativtext.
Bildunterschrift und Alt-Text
Es ist leicht, Bildunterschrift und Alternativtext zu verwechseln oder das, was im Alternativtext steht, als Unterschrift zu wiederholen.
Bildunterschriften beschreiben Bilder, damit die Leserschaft sie mit dem umgebenden Text verbinden kann; der Alternativtext erklärt die Information in einem Bild oder beschreibt ein Bild für Nutzer eines Screenreaders.
Eine Unterschrift muss nicht Wort für Wort dem entsprechen, was das Bild zeigt; sie erklärt, wie das Bild zum Text oder zum Inhalt passt, in dem es steht.
Schreiben Sie nicht ‘Bild’ oder ‘Foto’ hinein
Wenn Sie das alt-Attribut an einem Bild-Tag verwenden, wissen Suchmaschinen bereits, dass es ein Bild ist; die Wörter Bild, Abbildung oder Foto braucht Ihr Alt-Text also nicht.
Gut ist es aber, den Menschen den Zusammenhang zu erschließen oder zu sagen, um welche Art Abbildung es sich handelt. Sie können Porträtaufnahme, Illustration, Bildschirmfoto, Diagramm und so weiter schreiben.
Alt-Texte mit KI schreiben
- Das SEO-Plugin Rank Math beschreibt Fotos mit KI, direkt im Plugin.
- Alt Text AI schreibt zu jedem Foto, das Sie hochladen, automatisch einen KI-gestützten Text, ohne dass Sie etwas tun müssen. Ich habe es in einigen Projekten eingesetzt und kann sagen, dass es gut funktioniert.
Zusammengefasst
In diesem Beitrag von Türk SEM haben wir den Alt-Text durchgegangen, ein Thema, das weit weniger Beachtung findet als es verdient, und dazu ein Alt-Text-Werkzeug veröffentlicht. Wenn Sie bis hierher gelesen haben, wissen Sie jetzt, was Alt-Text bedeutet und warum er zählt. Sie kennen außerdem einige wichtige Hinweise, wie Sie ihn beim Einsetzen eines Bildes auf Ihrer Seite verwenden.
Eine letzte Sache zum Merken: Sie sollten zu jedem Bild, das Sie auf Ihrer Website verwenden, einen Alternativtext setzen, Ihr Logo und Bilder als Schaltflächen eingeschlossen, und Sie sollten wissen, warum Sie das tun.
Vergessen Sie aber nicht, dass Bilder, die Teil der Gestaltung sind und in erster Linie schmücken statt Information zu tragen, keinen Alt-Text brauchen.
Danke fürs Lesen. Wir geben eine Menge wertvolles SEO-Wissen kostenlos weiter. Folgen Sie unseren Beiträgen, um Ihre eigenen Fähigkeiten aufzubauen, und nutzen Sie die Werkzeuge unserer SEO-Fachleute ohne Kosten.
