Design lebt von Bildern, aber unoptimierte Bilder sind der häufigste Grund für langsame Seiten. Ein einziges zu grosses Foto kann mehr wiegen als der gesamte restliche Seiteninhalt. Die gute Nachricht: Bildoptimierung ist einer der wirksamsten und am schnellsten umsetzbaren Performance-Hebel.
Das richtige Format wählen
Moderne Formate wie WebP und AVIF liefern die gleiche Bildqualität bei deutlich geringerer Dateigrösse als klassisches JPEG oder PNG. Der Umstieg allein kann die Bildlast halbieren, ohne dass ein Nutzer einen Unterschied sieht. Für Logos und Grafiken bleibt SVG die beste Wahl, weil es verlustfrei skaliert.
Nur laden, was gebraucht wird
- Lazy Loading: Bilder erst laden, wenn sie in den Sichtbereich kommen
- Responsive Bilder: je nach Bildschirmgrösse die passende Auflösung ausliefern
- Richtige Dimensionen: kein 4000-Pixel-Foto in einem 400-Pixel-Container
- Komprimierung: Qualität so weit senken, wie das Auge es nicht bemerkt
Die meisten Ladezeitprobleme sind keine Serverprobleme, sondern Bildprobleme. Hier liegt das schnellste Ergebnis.
Das erste Bild ist heilig
Das grosse Bild im sichtbaren Bereich — oft das Hero-Bild — bestimmt, wann die Seite gefühlt fertig geladen ist. Diese Kennzahl fliesst direkt in die Core Web Vitals und damit ins Ranking ein. Genau dieses Bild sollte nicht per Lazy Loading verzögert, sondern priorisiert geladen werden, während alle Bilder darunter warten dürfen.
Warum sich das direkt auszahlt
Schnellere Seiten ranken besser und konvertieren besser. Studien zeigen seit Jahren denselben Zusammenhang: Jede zusätzliche Ladesekunde kostet Besucher und Umsatz. Bildoptimierung wirkt auf beide Seiten gleichzeitig — sie verbessert die Sichtbarkeit bei Google und senkt die Absprungrate der Besucher, die bereits da sind.
Einmal einrichten, dauerhaft profitieren
Der grösste Fehler ist, Bildoptimierung als einmalige Aktion zu sehen. Besser ist ein Prozess, der jedes hochgeladene Bild automatisch konvertiert, komprimiert und in mehreren Grössen bereitstellt. Dann bleibt die Seite schnell, auch wenn später Dutzende neue Bilder dazukommen — ohne dass jemand daran denken muss.
Den passenden Ausschnitt liefern
Ein Bild, das auf dem Desktop wirkt, ist auf dem Smartphone oft zu gross und schlecht komponiert. Responsive Bilder liefern nicht nur die passende Dateigrösse, sondern können je nach Gerät einen anderen Ausschnitt zeigen — der zentrale Bildinhalt bleibt sichtbar, statt am Rand abgeschnitten zu werden. Diese Feinarbeit verbindet Performance mit Gestaltung und sorgt dafür, dass jedes Bild auf jedem Bildschirm schnell lädt und gut aussieht.
Automatisierung im Build
Bildoptimierung von Hand hält niemand dauerhaft durch. Moderne Bild-Pipelines übernehmen Konvertierung, Komprimierung und das Erzeugen mehrerer Grössen automatisch beim Veröffentlichen. Der Redakteur lädt ein grosses Original hoch, das System liefert die optimierten Varianten aus. So bleibt die Seite dauerhaft schnell, auch wenn über Jahre hunderte Bilder dazukommen — ohne dass jemand an Formate oder Kompression denken muss.
Schnelligkeit ist kein Luxus, sondern die Grundlage jeder guten Website. Und sie beginnt bei den Bildern.