Warum die Bildgröße wichtiger ist, als du denkst
Ich habe einmal die Portfolio-Website eines Freundes auditiert, die 11 Sekunden zum Laden brauchte. Der Übeltäter war nicht der Code oder das Hosting – es waren sechs unkomprimierte PNG-Screenshots mit insgesamt 24 MB. Nach ordnungsgemäßer Komprimierung lud dieselbe Seite in unter 2 Sekunden und sah identisch aus. Bilder sind fast immer die größten Bytes auf einer Seite, was Komprimierung zum Performance-Hebel mit der größten Wirkung für die meisten Website-Betreiber macht.
Der 3-Schritte-Komprimierungs-Workflow
1. Wähle zuerst das richtige Format. Die Formatwahl zählt mehr als jeder Qualitätsregler. Fotos sollten WebP oder AVIF sein. Grafiken mit flachen Farben und Text sollten PNG sein (oder SVG, wenn sie Vektor sind). Nutze niemals BMP oder TIFF im Web. Wenn du unsicher bist, konvertiere mit unserem JPG-zu-WebP-Konverter und vergleiche.
2. Skaliere, bevor du komprimierst. Ein 4000px-Foto, das mit 800px Breite angezeigt wird, trägt 25-mal mehr Pixel als nötig. Skaliere zuerst mit unserem Bild-Skalierer auf die Anzeigegröße – allein das schneidet oft 80 % der Dateigröße.
3. Stelle die Qualität mit unserem Kompressor ein. Lade das skalierte Bild in unseren Bild-Kompressor hoch, setze die Qualität auf 80 und vergleiche Vorher/Nachher. Für die meisten Fotos ist Qualität 75–85 visuell nicht von 100 zu unterscheiden, bei einem Bruchteil der Größe.
Wie tief kannst du gehen?
Hier meine praktische Faustregel aus der Komprimierung Tausender von Bildern:
- Hero-/Banner-Fotos: WebP mit Qualität 80 – scharf auf Retina-Displays, typischerweise 100–200 KB
- Blog-Inhaltsbilder: WebP mit Qualität 75 – etwa 50–100 KB pro Bild
- Thumbnails: WebP mit Qualität 70 – unter 30 KB
- Logos/Icons: SVG wenn möglich, sonst PNG – niemals JPEG dafür
Verlustbehaftet vs. verlustfrei: was wirklich passiert
Verlustbehaftete Komprimierung (JPEG, WebP mit Qualität <100) verwirft dauerhaft Bilddaten, die das menschliche Auge kaum bemerkt – subtile Farbverläufe werden vereinfacht. Verlustfreie (PNG, WebP mit 100) erhält jedes Pixel, erzeugt aber größere Dateien. Fürs Web gewinnt verlustbehaftet mit sinnvollen Qualitätseinstellungen jedes Mal. Der „Verlust“ ist unsichtbar; der Geschwindigkeitsgewinn ist in deiner Absprungrate sehr sichtbar.
Häufige Fragen
- Macht das Komprimieren meiner Bilder sie unscharf?
- Nicht, wenn du es richtig machst. Bei WebP-Qualität 80 sind Unterschiede zum Original für das menschliche Auge praktisch unsichtbar. Probleme treten erst unter Qualität 60 auf oder wenn du ein kleines Bild hochskalierst. Behalte deine Originale immer als Backup.
- Sollte ich PNG komprimieren oder lieber in WebP konvertieren?
- Konvertiere in WebP. Ein so weit wie möglich komprimiertes PNG ist bei gleicher visueller Qualität meist immer noch 2–3× größer als ein WebP. Der einzige Grund, PNG zu behalten, ist maximale Kompatibilität mit sehr alter Software.
- Beeinflusst Bildkomprimierung SEO?
- Ja, positiv. Google nutzt Page Speed (Core Web Vitals) als Rankingfaktor, und Bilder sind typischerweise der größte Verursacher langsamer Ladezeiten. Komprimierte Bilder senken auch Bandbreitenkosten.