JPG, PNG, WebP oder AVIF?

Bevor du Formate vergleichst, kenne die Aufteilung, die alle von ihnen antreibt. Verlustfreie Formate speichern jeden Pixel genau und können für immer erneut geöffnet und erneut gespeichert werden ohne Verschlechterung — PNG ist die wichtigste. Verlustbehaftete Formate werfen Informationen weg, die das Auge wahrscheinlich nicht bemerken wird, handeln ein wenig Qualität gegen eine viel kleinere Datei — JPG, WebP und AVIF tun dies alle. Es gibt kein einzelnes "bestes" Format, weil die richtige Wahl davon abhängt, ob dein Bild ein Foto, ein Logo oder ein Screenshot ist und wie viel du Größe gegenüber Kompatibilität schätzt.

JPG (oder JPEG) ist das Veteran. Es wurde für Fotografien gebaut und nutzt Verlustkompressionierung, die für die sanften Farbverläufe von echten Bildern abgestimmt ist. Es hat keine Transparenz und seine Kompression kann blockartige Artefakte um scharfe Kanten und Text hinterlassen, weshalb es falsch für Logos und Screenshots ist. Seine Superkraft ist universelle Unterstützung: jedes Gerät, jeder Editor und jede Website akzeptiert ein JPG.

PNG ist die verlustfreie Wahl. Es bewahrt jeden Pixel und unterstützt volle Transparenz, was es zum Standard für Grafiken mit harten Kanten, Text, UI-Screenshots und alles mit einem durchsichtigen Hintergrund macht. Die Kosten sind Dateigröße: Ein PNG-Foto ist oft mehrere Male größer als das gleiche Foto als JPG, daher ist PNG eine schlechte Wahl für fotografischen Inhalt im Web.

WebP, von Google, ist der moderne Allrounder. Es bietet sowohl Verlust- als auch Verlustfreie Modi plus Transparenz und Animation, und bei ähnlicher Qualität produziert es Dateien ungefähr 25-35% kleiner als JPG und oft viel kleiner als PNG. Alle aktuellen Browser unterstützen es, was es zur pragmatischen Voreinstellung für eine schnelle Website heute macht.

AVIF ist das Neueste der vier, basierend auf moderner Videocodec-Technologie. Es erreicht typischerweise die kleinsten Dateien von allen — häufig schlägt WebP um ein großes Stück auf Fotos — und unterstützt Transparenz, breite Farbe und hohen dynamischen Bereich. Die Unterstützung ist nun breit aber nicht ganz universell, daher servieren Websites normalerweise AVIF mit einem WebP- oder JPG-Fallback für die letzten paar älteren Clients.

Eine gut optimierte Webseite nutzt selten ein Format für alles. Fotografien gehen als WebP oder AVIF für Geschwindigkeit hinaus, mit einem JPG-Fallback. Logos, Symbole und alles mit Transparenz bleiben als PNG — oder besser, als SVG, wenn sie Vektorgrafiken sind — da ein Verlustformat ihre scharfen Kanten verwischen würde. Screenshots von Text sehen aus demselben Grund beste als PNG.

Wenn du dir nicht sicher bist, ob ein Wechsel es wert ist, konvertiere ein repräsentatives Bild und vergleiche sowohl die Dateigröße als auch, wie es bei vollem Zoom aussieht. Der Größenabfall von JPG zu WebP oder AVIF ist oft dramatisch ohne sichtbaren Qualitätsverlust, was genau der Gewinn ist, der Seiten schneller laden lässt. Wenn Kompatibilität wichtiger ist als Bytes — ein Email-Anhang, ein altes System, eine Druckerei — fallen zurück zu JPG oder PNG, den zwei Formaten, die überall funktionieren.