4K-Bilder vs. optimiertes 800px-WebP: Performance gegen Qualität abwägen

Ein 18-Tisch-Pfannenrestaurant in Maltepe hatte ein klares Problem: Gäste scannten den QR-Code und starrten 5-6 Sekunden auf eine leere Menüansicht. Ursache: DSLR-4K-JPEGs mit 4-6 MB pro Produktkarte. Die Lösung war nicht, das 4K-Original zu löschen, sondern die richtige Größe auszuliefern.

Core Web Vitals: LCP als harte Grenze

Googles Largest Contentful Paint (LCP) liegt bei 2,5 Sekunden. Menükarten mit 4K-Bildern testen bei 4,2-6,1 Sekunden — Kategorie "Schlecht". Mit 800px WebP fällt dieselbe Karte auf 1,2-1,8 Sekunden und liegt im "Guten" Bereich.

LCP ist kein Kosmetikum — es beeinflusst direkt das SEO-Ranking. Restaurants in den Top-3-Mobilergebnissen haben durchschnittlich LCP unter 1,9 s. Über 4 s rutscht man auf Seite 2-3.

Warum 800px WebP genügt

Moderne Handybildschirme sind 390-430px CSS-breit. Mit Retina-Verdopplung max. 860px. 800px WebP erreicht damit die physikalische Obergrenze. Die restlichen 3.200 Pixel eines 4K-Bildes entsprechen keinem sichtbaren Pixel.

WebP ist bei gleicher Qualität 25-35% kleiner als JPEG. 800px WebP (180 KB) statt 4K JPEG (5,2 MB) spart 96,5% Bandbreite.

thMenu Responsive Image Service

Beim Upload eines 4K-Originals erzeugt thMenu automatisch 320px, 640px, 800px, 1200px WebP+AVIF-Derivate. Der Browser wählt via srcset die passende Größe — günstiges Android 320px, Tablet 800px.

Lazy Loading ist Standard: Nur Karten im Sichtfeld laden Bilder. First Contentful Paint unter 600 ms.

FAQ

Muss ich das 4K-Original löschen? Nein. thMenu speichert das Original in R2; künftige 8K-Displays können automatisch größere Derivate erhalten.

Wie viel kleiner ist AVIF? Durchschnittlich 50% kleiner als JPEG, 20% kleiner als WebP bei gleicher Qualität. Unterstützt von 94% der Browser.

Leidet die Fotoqualität? Nein. Bei 800px auf Mobilgeräten ist 4K nicht unterscheidbar — das menschliche Auge erreicht handheld keine 300 PPI darüber.

Hilfreich? Teilen Sie es.