Bilder SEO, Dateinamen und Alternativtexte richtig nutzen

Auf deiner Website liegen Fotos aus dem Betrieb: die neue Werkstatt, das fertige Bad, der Teller, für den die Leute aus drei Orten anreisen. Und alle heißen IMG_4471.jpg.

Für Google sind das leere Kacheln. Für einen blinden Besucher, dessen Vorleseprogramm die Seite durchgeht, ebenfalls. Zwei Gruppen, die du gleichzeitig ausschließt, mit einem Fehler, der sich in Minuten beheben lässt.

Bilder SEO ist der Teil der Optimierung mit dem besten Verhältnis von Aufwand zu Wirkung. Kein Umbau nötig, kein Entwickler, nur ein bisschen Sorgfalt beim Hochladen. Hier steht, worauf es ankommt.

Was Bilder SEO und Alt Text konkret bringen

Suchmaschinen können ein Foto inzwischen grob erkennen, aber sie wissen nicht, wessen Werkstatt darauf zu sehen ist und in welchem Ort sie steht. Das erfahren sie aus dem Dateinamen, dem Alternativtext, der Bildunterschrift und dem Text drumherum.

Drei Effekte hast du davon. Erstens Sichtbarkeit in der Bildersuche, was besonders bei sichtbaren Ergebnissen zählt: Frisuren, Torten, Möbel, Fahrzeuge, Räume. Zweitens hilft ein beschriftetes Bild der Seite, auf der es steht, weil es zum Thema passt. Drittens, und das ist der wichtigste Punkt: Deine Website wird für Menschen nutzbar, die sie sich vorlesen lassen.

Der Alternativtext ist zuerst ein Zugänglichkeitswerkzeug

Der Alt-Text steht im Quelltext hinter jedem Bild und beschreibt, was zu sehen ist. Ein Vorleseprogramm liest ihn vor. Er erscheint außerdem, wenn ein Bild nicht lädt. Das ist keine SEO-Erfindung, sondern seit jeher Teil des Webs.

Für viele Betriebe wird Barrierefreiheit inzwischen auch zur rechtlichen Frage, je nachdem, was sie anbieten und an wen sie verkaufen. Das ist keine Rechtsberatung, im Zweifel fragst du eine Anwältin oder einen Anwalt. Was du ohne Gutachten schon jetzt verbessern kannst, steht in Barrierefreie Website, was du jetzt schon umsetzen kannst.

Dateinamen, die vor dem Hochladen entstehen

Benenne die Datei, bevor sie auf der Website landet. Danach ist es Arbeit, weil Links und Verweise brechen.

• Kleinbuchstaben, Wörter mit Bindestrich getrennt, keine Unterstriche.
• Keine Umlaute, kein ß, keine Leerzeichen. Aus Küche wird kueche.
• Beschreibend statt kreativ, drei bis fünf Wörter reichen.
• Ort dazu, wenn er wirklich passt, aber nicht in jede Datei.

Schlecht: IMG_4471.jpg, foto1.png, DSC00123-final-final2.jpg.
Gut: badsanierung-bodengleiche-dusche-mosbach.jpg, werkstatt-hebebuehne-innenansicht.jpg, flammkuchen-elsaesser-art.jpg.

Ein Hinweis aus der Praxis: Wenn du ein Foto später austauschst, lade es unter demselben Namen hoch, sofern das Motiv gleich bleibt. Sonst sammelst du Karteileichen an.

Alternativtexte schreiben, die etwas taugen

Stell dir vor, du beschreibst das Bild jemandem am Telefon, der es nicht sieht. Genau das ist der Alt-Text.

1. Beschreib, was zu sehen ist, nicht was du verkaufen willst. Ein Bild von einer Hebebühne ist keine Autoreparatur in Mosbach seit 1998.
2. Bleib kurz, ein Satz genügt. Viele Vorleseprogramme brechen lange Texte ohnehin ab.
3. Kein Bild von und keine Grafik zeigt am Anfang. Dass es ein Bild ist, sagt das Programm schon selbst.
4. Ein Suchbegriff darf vorkommen, wenn er zum Motiv passt. Mehr nicht.
5. Dekoration bekommt einen leeren Alt-Text. Trennlinien, Hintergrundmuster oder ein Icon neben einem Wort, das ohnehin danebensteht, werden mit alt="" versehen. Dann überspringt das Vorleseprogramm sie, statt Unsinn vorzulesen.

