Inhalte und OnpageRatgeber

Bilder für die Suche optimieren

Damit Google ein Bild findet und versteht, muss es als img-Element im HTML stehen, einen kurzen sprechenden Dateinamen und einen beschreibenden Alt-Text haben und nah an passendem Text stehen. Für die Ladezeit helfen moderne Formate, responsive Bildgrößen, feste Breiten- und Höhenangaben und Lazy Loading für Bilder außerhalb des ersten sichtbaren Bereichs.

Ein Leuchttisch mit mehreren ausgelegten Fotoabzügen und einer kleinen Fotolupe darauf, weiches gestreutes Licht
Bild: KI-generiert

Bilder erscheinen in der Google Suche an mehreren Stellen: neben normalen Treffern, in Discover und in der Bildersuche. Google schreibt, dass für all diese Stellen dieselben Empfehlungen gelten [1]. Viele der Punkte helfen auch Menschen, die einen Screenreader nutzen oder eine langsame Verbindung haben.

Bilder so einbinden, dass Google sie findet

Google findet Bilder über das src-Attribut des img-Elements, auch wenn dieses in einem picture-Element steckt. Bilder, die nur als CSS-Hintergrund eingebunden sind, indexiert Google nicht [1]. Ein Produktfoto oder eine Grafik, die in der Suche erscheinen soll, gehört deshalb immer in ein img-Element. Reine Gestaltungselemente wie Hintergrundmuster dürfen im CSS bleiben.

Google unterstützt die Formate BMP, GIF, JPEG, PNG, WebP, SVG und AVIF. Die Dateiendung sollte zum tatsächlichen Dateityp passen [1]. Bilder lassen sich auch als Data-URI direkt in den Quelltext schreiben, Google rät aber zur Sparsamkeit, weil das die Seite stark vergrößern kann [1].

Ein sprechender Dateiname

Der Dateiname gibt Google einen kleinen Hinweis auf den Inhalt. Google empfiehlt kurze, aussagekräftige Namen wie my-new-black-kitten.jpg statt IMG00023.JPG und rät von allgemeinen Namen wie image1.jpg ab [1]. Wird eine Website in mehrere Sprachen übersetzt, sollten auch die Dateinamen übersetzt werden [1].

Für deutsche Seiten heißt das zum Beispiel sauerteigbrot-angeschnitten.jpg statt DSC_4711.jpg. Umlaute ersetzt du dabei am einfachsten durch ae, oe und ue, denn in Adressen müssen Zeichen wie ü sonst prozentcodiert werden [8]. Bindestriche trennen die Wörter, wie bei Seitenadressen [8].

Der Alt-Text

Mit dem Alt-Text beschreibst du ein Bild in Worten. Google nennt als Ziel einen nützlichen, informativen Text, der passende Begriffe im Zusammenhang mit dem Seiteninhalt verwendet. Eine Aneinanderreihung von Keywords wirkt dagegen wie Spam [1]. Google zeigt das an einem Beispiel mit einem Hundefoto:

Alt-TextEinschätzung laut Google
kein alt-Attributschlecht, Information fehlt
eine lange Liste von Hundebegriffenschlecht, Keyword-Stuffing
Welpebesser
Dalmatiner Welpe apportierenam besten

Der Alt-Text hat noch eine zweite Aufgabe. Ist ein Bild verlinkt, verwendet Google den Alt-Text als Linktext [9]. Bei Bildlinks auf andere Seiten sollte er also auch das Ziel beschreiben. Wie Linktexte allgemein aussehen sollten, steht unter Interne Verlinkung planen.

Nicht jedes Bild braucht einen beschreibenden Text. Die Barrierefreiheitsinitiative des W3C empfiehlt für rein dekorative Bilder ein leeres alt-Attribut, also alt="", damit Screenreader sie überspringen [5]. Fehlt das Attribut ganz, lesen manche Screenreader den Dateinamen vor [5]. Ob ein Bild Information trägt oder nur schmückt, kann laut W3C nur der Autor entscheiden [5]. Für SVG-Grafiken, die direkt im HTML stehen, kann laut Google das title-Element innerhalb der Grafik die Rolle des Alt-Texts übernehmen [1]. Welche Pflichten das Barrierefreiheitsstärkungsgesetz für Websites mit sich bringt, erklärt Barrierefreie Website: Pflichten nach dem BFSG.

Text rund um das Bild

