« Zurück zum Magazine

Bildoptimierung im SEO: So wird’s gemacht

Die Bildoptimierung im SEO ist ein wichtiger Punkt, den kein Webmaster oder SEO-Manager vernachlässigen sollte. Schnelles Internet und hochauflösenden Displays sind Standard im heutigen Alltag.

Daher kommt den Bildern und visuellen Inhalten auf Webseiten eine immer stärkere Bedeutung zu. Sie zeigen dem User das Produkt, unterstützen den Fließtext und visualisieren den Content. Zudem können Grafiken und Diagramme komplexe Inhalte schnell und vereinfacht darstellen.

Ein wichtiger Punkt der oft außer Acht gelassen wird, ist, wie über die Google Bildersuche wertvoller Traffic generiert werden kann. Damit die eigenen Bilder und Grafiken dort erscheinen, gibt es einiges zu beachten. Zudem wirken sich Bilder auch direkt auf die Performance einer Webseite aus. Wir erklären, was es bei der Bildoptimierung im SEO zu berücksichtigen gilt.

Bildoptimierung im SEO: Die Grundlagen

Bilder werden immer noch über einen HTML-Code eingebunden. Daran hat sich in den letzten Jahren kaum etwas geändert. Geändert hat sich hingegen die Art und Weise der Bildeinbindung auf einer Webseite. Diese ist mittlerweile automatisiert. CMS-Tools, wie WordPress oder Joomla, ermöglichen es meist einfach die Bilder per Drag Drop an der jeweiligen Stelle einzufügen. Der HTML-Code wird automatisch im Hintergrund generiert. Dieser besteht aus verschiedenen Attributen. Die am häufigsten verwendeten Attribute sind,

  • Src: Source = Quelle

  • Alt = Alternativ

  • Title = Titel

Der Name der Quelldatei wird über das src-Attribut angegeben. Dieses gibt den Pfad des Bildes an. Dieser wird relativ zur Position des Bildes auf der Webseite angegeben. Werden Bilder auf einem fremden Server gespeichert, wird dessen komplette Adresse angegeben, z.B https://www.beispiel.de/bilder/logo.png.

BildSEO0

Generell ist es zu empfehlen, Bilder auf den eigenen Servern zu speichern, umso die Dateien vor fremden Zugriff zu schützen und volle Kontrolle über die Dateien zu haben.

Das Alt und Title Attribut erfüllen zwei Funktionen. Einerseits liefern die Attribute Informationen für Bildschirmlesegeräte und sorgen somit für eine barrierefreie Webseite. Andererseits sind sie sehr wichtig, um in der Google Bildersuche zu erscheinen. Sie liefern den Bots der Suchmaschine wichtige Informationen über den Inhalt des Bildes. Google empfiehlt ausdrücklich die Verwendung der Elemente, um in der Bildersuche zu erscheinen. Diese beiden Elemente sind ein wichtiger Bestandteil in der Bildoptimierung im SEO.

Organisation: Struktur und Benennung der Dateien

Bei der Nutzung von CMS-Systemen wird die Ordnerstruktur durch das jeweilige System automatisch festgelegt. Je nach Einstellung werden die Bilder beispielsweise nach Upload-Datum organisiert. Zudem hat der Webmaster nur Zugriff auf die Dateien, jedoch nicht auf den Ordner selbst. Dies ist nicht weiter problematisch, da für den Abruf durch einen Browser in erster Linie wichtig ist, dass die Ordner über dem Root-Directory, sprich dem Stammverzeichnis, liegen.

Der Schutz der Bilddateien ist wichtiger. Es werden nicht die Dateien direkt, sondern die umliegenden Ordner vor fremden Zugriff geschützt. Dies wird über die htaccess-Datei realisiert. Sie definiert die Zugriffsrechte für Programme und Nutzer.

BildSEO1

Abbildung 1: Speichern der Abbildungen innerhalb einer Ordnerstruktur

