Bilder-SEO: Alt-Texte, Dateigroesse und Formate richtig einsetzen

Bilder machen den groessten Teil des Datenvolumens auf den meisten Webseiten aus. Genau deshalb entscheiden sie oft darueber, ob eine Seite schnell laedt oder zaeh wirkt - und ob Google sie als hochwertig einstuft. Die gute Nachricht: Bilder-SEO besteht aus wenigen klaren Regeln, die du einmal verstehst und dann konsequent anwendest. Wir bauen Webseiten zum Festpreis und betreiben sieben eigene Marken in Produktion - die folgenden Punkte sind das, worauf wir bei jedem Projekt selbst achten.

Warum Bilder-SEO mehr ist als nur huebsche Fotos

Bei der Bildoptimierung greifen drei Dinge ineinander: Ladezeit, Zugaenglichkeit und Auffindbarkeit. Schnelle Bilder verbessern deine Core Web Vitals, vor allem den LCP-Wert (das groesste sichtbare Element, oft ein Bild). Gute Alt-Texte helfen Screenreadern und damit Menschen, die nicht sehen koennen - und ganz nebenbei der Google-Bildersuche. Sinnvolle Dateinamen und Formate runden das ab. Du optimierst also nie nur fuer die Suchmaschine, sondern immer auch fuer echte Nutzer. Das ist der ehrliche Kern: Wenn die Seite fuer Menschen besser wird, folgt das Ranking meist von selbst.

Alt-Texte: kurz, konkret, beschreibend

Der Alt-Text (Alternativtext) beschreibt, was auf einem Bild zu sehen ist. Er wird vorgelesen, wenn jemand einen Screenreader nutzt, und angezeigt, wenn das Bild nicht laedt. Schreibe ihn so, als wuerdest du das Bild kurz jemandem am Telefon erklaeren.

• Beschreibe den Inhalt, nicht das Offensichtliche: Nicht Bild oder Foto von, sondern direkt das Motiv.
• Halte es kurz: Ein knapper Satz reicht meist. Romane braucht niemand.
• Keyword-Stuffing vermeiden: Ein passendes Suchwort ist gut, wenn es natuerlich zum Bild gehoert. Eine Aneinanderreihung von Begriffen schadet.
• Rein dekorative Bilder bekommen einen leeren Alt-Text (alt=""). Damit ueberspringt der Screenreader sie - genau richtig bei Trennlinien, Mustern oder Schmuckgrafiken.

Ein Beispiel: Statt foto1 oder schoenes-bild-seo-marketing-agentur schreibst du etwas wie: Handwerker prueft eine Solaranlage auf einem Hausdach. Das ist ehrlich, hilfreich und ganz nebenbei suchmaschinenfreundlich.

Dateigroesse: das groesste Sparpotenzial

Die meisten Seiten verschicken Bilder, die viel zu gross sind - oft mehrere Megabyte fuer ein Foto, das am Bildschirm nur wenige hundert Pixel breit erscheint. Hier liegt der groesste Hebel fuer Tempo.

• Liefere die richtige Aufloesung aus: Ein Bild, das maximal 800 Pixel breit dargestellt wird, muss nicht in 4000 Pixel hochgeladen werden. Skaliere vor dem Upload herunter.
• Komprimiere bewusst: Eine Qualitaetsstufe von etwa 75 bis 85 Prozent ist fuer Fotos kaum vom Original zu unterscheiden, spart aber massiv Daten.
• Zielwerte als Faustregel: Inhaltsbilder unter ~150 KB, grosse Hero-Bilder moeglichst unter ~300 KB. Das sind Richtwerte, keine Dogmen - aber sie helfen beim Augenmass.
• Nutze responsive Bilder: Mit dem srcset-Attribut laedt das Smartphone eine kleinere Datei als der Desktop. So bekommt jedes Geraet nur, was es wirklich braucht.

Das richtige Format waehlen

Das Format entscheidet ueber das Verhaeltnis von Qualitaet zu Dateigroesse. Eine einfache Orientierung:

• WebP: Heute die Standardwahl fuer fast alle Fotos und Grafiken. Deutlich kleiner als JPG bei gleicher Qualitaet und von allen aktuellen Browsern unterstuetzt.
• AVIF: Noch einmal kleiner als WebP, aber etwas langsamer zu erzeugen. Sinnvoll, wenn du das letzte Quaentchen Tempo willst und einen Fallback bereitstellst.
• JPG: Solider Klassiker fuer Fotos, wenn WebP aus irgendeinem Grund nicht passt.
• PNG: Nur fuer Bilder, die eine transparente Flaeche oder scharfe Kanten brauchen (Logos, Screenshots). Fuer Fotos ist PNG fast immer zu gross.
• SVG: Die beste Wahl fuer Logos, Icons und einfache Grafiken. Vektorbasiert, also bei jeder Groesse gestochen scharf und winzig in der Dateigroesse.

Technische Details, die oft vergessen werden

• Sprechende Dateinamen: solaranlage-dachmontage.webp sagt mehr als IMG_4821.webp - auch fuer Google.
• Lazy Loading: Mit loading="lazy" laedt der Browser Bilder erst, wenn sie in den Blick kommen. Das Hero-Bild ganz oben sollte allerdings nicht lazy geladen werden, sonst leidet der LCP.
• Feste Bildmasse: Gib Breite und Hoehe an, damit das Layout beim Laden nicht springt. Das verbessert den CLS-Wert spuerbar.
• Bilder-Sitemap: Bei sehr bildlastigen Seiten kann sie der Bildersuche helfen - bei kleineren Seiten ist sie meist nicht noetig.

Was du wirklich brauchst - und was nicht

Ehrlich gesagt: Du musst nicht jedes Bild von Hand optimieren. Ein guter CMS- oder Build-Prozess erledigt Skalierung, Komprimierung und Formatwahl automatisch - dann bleibt fuer dich nur der Alt-Text als manuelle Aufgabe. Wenn deine Seite heute mit riesigen Bildern kaempft, ist das fast immer der lohnendste erste Schritt fuer bessere Ladezeiten und ein stabileres Ranking. AVIF, Bilder-Sitemaps oder ausgefeilte srcset-Setups sind sinnvolle Kuer, aber kein Muss fuer den Start. Fang mit Groesse und Format an - der Rest ergibt sich.