Ein Foto direkt von der Kamera oder dem Smartphone hat oft mehrere Megabyte, auf der Website reicht meist ein Bruchteil davon. Diese Anleitung zeigt konkret, welches Format, welche Größe und welche Tools für Bilder auf einer Unternehmenswebsite sinnvoll sind.
Warum Bildoptimierung überhaupt einen Unterschied macht
Bilder machen auf den meisten Websites den größten Teil der Ladezeit aus. Ein einzelnes Foto mit 4 oder 5 Megabyte kann eine Seite stärker ausbremsen als sämtlicher restlicher Code zusammen. Genau daran hängt unter anderem der Largest Contentful Paint, einer der drei Core Web Vitals.
Was der Largest Contentful Paint genau misst, erkläre ich hier."Core Web Vitals einfach erklärt"
JPG, PNG oder WebP: der Unterschied
JPG
eignet sich für Fotos und Bilder mit vielen Farbverläufen, etwa Teamfotos oder Produktbilder. Das Format komprimiert verlustbehaftet, das heißt, ein Teil der Bildinformation geht beim Speichern verloren, bei moderater Komprimierung sieht man davon mit bloßem Auge nichts, die Dateigröße sinkt dafür deutlich.
PNG
eignet sich für Grafiken mit wenigen Farben, scharfen Kanten oder Text, etwa Logos oder Screenshots, und für Bilder, die einen transparenten Hintergrund brauchen. PNG komprimiert verlustfrei, dadurch bleiben Dateien bei Fotos aber deutlich größer als bei JPG.
WebP
ist das modernere Format und schlägt in fast jedem Fall beide Vorgänger: kleinere Dateigröße bei vergleichbarer Qualität, dazu Unterstützung für Transparenz wie bei PNG. Alle gängigen Browser der letzten Jahre unterstützen WebP problemlos, ein Umstieg lohnt sich für die meisten Websites direkt. AVIF geht als noch neueres Format teils noch weiter bei der Komprimierung, wird aber aktuell seltener eingesetzt als WebP. Für die praktische Umsetzung heißt das: Fotos und Teambilder als WebP speichern, Logos mit transparentem Hintergrund ebenfalls als WebP oder, falls nötig, als PNG.
Die richtige Größe wählen
Die Abmessungen eines Bildes richten sich nach der tatsächlichen Anzeigegröße auf der Website – die Auflösung der Kamera spielt dabei keine Rolle. Ein Hero-Bild, das über die volle Bildschirmbreite läuft, braucht selten mehr als 1920 Pixel Breite. Ein Bild innerhalb eines Textabschnitts oder in einer Galerie kommt meist mit 800 bis 1200 Pixeln Breite aus. Bei der Dateigröße gilt als grobe Orientierung: Inhaltsbilder unter 200 Kilobyte, große Hero-Bilder unter 500 Kilobyte. Wird dieser Rahmen deutlich überschritten, lohnt sich ein Blick auf Format und Komprimierung, bevor das Bild überhaupt online geht.
Bilder komprimieren: kostenlose Tools
Squoosh, ein kostenloses Tool von Google, läuft direkt im Browser und zeigt beim Komprimieren einen direkten Vorher-Nachher-Vergleich inklusive resultierender Dateigröße. Für einzelne Bilder und schnelle Umwandlung in WebP ist es der einfachste Einstieg. TinyPNG komprimiert JPG- und PNG-Dateien per Drag-and-drop im Browser, auch mehrere Bilder gleichzeitig. Der Name ist etwas irreführend, das Tool funktioniert für beide Formate gleich gut. ShortPixel bietet zusätzlich ein WordPress-Plugin, das Bilder direkt beim Hochladen in die Mediathek automatisch komprimiert und wahlweise in WebP umwandelt – praktisch, wenn Inhalte regelmäßig über WordPress gepflegt werden. Für Mac-Nutzer eignet sich ImageOptim als Desktop-Anwendung, die mehrere Bilder auf einmal per Drag-and-drop komprimiert, ohne dass dafür eine Website nötig ist.
Dateiname und Alt-Text
Ein aussagekräftiger Dateiname wie teamfoto-buero-hamburg.webp sagt Suchmaschinen mehr über den Bildinhalt als IMG_54321.jpg. Der Alt-Text, also die alternative Textbeschreibung eines Bildes, erfüllt einen ähnlichen Zweck und ist zusätzlich für Screenreader wichtig, die Bilder für sehbehinderte Besucher vorlesen.
Checkliste: Ist dein Bild optimiert?
FAQ
Welches Bildformat ist für eine Unternehmenswebsite am besten?
Für die meisten Fälle ist WebP die beste Wahl. JPG bleibt eine solide Alternative für reine Fotos, PNG ist nur bei Transparenz sinnvoll, wenn WebP aus irgendeinem Grund nicht infrage kommt.
Wie stark sollte ich ein Bild komprimieren?
Als Richtwert gelten unter 200 Kilobyte für normale Inhaltsbilder und unter 500 Kilobyte für große Hero-Bilder. Mit Tools wie Squoosh siehst du direkt, ab welchem Punkt die Qualität sichtbar leidet.
Muss ich jedes Bild manuell komprimieren?
Nicht zwingend. Bei WordPress übernimmt ein Plugin wie ShortPixel die Komprimierung automatisch beim Hochladen. Bei manuell gepflegten Websites bleibt der Weg über Squoosh oder TinyPNG der einfachste.
Wirkt sich Bildoptimierung wirklich aufs Google-Ranking aus?
Ja, indirekt über die Ladezeit. Bilder beeinflussen den Largest Contentful Paint, einen der Core Web Vitals, die seit 2021 offiziell in die Google-Bewertung einfließen.
Wie finde ich heraus, welche Bilder auf meiner Website zu groß sind?
Google PageSpeed Insights listet einzelne Bilder auf, die die Ladezeit ausbremsen. Für eine Website mit vielen Unterseiten lohnt sich ein umfassenderer Check, der alle Bilder auf einmal erfasst.
