Bilder SEO 2021

Bilder SEO hört sich erstmal komisch an oder? Allerdings sollte man die Bedeutung von Bilder bei der Suchmaschinenoptimierung (SEO) nicht unterschätzen! Mittlerweile ist Bilder SEO nicht mehr ganz unbekannt, dennoch sind mir in meinem SEO-Leben eigentlich fast alle Projekte mit unzureichend oder gar nicht optimierten Bildern begegnet.

Bildelemente für Bilder SEO

An einem Bild kann man nicht sonderlich viel machen, das ist klar. Dennoch gibt es wichtige Stellschrauben, die man stellen sollte, bevor man Bilder in den Content implementiert.

Dateiname von Bildern

Das erste ist schon mal der Dateiname von Bildern. Dieser sollte bereits grob (!) beschreibend sein und das Fokuskeyword des Bildes bzw. der Seite, auf der das Bild eingebunden wird beinhalten. Ein guter Dateiname für diese Seite wäre zum Beispiel: bilder-seo-checkliste.jpg

In diesem Dateiname ist das Fokuskeyword „Bilder SEO“ enthalten und die Beschreibung des Bildes, in dem Fall eine Checkliste. Wichtig ist auch, dass die Wörter in einem Dateinamen mit Bindestrichen und nicht mit Unterstrichen getrennt werden. Das gilt übrigens für alle URLs. Trennt immer mit Bindestrichen, bei allen URLs und Dateien!

Katastrophale und gefühlt zu 99,8 Prozent verwendete Dateinamen sind zum Beispiel: fotodatenbankname-2358964725825_1000x680px_resized.JPG

Da muss man wohl nicht mehr viel dazu sagen. Keinerlei Hinweis auf den tatsächlichen Inhalt des Bildes. Zudem entlarvt man sich sofort als Stockfotoverwender. Die Größe wird gerne von Systemen wie WordPress beim Upload hinzugefügt, das ist aber nicht weiter tragisch.

Die richtige Bildgröße

Ganz wichtig ist die richtige Bildgröße, vor allem für die Ladezeit. Wenn eure Seite eine maximale Breite an einem Destkop-PC von 800 Pixel hat, muss euer Bild keine Breite von 5.800 Pixel haben!

Verkleinert eure Bilder lokal (!) auf die Größe, die ihr tatsächlich braucht. Dafür reicht Paint. Die Dateigröße des Bildes reduziert sich drastisch, eure Ladezeit wird’s euch danken.

Wenn ihr eine Zoomfunktion oder eine Lightbox auf eurer Website einsetzt, dann könnt ihr das Bild freilich größer hochladen. Hier gibt es zwei Möglichkeiten:

• Das Bild so groß hochladen, wie es maximal geöffnet wird. Das ist meist nicht extrem viel Größer als auf der Website.
• Das Bild einmal in Websitegröße hochladen und ein weiteres Mal in der Zoomgröße. Das Websitebild verlinkt ihr dann zum Zoombild. Vorteil: Das Zoombild wird erst geladen, wenn es angeklickt wird.

Diese Regel für Bilder SEO gilt übrigens nicht nur für Fotos sondern für alle Grafiken, die ihr verwendet. Logos in eurem Header, das in 200 × 100 Pixel dargestellt wird, reicht in dieser Größe. Das braucht kein Mensch größer.

Richtiger Bilddateityp

Zur richtigen Optimierung für Bilder SEO und die richtige Größe müsst ihr wissen, wann ihr JPG oder PNG verwenden müsst. JPG oder PNG ist eine leidige Frage, aber ist eigentlich relativ einfach zu beantworten:

• JPG wird immer dann verwendet, wenn es sich um Fotos oder fotoähnliche Grafiken handelt. Das heißt: Keine Transparenz, viele Farben und viele Farbverläufe.
• PNG wird für nicht-fotoähnliche Grafiken verwendet. Das heißt: Wenig Farben, klare Strukturen wie bei Logos, Infografiken, Icons, Screenshots etc. PNG kann zudem Transparenzen darstellen, was JPG nicht kann.

