Eine Landingpage, die endlich den Lighthouse-Audit bestanden hat
Du veröffentlichst am Freitag eine Landingpage, und Lighthouse beanstandet immer wieder dein Hero-Bild. Das PNG, das du aus Figma exportiert hast, ist 2,4 MB groß, und das Seitengewicht ruiniert deinen Largest-Contentful-Paint-Wert. Das Marketingteam hat das Bild ausgesucht, du hast keine Zeit, neu zu verhandeln.
Du legst das PNG in den Konverter, lässt die Qualität auf dem Standard 85 und bekommst ein 380 KB großes WEBP zurück, das in Hero-Größe identisch aussieht. Du tauschst das Asset aus, pushst die Änderung, und Lighthouse steigt bei der Leistung von 67 auf 94. Das Marketingteam hat den Unterschied visuell nie bemerkt.
Sechs MB Hero-Bilder auf der Website wurden zu insgesamt 1,1 MB. Gleicher Look, schnelleres Laden.
Ein Logo-Set, das das Brandbook in WEBP wollte
Dein Kunde hat seine Markenrichtlinien aktualisiert und verlangt jetzt WEBP für alle Web-Assets — irgendwo haben sie gelesen, dass es die richtige Wahl sei. Du hast dreißig PNG-Logos mit transparenten Hintergründen, und das Brandbook will sie als WEBP, ohne den Alphakanal zu verlieren.
Du legst alle dreißig PNGs in den Konverter, stellst die Qualität auf Max, damit die Logos gestochen scharf bleiben, und bekommst dreißig WEBPs mit intakter Transparenz zurück. Jedes ist ungefähr halb so groß wie das ursprüngliche PNG. Der Kunde gibt sein Okay ohne Korrekturen.
Was du schätzt, ist, dass der Alphakanal einfach funktioniert hat — kein Abflachen, keine Ränder, kein Neuexport aus den Quelldateien nötig.
Ein Blog-Archiv aus JPGs, das in eine CDN-Stufe passen musste
Du hast deinen Blog auf einen statischen Hosting-Tarif mit einer großzügigen, aber nicht unbegrenzten CDN-Stufe umgezogen. Dein Bildarchiv umfasst sechs Jahre JPGs, und du liegst 200 MB über dem kostenlosen Kontingent. Du würdest lieber nicht für die nächste Stufe zahlen, nur um alte Hero-Bilder zu hosten.
Du konvertierst die größten 200 JPGs im Stapel zu WEBP mit Qualität 80, tauschst die Verweise in deinem Build-Skript aus, und die Gesamtgröße sinkt auf 35 % des Originals. Du bist wieder unter dem Kontingent mit Puffer, und der visuelle Unterschied in einem Blogbeitrag ist für Leser unsichtbar.
Gleiches Archiv, kleinere Rechnung, keine Qualitätsbeschwerden.