Wichtiger für die Bildoptimierung im SEO ist die Benennung der Dateien. Hier sollte der Original-Dateiname nicht behalten werden. Zwar spielt der Dateiname für das Funktionieren der Webseite keine Rolle, dennoch aber aus SEO-Sicht bei der Indexierung der Bilder. Bilder deren Dateiname ein Keyword enthält, haben prinzipiell bessere Chancen in der Bildersuche gut zu ranken. Zudem erleichtert eine ordentliche und konsistente Dateibenennung die Organisation der Bilder. Dabei sollte das Keyword auch den Inhalt des Bildes wiederspiegeln. Die Zeiten in denen Keyword-Stuffing auch bei Bild-Dateinamen funktioniert hat, sind vorbei. Dabei sollten bei der Trennung von Wörtern keine Unterstriche sondern nur Bindestriche verwendet werden. Grund hierfür ist unter anderem eine saubere URL-Struktur zu erhalten, so empfiehlt es auch Google.

Des Weiteren ist es wichtig, die Keywords auch im Alt und Title Tag zu verwenden. So wird den Bots der Suchmaschinen der Zusammenhang zwischen dem Text und den Bildern aufgezeigt. Die Suchmaschinen sind soweit entwickelt, dass sie diesen erkennen. Daraus ergibt sich, die Bilder und deren Inhalte an passenden Textpassagen zu platzieren. Dies dient nicht der Suchmaschine sondern auch der User Experience.

Verschiedene Dateiformate: JPEG, PNG uvm.

Wie genau die Bildoptimierung im SEO erfolgen sollte, hängt auch vom Typ der Bilddatei ab. Diese gibt es in unterschiedlichen Größen und Dateiformaten. Moderne Browser können viele Dateiformate darstellen.

In den letzten Jahren haben sich einige Dateiformate durchgesetzt und zum Standard entwickelt. Jedoch steht auch diese Entwicklung nicht still.

Klassische Bilddateien im JPEG-Format

Das JPEG-Format ist der Klassiker unter den Bilddateien. Das Format stammt aus dem Jahr 1992. Wie auch andere Formate, wie PNG oder GIF gehört es zu den Rastergrafiken. Die einzelnen Pixel eines Bildes sind in einem Raster angeordnet und folgen einer festgelegten Struktur. JPEG Bilder sind vielseitig einsetzbar und eignen sich besonders für farbenreiche und kontrastreiche Farbfotos.

Die Alternative: Das PNG

Das PNG zählt ebenso wie das JPEG-Format zu den Rastergrafiken. Es stammt aus dem Jahr 1994 und wurde als Alternative zum GIF-Format entwickelt. Dieses war damals durch ein Patent geschützt. Das Dateiformat gibt es in zwei Varianten PNG8 und PNG24. Das PNG8 Format kann nur 256 Farben darstellen. Beim PNG24 Format sind es 16,7 Millionen Farben, ebenso wie beim JPEG.

Das PNG unterscheidet sich vor allem durch die Möglichkeit der Darstellung von transparenten Bereichen zum JPEG. Zudem werden PNG Dateien verlustfrei komprimiert. Dies ist beim JPEG Format nicht möglich. Jedoch werden so auch die Bilddateien größer. Sie eignen sich daher zur Darstellung von Logos oder auch Texten.

Bilddateien als Code: Das SVG

Der größte und wichtigste Unterschied vom SVG zu JPEG sowie PNG ist die Art des Dateiformats. Bei SVG-Dateien handelt es sich um Vektorgrafiken, denn SVG steht für Scalable Vector Graphics. Das Format geht auf eine Entwicklung des W3C aus dem Jahr 2001 zurück. Basis für das Format ist die Auszeichnungssprache XML.

Es ist somit möglich, SVG-Dateien direkt im HTML-Code einer Webseite einzubauen. Der Browser lädt die Grafiken dann direkt und per se keine Datei vom Server wie bei JPEG oder PNG. Dies wirkt sich positiv auf die Ladezeiten der Webseite aus, da weniger Anfragen zwischen Browser und Server auszutauschen sind. Zudem können SVG-Dateien verlustfrei skaliert werden. Dies ist bei JPEG oder PNG Dateien nicht möglich. SVG Dateien sind daher besonders für Logos oder Grafiken geeignet.