Ändert an eurem PC mal ein JPG-Bild in ein PNG und schaut mal, wie sich die Größe ändert. Wie das geht? Einfach das datei.jpg in datei.png ändern. Wie ihr das einstellt, habe ich im Beitrag Dateiendungen anzeigen Windows erklärt.

Bilder komprimieren

Neben der Größe spielt auch die Komprimierung der Bilder eine wichtige Rolle für Bilder SEO.

Komprimieren heißt, dass die Bilddateien auf eine Größe komprimiert werden, dass mit dem bloßen Auge kein qualitativer Unterschied zum Original festzustellen ist. Die Erfahrung zeigt, dass mit dieser Methode bis zu 90 Prozent – war auch schon mehr 😉 – Dateigröße gespart werden können. Die Maße (Breite × Höhe) bleiben davon unberührt.

Im Internet gibt es zahlreiche kostenlose Tools, mit denen die Bilder komprimiert werden können. Einfach hochladen, komprimieren und wieder runterladen. Dauert wenige Sekunden. In WordPress gibt es ebenfalls Komprimierungsplugins, ich halte aber von der Vor-Upload-Methode mehr, da es nicht deutlich länger geht und definitiv effektiver ist.

HTML-Elemente für Bilder SEO

Jetzt habt ihr lokal eure Bilder schon mal perfekt angepasst und das optimierte und komprimierte Bild auf euren Server geladen. Doch auch beim Einbinden gilt es noch einige Punkte zu beachten.

Grundsätzlich wird ein Bild per HTML-Code in eine Seite eingebunden. Auch wenn ihr mit einem WYSIWYG-Editor arbeitet, ist alles HTML-Code. Bei WordPress kann man oben rechts beim Verfassen von „Visuell“ auf „Text“ wechseln und sieht einen vereinfachten HTML-Code.

Ein Bild könnt ihr per HTML ganz einfach einbinden. Der HTML-Code sieht dann so aus:

<img src="https://www.domain.de/bild.jpg" />

img ist der Hinweis auf ein Bild, src steht für Source, also die Quelle, wo das Bild zu finden ist. Natürlich könnt ihr zu diesem HTML-Code noch diverse andere Elemente hinzufügen wie zum Beispiel eine Verlinkung oder einen Rahmen. Zwei ganz wichtige Elemente sind jedoch unbedingt hinzuzufügen. Der alt-Tag und der title-Tag.

alt-Tag

alt steht für Alternativ. Dieser Tag wird verwendet, wenn Bilder nicht geladen werden können. Früher kam das häufiger vor, dass man Bilder mit so einem kleinen zerrissenen Dokument oben links und einem Text gesehen hat. Dieser angezeigte Text ist der alt-Tag. Der alt-Tag ist für den normalen Nutzer auf der Website nicht sichtbar, wenn das Bild vernünftig geladen wird.

Der HTML-Code mit dem alt-Tag sieht folgendermaßen aus:

<img src="https://www.domain.de/bild.jpg" alt="alternativer Text" />

Die bekannten CMS und Shopsysteme lassen es über das Backend zu, den alt-Tag bereits bei der Bildimplementierung zu pflegen. WordPress hat dazu Textfelder zur Verfügung gestellt.

Der alt-Tag beinhaltet eine kurze Beschreibung des Bildes und in der Regel keine grammatikalischen perfekten Sätze mit Punkt und Komma. Es macht Sinn, das Bild grob zu beschreiben und das Fokuskeyword des Bildes und der Seite, auf der das Bild eingebunden werden soll, einzubinden.

Packt den alt-Tag keinesfalls nur mit Keywords voll. Das könnte als Keywordstuffing gewertet werden und von Google negativ bewertet werden.

Des Weiteren dient der alt-Tag, wie bereits erwähnt, als Platzhalter, sollte das Bild einmal nicht laden, sowie als Hilfe für sehbehinderte Menschen. Screenreader, die Seiteninhalte vorlesen, können den alt-Tag auslesen und dem Nutzer somit den groben Inhalt des Bildes wiedergeben. Barrierefreiheit wird von Google belohnt.

title-Tag

