Bild-SEO: Alt-Texte, Dateinamen und Geschwindigkeit

Bilder leisten auf einer Website unendlich viel stille Arbeit. Sie zeigen Produkte aus jedem Blickwinkel, illustrieren komplexe Ideen, schaffen Vertrauen durch echte Fotografie und unterbrechen Textwände, damit Besucher auch wirklich weiterlesen. Doch trotz dieses Wertes gehören Bilder zu den am meisten vernachlässigten Bereichen der Suchmaschinenoptimierung. Viele Website-Betreiber laden ein Foto direkt vom Handy oder einer Stock-Bibliothek hoch, machen sich keinerlei Gedanken und gehen zum nächsten über. Das Ergebnis ist eine Seite, die langsam lädt, den Suchmaschinen nichts darüber mitteilt, was das Bild zeigt, und stillschweigend Ranking-Potenzial versickern lässt.

Bild-SEO ist die Praxis, Ihre Bilder so vorzubereiten und zu beschreiben, dass sowohl Menschen als auch Suchmaschinen sie verstehen, finden und schnell laden können. Es befindet sich an der Schnittstelle von drei Disziplinen: Zugänglichkeit, technische Leistung und On-Page-Relevanz. Wenn Sie es richtig machen, erhöhen Sie Ihre Sichtbarkeit in der Bildsuche, gestalten Ihre Seiten benutzerfreundlicher für unterstützende Technologien und verkürzen die wertvolle Zeit, die eine Seite zum Laden benötigt. Dieser Leitfaden führt Sie durch die praktischen Hebel, die Sie betätigen können, beginnend mit den Wörtern, die Ihre Bilder beschreiben, und endend mit den technischen Entscheidungen, die die Ladegeschwindigkeit bestimmen.

Warum Bild-SEO Ihre Aufmerksamkeit verdient

Es ist leicht, Bilder als Dekoration zu behandeln, aber Suchmaschinen behandeln sie als Inhalt. Google bietet eine separate Bildsuche an, und ein erheblicher Teil der Suchaktivitäten findet dort statt. Menschen suchen nach Rezepten, Produkten, Diagrammen, Anleitungen und Inspirationen eher über Bilder als über Text. Wenn Ihre Bilder für einen Crawler unsichtbar sind, erscheinen Sie in diesem Bereich einfach nicht. Schlimmer noch, schwere, unoptimierte Bilder sind einer der häufigsten Gründe dafür, dass sich eine Seite träge anfühlt, und Langsamkeit beeinträchtigt sowohl die Nutzererfahrung als auch die Art und Weise, wie Suchmaschinen Ihre Seite bewerten.

Es gibt auch eine Dimension der Barrierefreiheit, die sich nahtlos mit der SEO überschneidet. Menschen, die Screenreader verwenden, verlassen sich auf Textbeschreibungen, um zu verstehen, was ein Bild vermittelt. Derselbe Text, der einem Screenreader-Benutzer hilft, hilft auch einer Suchmaschine, das Bild zu verstehen. Dies ist einer jener seltenen Fälle, in denen das Richtige für Menschen und das Richtige für Rankings dieselbe Handlung sind. Wenn Sie eine klare Beschreibung eines Bildes schreiben, dienen Sie einem sehbehinderten Besucher und einem Crawler in einem einzigen Zug.

Alt-Text schreiben, der wirklich hilft

Alt-Text, kurz für Alternativtext, ist die schriftliche Beschreibung, die einem Bild im Code Ihrer Seite beigefügt ist. Er dient mehreren Zwecken gleichzeitig. Wenn ein Bild nicht geladen werden kann, erscheint der Alt-Text an seiner Stelle, sodass der Besucher immer noch versteht, was dort hätte sein sollen. Wenn ein Screenreader auf das Bild stößt, liest er den Alt-Text laut vor. Und wenn eine Suchmaschine die Seite durchsucht, ist der Alt-Text eines der stärksten Signale, das sie über das Thema des Bildes hat. Behandeln Sie Alt-Text als einen kurzen, ehrlichen Satz, der beschreibt, was auf dem Bild zu sehen ist und warum es auf der Seite ist.

Seien Sie spezifisch und natürlich

Der häufigste Fehler ist das Schreiben von Alt-Text, der entweder leer ist oder mit Keywords überladen. Beide Extreme scheitern. Ein leeres Alt-Attribut sagt Suchmaschinen nichts und lässt Screenreader-Benutzer im Stich. Ein mit Keywords überladenes Attribut wie "Schuhe Laufschuhe beste Schuhe günstige Schuhe Schuhe kaufen" liest sich wie Spam und beeinträchtigt die Erfahrung für jeden, der unterstützende Technologien verwendet. Ziel ist die Mitte: Beschreiben Sie das Bild, als würden Sie es einem Freund am Telefon erklären. Wenn das Bild ein Paar Trailrunning-Schuhe auf einem felsigen Pfad zeigt, schreiben Sie genau das. Spezifität macht die Beschreibung nützlich.