Die direkte Integration in dem HTML-Code hat allerdings auch einen Nachteil. SVG Dateien gelten als nicht sehr sicher. Das Format besitzt von Haus aus Sicherheitslücken über die beispielsweise schadhafte Skripts eingeschleust werden können. Diese können die Performance einer Webseite negativ beeinflussen und so für eine schlechte User Experience sorgen. Folglich können sich ranking-relevante Nutzersignale verschlechtern.

Die Eigenschaften Dateien auf einen Blick

Dateiformat Vorteile Nachteile
JPEG Vielseitig einsetzbar, Kleine Dateien mittels Komprimierung möglich, Von nahezu jedem Browser unterstütztKeine Darstellung transparenter Bereiche, Verlust feiner Details bei Komprimierung, Nicht verlustfrei skalierbar
PNGVielseitig einsetzbar, Darstellung von Transparenz, Verlustfreie KomprimierungGrößere Dateien bei komplexen Grafiken, Begrenzter Farbumfang bei PNG8 Dateien, Nicht verlustfrei skalierbar
SVG Frei und verlustfrei skalierbar, Darstellung von Transparenz, Animation über Java ScriptGroße Dateien bei komplexen Grafiken, Nur für Grafiken und Logos nutzbar, Ggf. Programmierkenntnisse erforderlich

Auf die Größe kommt es an

Die Größe der Bilddatei spielt natürlich auch bei der Performance der Webseite eine Rolle. Die Bildoptimierung im SEO besteht nicht nur aus der richtigen Benennung und Pflege der Tags. Auch die Auflösung der Datei ist ebenso wichtig, denn sie bestimmt direkt die Größe der Datei.

Eine größere Datei benötigt mehr Ressourcen sowohl auf dem Server als auch beim Laden der Datei. Es gilt also, die Dateien so klein wie möglich und so groß wie nötig zu halten. Denn verpixelte oder unscharfe Bilder sprechen den Nutzer ebenso wenig an wie lange Ladezeiten. Es ergibt also wenig Sinn, eine Datei mit einer Kantenlänge von 1000 Pixeln in ein Element einzubauen, dessen Kantenlänge nur 500 Pixel beträgt. Allerdings sollten die Bilder nicht zu klein gespeichert werden. Zu kleine Dateien auf denen der User den Inhalt nicht erkennt, werden auch keine guten Beitrag zum Traffic und zum Ranking leisten. Denn auch die Nutzersignale spielen bei den Bilderrankings eine Rolle. Erkennt der User nichts auf dem Bild oder nur sehr wenig, wird er die Seite wieder verlassen. Dies gilt insbesondere in der Bildersuche. Kleine Thumbnails oder unscharfe Bilder werden wohl kaum Traffic über den zweiten Klick innerhalb der Bildersuche generieren.

Die reine Dateigröße ist besonders im Zusammenhang mit mobile SEO und der verstärkten Nutzung von Smartphones sehr wichtig. Smartphone-Nutzer sind meist ungeduldig und verlassen bei zu langen Ladezeiten die Webseite schnell wieder. Die Optimierung von Bildern und insbesondere deren Dateigröße kann hier schnell zu besserer Performance führen. Wie wichtig diese Tatsache zeigt auch, dass der mobile Pagespeed ab Mitte des Jahres als Rankingfaktor eingeführt wird.

Neue Bildformate

PNG, JPEG oder das SVG haben sich etabliert. Dennoch schreitet die Entwicklung der Bilddateiformate weiter voran. Das JPEG 2000 und JPEG XR Format sind beispielsweise Weiterentwicklungen des originalen JPEG Formats. Bei kleiner Dateigröße bieten sie dieselbe Qualität. Zudem unterstützt das JPEG XR Format Transparenz wie das PNG Format.

Neben diesen Weiterentwicklungen werden auch neue Dateiformate entwickelt. Ziel dabei ist es vor allem, die Dateigröße gering zu halten ohne dabei Qualitätseinbußen hinnehmen zu müssen. Aktuelle Entwicklungen sind beispielsweise die Formate FLIF (Free Lossless Image Format) und HEIF (High Efficiency Image File).