Google versteht ein Bild auch über seine Umgebung. Bilder sollten nah an relevantem Text und auf thematisch passenden Seiten stehen, und Google zieht Bildbeschriftungen und Bildtitel aus dem Seiteninhalt heran, um den Gegenstand des Bildes zu verstehen [1]. Der Startleitfaden rät zu scharfen, hochwertigen Bildern in der Nähe des passenden Textes [7]. Ein Foto eines Sauerteigbrots unter einer Überschrift zum Ansetzen des Teigs hat damit mehr Zusammenhang als dasselbe Foto in einer Sammelgalerie ohne Text.

Welches Bild Google als Vorschau für eine Seite verwendet, kannst du beeinflussen, etwa über og:image oder die Eigenschaft primaryImageOfPage. Google empfiehlt dafür ein Bild, das zur Seite passt, kein allgemeines Logo, kein Bild mit Text, kein extremes Seitenverhältnis und eine möglichst hohe Auflösung [1].

Auch strukturierte Daten können ein Bild in der Suche hervorheben. Mit strukturierten Daten kann Google Bilder in bestimmten Rich-Suchergebnissen zeigen, und laut Google ist das Bildattribut bei jedem dieser Datentypen ein Pflichtfeld [1]. Wie du solche Daten einbaust, erklärt Strukturierte Daten mit Schema.org.

Große Vorschaubilder für Discover

Discover ist ein Teil der Google Suche, in dem Nutzern Inhalte passend zu ihren Interessen angezeigt werden [10]. Für die Bilder dort nennt Google konkrete Werte: Das Bild sollte mindestens 1.200 Pixel breit sein und insgesamt mehr als 300.000 Pixel haben, 1.280 mal 720 Pixel erfüllen das [10]. Empfohlen ist ein Seitenverhältnis von 16:9. Wer selbst zuschneidet, sollte die wichtigen Bilddetails erhalten und das zugeschnittene Bild im og:image-Tag angeben [10].

Große Vorschaubilder erlaubst du Google über die Einstellung max-image-preview:large im robots-Meta-Tag oder über AMP [10]. Wie bei der Vorschau in der normalen Suche rät Google auch hier von allgemeinen Bildern wie dem Websitelogo und von Bildern mit viel Text ab [10].

Größe, Format und Ladezeit

Seit Google für Indexierung und Ranking die mobile Version einer Seite verwendet, zählt auch für Bilder, was auf dem Smartphone ankommt. Mobile Bilder sollten denselben Alt-Text tragen wie auf dem Desktop und möglichst dieselben Bildadressen verwenden [11]. Bei responsiven Websites ist das automatisch so, bei getrennten mobilen Seiten lohnt eine Prüfung.

Bilder machen laut Google oft den größten Teil der Datenmenge einer Seite aus. Google empfiehlt deshalb aktuelle Techniken zur Bildoptimierung, responsive Bilder und einen Test mit PageSpeed Insights [1]. Mit den Attributen srcset und sizes oder mit dem picture-Element bietest du verschiedene Bildgrößen an, aus denen der Browser die passende wählt. Weil einige Browser und Crawler diese Attribute nicht verstehen, sollte immer ein src-Attribut als Rückfallebene vorhanden sein [1].

Breite und Höhe gehören als Attribute an jedes img-Element, alternativ reservierst du den Platz per CSS mit aspect-ratio. Fehlen sie, kann der Browser keinen Platz reservieren, bevor das Bild geladen ist, und der Text springt nach unten, sobald es erscheint [4]. Diese Verschiebungen misst der Wert CLS, einer der Core Web Vitals. Mehr dazu unter Core Web Vitals: LCP, INP und CLS verbessern.

Lazy Loading lädt Bilder erst, wenn sie in die Nähe des sichtbaren Bereichs kommen. Das Attribut loading="lazy" wird von allen großen Browsern unterstützt [3]. Bilder, die beim Öffnen der Seite schon sichtbar sind, vor allem das größte Bild im ersten Bildschirm, sollten nicht verzögert geladen werden [3]. Google weist außerdem darauf hin, dass Inhalte nicht erst durch Scrollen oder Klicken geladen werden dürfen, weil Google nicht mit der Seite interagiert. Ob alle Bilder ankommen, prüfst du mit dem URL-Prüftool der Search Console [2].