Passen Sie die Beschreibung an den Kontext an

Der richtige Alt-Text hängt von der Rolle ab, die das Bild spielt. Ein Produktfoto auf einer Shop-Seite sollte das Produkt klar benennen. Ein Diagramm, das einen Prozess erklärt, sollte zusammenfassen, was das Diagramm darstellt, anstatt jedes Element aufzulisten. Ein rein dekoratives Bild, wie eine Hintergrundtextur, die der Bedeutung nichts hinzufügt, kann ein leeres Alt-Attribut erhalten, damit Screenreader es überspringen, anstatt störenden Ballast anzukündigen. Das Nachdenken über die Funktion jedes Bildes hält Ihre Beschreibungen relevant und vermeidet, Benutzer mit unnötigem Rauschen zu überfordern.

Fassen Sie sich kurz

Es hat keinen Vorteil, einen Absatz in ein Alt-Attribut zu schreiben. Eine klare Beschreibung von etwa einem Satz ist völlig ausreichend. Wenn ein Bild wirklich eine lange Erklärung benötigt, wie z.B. ein komplexes Diagramm, platzieren Sie diese Erklärung im umgebenden Text oder in einer Bildunterschrift, wo jeder sie lesen kann, und halten Sie den Alt-Text als kurze Zusammenfassung. Bildunterschriften werden übrigens häufiger gelesen als fast jeder andere Text auf einer Seite, daher ist eine gut geschriebene Bildunterschrift ein stilles Arbeitstier für Engagement und Relevanz.

Dateinamen: Das Signal, das die meisten vergessen

Noch bevor ein Bild auf der Seite erscheint, enthält sein Dateiname Informationen. Ein Foto direkt von einer Kamera könnte etwa "IMG_4821.jpg" heißen, was einer Suchmaschine nichts sagt. Benennt man diese Datei in "trail-running-shoes-rocky-path.jpg" um, verwandelt sich eine bedeutungslose Zeichenfolge in ein aussagekräftiges Signal. Dies kostet Sie ein paar Sekunden pro Bild und zahlt sich aus, da der Dateiname Teil dessen wird, wie das Bild verstanden und indexiert wird.

Beachten Sie beim Benennen von Dateien einige einfache Konventionen. Verwenden Sie Kleinbuchstaben, um Verwechslungen auf verschiedenen Servern zu vermeiden. Trennen Sie Wörter mit Bindestrichen anstatt mit Leerzeichen oder Unterstrichen, da Bindestriche als Worttrenner gelesen werden, Unterstriche aber oft nicht. Halten Sie den Namen kurz, aber beschreibend und konzentrieren Sie sich darauf, was das Bild tatsächlich zeigt. Vermeiden Sie es, irrelevante Keywords hineinzustopfen; ein Dateiname sollte zum Bild passen, nicht zu Ihrer gesamten Keyword-Liste. Konsistenz in Ihrer gesamten Bibliothek erleichtert auch Ihre eigene Asset-Verwaltung auf lange Sicht erheblich.

Geschwindigkeit: Die technische Hälfte der Bild-SEO

Selbst das am schönsten beschriebene Bild kann eine Seite belasten, wenn es mehrere Megabyte groß ist. Die Leistung ist der Punkt, an dem Bild-SEO zu einer technischen Disziplin wird, und hier verstecken sich auch die größten Gewinne. Ziel ist es, ein Bild zu liefern, das in der angezeigten Größe scharf aussieht, ohne den Browser des Besuchers dazu zu zwingen, viel mehr Daten herunterzuladen, als er benötigt. Es gibt mehrere Techniken, die zusammenwirken, um dies zu erreichen.

Vor dem Hochladen komprimieren

Komprimierung reduziert die Dateigröße eines Bildes, während es visuell akzeptabel bleibt. Es gibt zwei Arten: verlustfreie Komprimierung, die redundante Daten entfernt, ohne das Aussehen des Bildes zu verändern, und verlustbehaftete Komprimierung, die einige Details zugunsten einer viel kleineren Datei verwirft. Für die meisten Webfotografien erzeugt ein sinnvolles Maß an verlustbehafteter Komprimierung Bilder, die für das menschliche Auge identisch aussehen, aber nur einen Bruchteil der Originalgröße haben. Jedes Bild vor dem Hochladen einem Komprimierungsschritt zu unterziehen, ist eine der wirkungsvollsten Gewohnheiten, die Sie sich aneignen können.

Die richtige Größe bereitstellen