Problematisch in diesem Zusammenhang ist die bisher kaum vorhandene Unterstützung durch die bekannten Browser. Über Tools wie Can I use kann die Kompatibilität verschiedener Dateiformate mit diversen Browsern geprüft werden.

Das Alt Attribut & Title Tag

Diese beiden Attribute sind die wichtigsten Elemente bei der inhaltlichen Bildoptimierung im SEO. Sie liefern den Suchmaschinen die nötigen Informationen und Hinweise, um den Inhalt der Bilder zu erschließen. Schließlich arbeitet die Bildersuche immer noch textbasiert, d.h. auf Basis der Informationen aus Dateiname, Title Tag und Alt Attribut erfasst die Suchmaschine den Inhalt eines Bildes. Daher ist die Pflege dieser Tags immer noch sehr wichtig.

Wie Title Tag und Alt Attribut optimal gepflegt und genutzt werden zeigt unsere Anleitung zur Bilder-SEO.

BildSEO2

BildSEO3

Wie wichtig korrekt ausgezeichnete Metadaten sind zeigt Google's Cloud Vision API. Hieran kann man erkennen, wie viel Informationen bereits aus Bildern ausgelesen werden können. Widersprechen sich Metadaten und erkannter Inhalt, kann dies negative Auswirkungen auf das Ranking der Bilder haben. Genauso wichtig ist eine passende Platzierung des Bildes im Fließtext.

Die Platzierung des Bildes im Fließtext

Google erkennt den Zusammenhang zwischen dem Inhalt des Bildes über die Tags und den umliegenden Fließtext. Deshalb sollten die Bilder oder Grafiken an den passenden Stellen im Fließtext untergebracht werden. Denn hier kommt im Optimalfall auch das Keyword im Text vor. So wird der sachliche Bezug zwischen Text und Bild auch für den Google Crawler verdeutlicht. Dabei gibt es natürlich die aktuellen Best Practices für die Content-Erstellung zu beachten. Steht das Bild oder die Grafik nah an einer Überschrift, wird der Bezug nochmals gestärkt. Zudem wird durch eine passende Platzierung der Text aufgewertet. Der Nutzer erhält an passender Stelle eine visuelle Darstellung der Inhalte des Textes bzw. des Absatzes.

Bedeutung der EXIF-Daten eines Fotos/Bildes

Bei den EXIF-Daten handelt es sich um Metadaten, die automatisch in der Kamera erstellt werden. Sie beinhalten beispielsweise Informationen zum Kameramodell oder den Kameraeinstellungen. Außerdem können Daten wie GPS-Position oder Datumsinformationen enthalten sein. Wichtiger sind jedoch Informationen zu Copyright und Urheber. Diese können mit einer geeigneten Software hinzugefügt werden. Die Rolle dieser Daten in der Bildoptimierung im SEO ist allerdings sehr gering, wie dieses Video von Matt Cutts zeigt.

Video: Matt Cutts berichtet über EXIF-Daten

EXIF Daten werden von Google zwar ausgelesen, jedoch nicht mehr in den Suchergebnissen angezeigt. Zudem ist nicht genau bekannt, ob diese Daten eine Relevanz für das Ranking haben. EXIF Daten sollten nicht gelöscht werden, wenn sie einmal vorhanden sind. Es ist jedoch kein Nachteil, wenn sie nicht angegeben sind. Der Einsatz zusätzlicher EXIF-Daten ist also eher ein Hilfsmittel, um die Herkunft und den originalen Ersteller eines Bildes ausfindig zu machen. Dies kann sich bei selbst erstellten Bildern und Grafiken auszahlen.

Traffic-Quelle Bildersuche

Die Funktionsweise der Bildersuche von Google ist sehr ähnlich der normale Websuche. Bei Bildern werden die Informationen aus den genannten Tags extrahiert. Das Ranking der Bildersuche setzt sich aus diesen Informationen sowie der Relevanz der Webseite zusammen. Über die Optimierung nach den genannten Kriterien werden die Chancen erhöht in der Google Bildersuche zu erscheinen und diese als Traffic-Quelle zu nutzen.

BildSEO4

