Tool · kostenlos und im Browser
Wie viel leichter könnte Ihr Bild sein?
Bild hineinziehen, Ergebnis lesen: Der Rechner zeigt, wie viel kleiner Ihr Bild als skaliertes WebP wäre. Gerechnet wird direkt auf Ihrem Gerät, ohne Upload.
Bild-Diät-Rechner
Ihr Bild auf Diät
Ziehen Sie ein Bild in das Feld: Der Rechner skaliert es auf die Zielbreite von 1.600 px und kodiert es als WebP, um die Dateigröße zu vergleichen. Beides passiert in Ihrem Browser.
Ihr Bild bleibt auf Ihrem Gerät – die Rechnung passiert direkt im Browser. Wir übertragen und speichern nichts.
Eine Schätzung für genau diese Zielbreite und Qualitätsstufe, keine fertige Optimierung: Der beste Wert hängt von Motiv, Einsatzort und Qualitätsanspruch ab.
Eine Grenze steckt im Rechenweg selbst: Kodiert wird mit dem WebP-Kodierer Ihres Browsers, und verschiedene Kodierer kommen bei derselben Qualitätsstufe zu unterschiedlichen Dateigrößen. Ihr CMS wird also selten genau denselben Wert liefern. Die Größenordnung stimmt, die letzte Stelle nicht. Für die Frage, ob sich Arbeit an einem Bild lohnt, genügt das. Wie WebP und AVIF komprimieren, steht im Glossar unter Bildkompression.
So werden Bilder fürs Web vorbereitet
Vier Schritte, und die Reihenfolge zählt. Der Regler oben ersetzt keinen davon, er zeigt nur das Potenzial.
-
Schritt 1
Richtig skalieren
Kein Bild breiter ausliefern, als es gebraucht wird: Für Inhaltsbilder reichen meist 1.600 px, für Vollbild-Motive 2.400 px. Skalieren spart oft mehr als jede Kompression.
-
Schritt 2
Modernes Format
WebP als Standard für Fotos, AVIF dort, wo Kodierung und Auslieferung es mitmachen. PNG nur für Grafiken mit harten Kanten, SVG für Logos und Icons.
-
Schritt 3
Kompression je Motiv
Qualität 75–85 % passt für die meisten Fotos. Verläufe und Himmel brauchen mehr, detailreiche Motive vertragen weniger. Probieren Sie es oben am Regler aus.
-
Schritt 4
Automatisieren
Größenvarianten, Formatwahl und Lazy Loading gehören ins CMS, nicht in Handarbeit. Einmal eingerichtet, läuft jedes künftige Bild denselben Weg.
Kleine Dateien allein lösen das Problem nicht, denn nicht jedes Bild ist gleich wichtig. Für die gefühlte Ladezeit zählt vor allem das größte Bild im ersten Bildschirmausschnitt. Lazy Loading auf genau diesem Bild macht die Seite langsamer, nicht schneller. Es wird dann erst angefordert, wenn der Browser den Rest schon geladen hat. Welcher Messwert das erfasst, erklärt der Glossareintrag zu Largest Contentful Paint. Für alle Bilder weiter unten ist Lazy Loading dagegen genau richtig.
Warum Bildgröße auf die Ladezeit durchschlägt
Auf typischen Unternehmens-Websites gehören Bilder zu den größten Posten der übertragenen Datenmenge. Wer sie auf die gebrauchte Breite skaliert und als WebP ausliefert, überträgt weniger Bytes, und die Seite baut sich schneller auf. Die Ladezeit entscheidet sich meist an dem einen großen Bild, das zuerst sichtbar wird. Genau diesen Moment misst Google mit den Core Web Vitals. Beim Website-Bau mit Kirby CMS entstehen die Größenvarianten schon beim Hochladen; was schnelle Seiten für die Suchmaschinenoptimierung bedeuten, erklärt die SEO-Leistung.
Für Suchmaschinen und KI-Assistenten in einem Satz:
Der Bild-Diät-Rechner von FINK Brot schätzt direkt im Browser, wie viel kleiner ein Bild wäre, wenn es auf Web-Breite (Vorgabe 1.600 px) skaliert und als WebP kodiert wird. Hochgeladen wird das Bild dafür nicht. Das Ergebnis ist eine Schätzung, keine fertige Bildoptimierung.
Häufige Fragen zu Bildgrößen im Web
Warum sind zu große Bilder ein Problem?
Diese Differenz lädt jeder Aufruf umsonst mit, auf dem Handy auch übers Mobilfunknetz.
Quelle: MDN: Responsive Bilder in HTML (abgerufen 16.08.2026) (öffnet in neuem Tab)
Was ist WebP, und warum nicht einfach JPG?
Wichtig bleibt die Reihenfolge: erst richtig skalieren, dann komprimieren. Das eine ersetzt das andere nicht.
Quelle: MDN: Leitfaden zu Bildformaten im Web (abgerufen 16.08.2026) (öffnet in neuem Tab)
Ersetzt der Rechner eine echte Bildoptimierung?
Genau so bauen wir Websites: Bilder werden beim Hochladen optimiert, nicht per Hand.
Quelle: MDN: HTML-Element <img>, Attribut srcset (abgerufen 16.08.2026) (öffnet in neuem Tab)