Ein häufiger und kostspieliger Fehler ist das Hochladen eines riesigen Originals und das Überlassen des Browsers, es auf dem Bildschirm zu verkleinern. Wenn ein Bild nur achthundert Pixel breit angezeigt wird, gibt es keinen Grund, ein vier Tausend Pixel großes Original zu liefern. Der Browser muss trotzdem die gesamte schwere Datei herunterladen, bevor er sie visuell neu skaliert. Ändern Sie die Größe der Bilder auf die Abmessungen, in denen sie tatsächlich angezeigt werden, und stellen Sie, wo möglich, mehrere Größen bereit, damit kleinere Bildschirme kleinere Dateien erhalten. Responsive Bildtechniken ermöglichen es einem Telefon, eine bescheidene Version herunterzuladen, während ein großer Monitor eine schärfere erhält.

Ein modernes Format wählen

Bildformate haben sich stark verbessert. Ältere Formate wie JPEG und PNG haben immer noch ihren Platz, aber neuere Formate wie WebP und AVIF bieten in der Regel dieselbe visuelle Qualität bei einer deutlich geringeren Dateigröße. Das Umstellen Ihrer Bilder auf ein modernes Format ist oft der einfachste Weg, das Seitengewicht ohne sichtbaren Qualitätsverlust zu reduzieren. Viele Plattformen können diese Formate automatisch konvertieren und bereitstellen, daher lohnt es sich zu prüfen, ob Ihre dies tut, bevor Sie alles manuell konvertieren.

Bilder unterhalb des sichtbaren Bereichs per Lazy Loading laden

Lazy Loading weist den Browser an, das Herunterladen eines Bildes zu verzögern, bis der Besucher in dessen Nähe scrollt. Das bedeutet, dass die Bilder ganz oben auf der Seite, die ein Besucher zuerst sieht, sofort geladen werden, während Bilder weiter unten warten. Der Effekt ist ein viel schnelleres initiales Rendern, da der Browser nicht versucht, alles auf einmal abzurufen. Die meisten modernen Browser unterstützen ein einfaches Ladeattribut, das dieses Verhalten ohne komplexen Code ermöglicht. Eine Einschränkung: Laden Sie das Hauptbild oben auf der Seite nicht per Lazy Loading, da dies das Bild ist, das Sie am schnellsten anzeigen möchten.

Immer Breite und Höhe festlegen

Durch die Angabe von Breite und Höhe eines Bildes in Ihrem Code kann der Browser den richtigen Platz dafür reservieren, bevor es geladen wird. Ohne dies können die Seiteninhalte beim Eintreffen der Bilder herumspringen, ein störender Effekt, der auch eine wichtige Leistungskennzahl zur visuellen Stabilität beeinträchtigt. Das Reservieren von Platz ist ein kleines Detail, das die Erfahrung reibungsloser macht und Ihre Werte schützt. Es ist eine dieser stillen Best Practices, die nichts kostet und nur hilft.

Zusammenführung mit strukturierten Daten

Für bestimmte Arten von Inhalten können Sie Suchmaschinen über strukturierte Daten zusätzlichen Kontext zu Ihren Bildern geben. Produktseiten, Rezepte und Artikel können alle strukturierte Daten verwenden, um Bilder mit bestimmten Entitäten zu verknüpfen, wodurch Ihre Bilder für eine reichhaltigere Darstellung in den Suchergebnissen in Frage kommen. Dies ist fortgeschrittener als Alt-Text und Dateibenennung, baut aber auf demselben Prinzip auf: Je klarer Sie die Bedeutung Ihrer Bilder machen, desto besser können Suchmaschinen sie verwenden. Wenn Sie aus anderen Gründen bereits strukturierte Daten hinzufügen, ist die Aufnahme von Bildreferenzen eine sinnvolle Erweiterung.

Bild-SEO belohnt einen methodischen Ansatz mehr als clevere Tricks. Erstellen Sie eine einfache Routine: Benennen Sie die Datei beschreibend um, komprimieren Sie sie, dimensionieren Sie sie richtig, wählen Sie ein modernes Format, schreiben Sie ehrlichen Alt-Text und fügen Sie eine Bildunterschrift hinzu, wo es hilft. Wenden Sie diese Routine auf jedes Bild an, und Ihre Bibliothek wird stetig schneller und besser auffindbar. Wenn Sie sehen möchten, wie die Bildarbeit in ein breiteres technisches Gesamtbild passt, behandelt unser Leitfaden zu den Grundlagen der technischen SEO die umfassenderen Grundlagen, und der Artikel zu Website-Geschwindigkeit und Core Web Vitals geht tiefer auf die Leistungsseite ein. Ein regelmäßiger SEO-Audit ist ebenfalls ein guter Zeitpunkt, um zu überprüfen, ob Ihre Bilder ihr Gewicht tragen.

Häufig gestellte Fragen

Referenzen

1. Google Search Central, Best Practices für Bild-SEO, developers.google.com/search
2. web.dev, Leitfaden zu schnellen Ladezeiten und Bildoptimierung, web.dev

Bereit, jedes Bild für sich arbeiten zu lassen? Beginnen Sie mit unserem vollständigen Leitfaden zu SEO-Diensten für das Gesamtbild, oder kontaktieren Sie uns, um Ihre Website zu besprechen.