Abbildung 2: Beispiel in der Bildersuche von Google

Die neusten Änderungen der Google Bildersuche zur Unterstützung des Urheberrechts verstärken diesen Effekt. So ist es nicht mehr möglich, per Lizenz geschützte Bilder ohne weiteres herunterzuladen. Ein User/Designer muss nun die originale Webseite eines Bildes besuchen. Werden beispielsweise kommerzielle Fotos auf der Webseite angeboten, kann dies eine große Hilfe sein, Besucherzahlen zu erhöhen. Auch für Online Shops kann die Bildersuche eine wichtige Traffic Quelle darstellen. Besonders in der Universal Search ist OneBox für Bilder sehr wichtig. Werden die eigenen Bilder in dieser angezeigt, kann der Traffic über die eigentliche Bildersuche hinaus gestärkt werden. Voraussetzung hierfür sind konsequent optimierte und passend platzierte Bilder auf der eigenen Website.

Außerdem leisten technisch optimierte Bilder einen Beitrag zur Performance und User Experience. Ladezeiten werden optimiert sowie verbessert. Ansprechende Bilder und Grafiken unterstützen Verkaufsargumente und generell Aussagen in Fließtexten. Für eine optisch ansprechende Webseite sind passende und gute Bilder unerlässlich.

Was die Zukunft bereithält

Das größte Buzzword im Zusammenhang mit der Bildoptimierung im SEO ist Visual Search. Eine Bildersuche auf Basis der Bildinformationen und nicht mehr auf textbasierten Informationen. Das Projekt Google Lens auf Android Smartphones gibt einen Vorgeschmack auf die Möglichkeiten der Visual Search. Auch die bereits erwähnte Cloud Vision API zeigt, was bereits in punkto visueller Suche mit Hilfe von Machine Learning möglich ist.

Zudem sind moderne Smartphones, Tablets und auch Desktop Computer mit hochauflösenden Displays ausgestattet. Auflösungen im Bereich von 4K sind mittlerweile Standard. Diese stellen neue Herausforderungen an die technische Bildoptimierung im SEO. Die Herausforderung liegt in der Größe der Dateien. Eine Retina-fähige Datei besitzt mindestens die doppelte und im Optimalfall die drei- bis vierfache Auflösung der eigentlichen Datei. Diese hohen Auflösungen resultieren in größeren Dateien.

Folglich wird mehr Speicherplatz benötigt und die Ladezeiten steigen. Es geht dabei nicht um Megabyte, sondern um einige 100 Kilobyte. Diese können einen großen Einfluss auf die Performance haben. Wieder gilt, die Bilddateien so groß wie nötig und so klein wie möglich bereitzustellen. Die Entwicklung der oben genannten Dateiformate FLIF und HEIF trägt dieser Entwicklung bereits Rechnung.

Fazit: Bildoptimierung im SEO darf nicht unterschätzt werden

Es zeigt sich das die Bildoptimierung im SEO ein wichtiger Bestandteil moderner Suchmaschinenoptimierung ist, inhaltlich über Tags und technisch über die Dateigröße und das Format. Neben der Bildersuche werden die Inhalte auch dafür genutzt, um die Textinhalte der umliegende Texte besser zu verstehen und zu interpretieren. Die Pflege der Alt Tags, Title Tags sowie die richtige Auflösung und damit verbundene Dateigröße sind sehr wichtig. Der Aufwand macht sich durch bessere Performance und steigenden Traffic bezahlt.

Auch wenn die neuesten Änderungen in der Google Bildersuche keine Vorteile für Webmaster und den Traffic aus der Bildersuche bringen, sollten die Bildoptimierung nicht vernachlässigt werden. Es werden zwar mehr Klicks benötigt, um von der Bildersuche auf eine bestimmte Website zu gelangen. Dafür ist dieser Traffic relevanter, da sich die User mit hoher Wahrscheinlichkeit schon tiefer im Conversion Funnel befinden und somit gezielter informieren wollen.

Sind Deine Bilder richtig optimiert? Entdecke es mit Ryte!

Veröffentlicht am Jun 11, 2018 von Florian Kolbe