Der title-Tag ist neben dem alt-Tag das zweite HTML-Element für Bilder SEO. Den title-Tag kann auch der Nutzer sehen: Er wird angezeigt, wenn man mit der Maus über ein Bild fährt. Nach wenigen Augenblicken erscheint ein kleines Fenster neben dem Mauszeiger mit dem title-Tag. Der HTML-Code wird dadurch erweitert:

<img src="https://www.domain.de/bild.jpg" alt="alternativer Text" title="title-Tag des Bildes" />

Der title-Tag eines Bildes kann mit dem Meta-Title der Website verglichen werden, denn er ist später in der Suchmaschine der Titel der Bildseite innerhalb der Bildersuche. Daher ist es sehr wichtig, dass der title-Tag einzigartig für jedes Bild ist!

Der title-Tag wird meistens deutlich ausführlicher gestaltet und auch in einer vernünftigen, grammatikalisch korrekten Sprache verfasst. Eine Längenbeschränkung gibt es nicht, allerdings macht es Sinn, die Kernelemente am Anfang des title-Tags unterzubringen, sollte er doch mal abgeschnitten werden. Auch hier sollte man auf Keywordstuffing verzichten (siehe alt-Tag).

Bedeutung alt- und title-Tag für Bilder SEO

Sowohl der alt- als auch der title-Tag sind sehr wichtig für Bilder SEO! Die Pflege beider Tags bzw. die Optimierung der bestehenden alt- und title-Tags sollte nicht vernachlässigt werden. Dies wird auch immer wieder von Google offiziell bestätigt.

Google kann Bilder noch nicht ohne schriftliche Hilfe auslesen und den Inhalt bestimmen. Bis es soweit ist, wird es sicher auch noch eine Weile gehen. Von daher sind alt- und title-Tag unverzichtbar. Denn Suchmaschinen analysieren die Inhalte anhand der alt- und title-Tags. Bilder SEO ist also genau das: Die Optimierung der schriftlichen Inhalte des Bildes und die sind nun mal die HTML-Tags alt und title.

Traffic über Google Bildersuche

Von vielen Websitebetreibern wird Bilder SEO komplett vernachlässigt und häufig auch nicht ernst genommen, selbst wenn SEO-Experten mit jahrelanger Erfahrung darauf hinweisen. Es ist natürlich auch Arbeit, wenn man in seinem Onlineshop ein paar hunderttausend Bilder bearbeiten muss – das ist nicht unbedingt übertrieben, habe ich schon gesehen!

Tatsächlich hatte ich Kunden, die über die Google Bildersuche einen nicht unwesentlichen Teil des Traffics erzielt haben. Vor allem in visuellen Bereichen wie zum Beispiel DIY, Garten oder Mode suchen viele Nutzer nicht mehr klassisch über die Google Suche, sondern wollen was anschauen. Nachvollziehbar.

Bilder SEO für Contentoptimierung

Neben dem Traffic, den man mit Bilder SEO erzielen kann, sind gut optimierte Bilder aber auch ein wichtiger Faktor bei der Content- bzw. Onpageoptimierung.

Wie schon ein paar mal in diesem Beitrag angesprochen, sollten die Bilder auch mit den Fokuskeywords der Website gespickt sein. Wenn man eine Seite für ein Keyword optimiert, sollten alle Bestandteile dieser Seite auch irgendwas mit dem Keyword zu tun haben.

Dabei ist wichtig, dass man auch hier mit Keywordstuffing aufpasst! Wenn man jedes noch so inhaltlich unbedeutende Bild mit Keywords vollklatscht, wird man damit keinen Erfolg haben. Bilder, Videos etc. die allerdings direkt was mit dem Inhalt und dem Thema zu tun haben, sollten hingegen auf jeden Fall das Keyword enthalten.

Fazit

Bilder SEO ist absolut notwendig und darf auf keinen Fall vernachlässigt werden. Gestandene Seiten, die seit Jahren gut ranken, müssen jetzt sicher nicht anfangen und ihre 298.000 alten Bilder mit alt- und title-Tag pflegen. Der Effekt könnte marginal sein. Neue Inhalte sollten jedoch bei alten wie neuen Websites ordentlich gepflegt werden.

Titelbild: Sarandy Westfall