Beispiele, damit es greifbar wird:

• Schlecht: Bad. Zu wenig.
• Schlecht: Badsanierung Mosbach Badumbau Fliesen Sanitär Handwerker Neckar-Odenwald. Das ist Keyword-Stopfen und wird als solches erkannt.
• Gut: Bodengleiche Dusche mit grauen Großformatfliesen und Glasabtrennung nach dem Umbau.

Sonderfälle, die oft falsch gemacht werden

Ein Bild, das zugleich ein Link ist, braucht einen Alt-Text, der das Ziel beschreibt, nicht das Motiv. Beim Logo im Kopfbereich, das zur Startseite führt, gehört also der Firmenname hinein. Bei einem Bild, in dem Text steht, etwa einer Aktionsgrafik, muss dieser Text in den Alt-Text, sonst geht die Information verloren. Besser wäre allerdings, den Text gar nicht erst ins Bild zu setzen.

Was um das Bild herum passiert, zählt mit

Ein Bild wird immer im Zusammenhang bewertet. Das heißt für dich:

• Bildunterschrift nutzen, wo sie natürlich wirkt. Sie wird überdurchschnittlich oft gelesen und darf mehr Kontext liefern als der Alt-Text.
• Das Bild dort platzieren, wo der Text davon handelt. Ein Werkstattfoto mitten im Abschnitt über Öffnungszeiten passt nicht.
• Eigene Fotos statt gekaufter. Dasselbe Stockfoto steht auf hunderten Websites und bringt in der Bildersuche nichts.
• Bilder in die Sitemap aufnehmen, wenn deine Website das anbietet.

Technik: klein genug, scharf genug

Das beste Bild nützt nichts, wenn es die Seite lahmlegt. Ein Foto direkt aus dem Handy ist mehrere Megabyte groß und viel größer, als es je angezeigt wird. Skaliere auf die tatsächlich benötigte Breite, komprimiere und nutz ein modernes Format. Die Schritte dazu stehen in Bilder fürs Web richtig skalieren und komprimieren, die Messung der Auswirkung in Ladezeit der Website messen und wirklich verbessern.

Zwei technische Punkte, die selten jemand erwähnt und die trotzdem Wirkung haben: Gib Breite und Höhe an, damit beim Laden nichts springt. Und lass Bilder unterhalb des ersten Bildschirms verzögert laden, das obere Bild aber nicht, sonst wirkt die Seite beim Öffnen leer.

Häufige Fragen

Muss wirklich jedes Bild einen Alt-Text haben?

Jedes Bild braucht das Attribut, aber nicht jedes braucht Inhalt. Inhaltsbilder bekommen eine Beschreibung, reine Dekoration bekommt einen leeren Alt-Text. Ein fehlendes Attribut ist der schlechteste Fall, weil manche Vorleseprogramme dann den Dateinamen vorlesen. IMG unterstrich 4471 punkt jpg hilft niemandem.

Gehört der Ortsname in jeden Alternativtext?

Nein. Wenn auf zwanzig Bildern zwanzigmal Mosbach steht, wirkt das gebaut. Nimm den Ort dort, wo er zum Motiv gehört, etwa beim Außenbild des Ladens oder bei einer Referenz, die tatsächlich dort entstanden ist.

Was ist mit Bildern, die von einer KI erzeugt wurden?

Die brauchen genauso einen ordentlichen Alt-Text, zusätzlich aber eine sichtbare Kennzeichnung am Bild selbst. Ein Hinweis im Impressum reicht dafür nicht aus. Wie du das sauber umsetzt, steht in KI Kennzeichnung von Bildern auf der Website umsetzen. Das ist keine Rechtsberatung, im Zweifel fragst du eine Anwältin oder einen Anwalt.

Der einfachste Einstieg: Nimm dir die zehn wichtigsten Bilder deiner Website vor, benenn die Dateien um und schreib je einen Satz dazu. Das ist an einem Vormittag erledigt und wirkt auf beiden Seiten, bei der Suche und bei den Menschen, die deine Seite vorgelesen bekommen.

Schreib uns, was du vorhast, wir melden uns mit einer ehrlichen Einschätzung.