Liegen die Bilder auf einem Content Delivery Network, verkürzt das die Wege zum Nutzer. Was ein CDN für die Ladezeit bringt, beschreibt Was ein CDN für Ladezeit und Core Web Vitals bringt.

Bild-Sitemap

Mit einer Bild-Sitemap teilst du Google Bilder mit, die es sonst vielleicht nicht findet, etwa solche, die per JavaScript geladen werden [6]. Du kannst eine eigene Bild-Sitemap anlegen oder die Bildangaben in deine bestehende Sitemap schreiben, beides ist laut Google in Ordnung [6]. Jeder Seiteneintrag darf bis zu 1.000 Bilder enthalten. Die Bildadresse darf auf einer anderen Domain liegen, etwa bei einem CDN, wenn beide Domains in der Search Console bestätigt sind und die robots.txt die Bilder nicht sperrt [6].

Die früheren Zusatzangaben für Bildunterschrift, Titel, Ort und Lizenz hat Google aus seiner Dokumentation entfernt [6]. Nötig sind nur noch image:image und image:loc. Wie du die Sitemap selbst anlegst, erklärt XML-Sitemap erstellen und einreichen.

Bilder aus der Suche heraushalten

Manchmal soll ein Bild nicht in der Bildersuche erscheinen, etwa ein Entwurf oder ein Foto, das nur für Kunden gedacht ist. Google beschreibt dafür zwei Wege. Du kannst verhindern, dass das Bild überhaupt in den Suchergebnissen angezeigt wird [1]. Oder du schaltest nur die direkte Einbindung ab: Der Server prüft den HTTP-Referrer und antwortet auf Anfragen von einer Google-Domain mit dem Status 200 oder 204 ohne Inhalt. Google sieht das Bild dann beim Crawling weiterhin, zeigt in den Ergebnissen aber nur das Miniaturbild, das es beim Crawling erstellt hat [1]. Google stuft diese Methode ausdrücklich nicht als Cloaking ein [1]. Die Regeln für den Server schreibst du zum Beispiel in die .htaccess, siehe Die .htaccess-Datei: Weiterleitungen und Regeln.

Bildrechte

Für jedes Bild, das du veröffentlichst, brauchst du die Rechte, und bei Fotos von Personen spielt auch deren Einwilligung eine Rolle. Diese Fragen gehören nicht zur Suchmaschinenoptimierung, betreffen aber jede Website. Die Schwesterseite behandelt sie unter Content Marketing und Recht: Bilder, Zitate, Werbung. Die übrigen Elemente einer Seite fasst Onpage-Optimierung: die Pflichtelemente zusammen.

  1. Organisation Best Practices für Bilder in der Google Suche. Google Search Central. Stand 04.03.2026. abgerufen am 29.10.2026
  2. Organisation Probleme mit Lazy-Load-Inhalten beheben. Google Search Central. Stand 18.12.2025. abgerufen am 29.10.2026
  3. Organisation Browser-level image lazy loading for the web (Addy Osmani, Houssein Djirdeh, Mathias Bynens, Barry Pollard). web.dev, Google. Stand 13.08.2024. abgerufen am 29.10.2026
  4. Organisation Optimize Cumulative Layout Shift (Addy Osmani, Barry Pollard). web.dev, Google. Stand 07.02.2025. abgerufen am 29.10.2026
  5. Organisation Decorative Images (Images Tutorial). W3C Web Accessibility Initiative. Stand 27.07.2019. abgerufen am 29.10.2026
  6. Organisation Bild-Sitemaps. Google Search Central. Stand 20.02.2026. abgerufen am 29.10.2026
  7. Organisation Startleitfaden zur Suchmaschinenoptimierung (SEO). Google Search Central. Stand 18.12.2025. abgerufen am 29.10.2026
  8. Organisation Best Practices für die URL-Struktur für die Google Suche. Google Search Central. Stand 26.10.2026. abgerufen am 29.10.2026
  9. Organisation Best Practices für Links. Google Search Central. Stand 31.12.2025. abgerufen am 29.10.2026
  10. Organisation Discover und deine Website. Google Search Central. Stand 11.03.2026. abgerufen am 29.10.2026
  11. Organisation Best Practices für die Mobile-First-Indexierung. Google Search Central. Stand 20.02.2026. abgerufen am 29.10.2026

Zuletzt geprüft am 29.10.2026, nächste Prüfung spätestens im Oktober 2027. Fehler entdeckt? Schreib uns.