Über den Autor Colin Bendell ist Senior Director of Strategy and Analytics im CTO Office bei Cloudinary. Seine Leidenschaft gilt den Themen Daten, Web-Performance und Benutzererfahrung. Colin ist außerdem Co-Autor von „High Performance Imaging“. Seit den Anfängen des Internets verwenden Webseiten dieselben Bilddateiformate: JPEG und GIF. Diese in den 80er und 90er Jahren entwickelten „Dinosaurier“ sind immer noch eine sehr erfolgreiche Art. Aktuelle Daten von W3Techs zeigen, dass JPEG-, GIF- und PNG-Formate heute bei weitem die beliebtesten Formate auf Websites sind.
Gleichzeitig scheint eine neue Spezies das moderne Web zu unterstützen. Leistungsstarke, leichte Formate wie Google WebP und High Efficiency Image File Format (HEIF) sind für die digitalen Erlebnisse von heute optimiert. Andere, wie das AVIF- (AV1) und das JPEG XL-Format, sind noch in Arbeit. Obwohl ich GIFs liebe, entwickelt sich das Ökosystem mit schnelleren, ausgefalleneren und intelligenteren Optionen weiter. Angesichts dieser Veränderungen fragen mich die Leute, wann die altmodischen Dinosaurier verschwinden werden. Doch genau wie beim Strom in unseren Häusern würde ein Hard-Reset und die Einführung einer neuen Infrastruktur ein „kometenhaftes“ Ereignis erfordern. Die Geburt des Internets war ein einzigartiger Moment, der die ersten Formate hervorbrachte, von Webanwendungen über Minenkontrollsysteme bis hin zu Autos und Fernsehern. Um die Evolution besser zu verstehen, beginnen wir mit einem kurzen Lehrbuch der Anthropologie.
Bei der verlustbehafteten JPEG-Komprimierung gehen bei jeder Sicherung Details verloren, was zu einer Verschlechterung der Bildschärfe führt (Bildnachweis: Cloudinary) (Bild: © Bildnachweis: Cloudinary)
Beliebte Bildformate erklärt
JPEG Als JPEG Ende der 1980er Jahre entwickelt wurde, steckte die digitale Welt noch in den Kinderschuhen. Es gab keine Möglichkeit, Bilder einfach elektronisch zu speichern, zu kopieren und zu übertragen. Wie das P in JPEG anzeigt, liegen die Ursprünge des Standards in der Fotografie. JPEG und wurde entwickelt, um Fotos zugänglich zu machen, sodass sie sich wie Bytes im Web bewegen können. JPEG löste dieses Problem durch die Verwendung einer Technik namens „verlustbehaftete Komprimierung“, bei der alle Bildkomponenten gespeichert, aber unnötige Pixel entfernt werden. Die resultierende Dateigröße wird komprimiert, aber mit jeder gespeicherten Version gehen mehr Details verloren (siehe Abbildung oben). Dies führt zu praktischen Problemen. Beispielsweise ist es nicht möglich, die genauen Informationen zu speichern, die für bestimmte Arten von Illustrationen erforderlich sind. Dies ist für Markenlogos nicht ideal, da es unmöglich ist, die genaue Farbpalette des Unternehmens beizubehalten. Für E-Commerce können JPEG-Dateien keine neuen Funktionen wie transparente Hintergründe oder Animationen unterstützen. GIF GIF wurde etwa zur gleichen Zeit wie GIF von CompuServe entwickelt und verwendet eine „verlustfreie“ Komprimierung. Wie der Name schon sagt, ermöglicht dies eine perfekte Rekonstruktion der Originaldaten aus den komprimierten Daten. Dadurch eignet sich das GIF viel besser für Illustrationen/Grafiken und der genaue Farbcode bleibt erhalten. Es ist auch möglich, Bilder mit transparentem Hintergrund zu speichern. Und wie jeder weiß, können GIFs animiert werden. Der Hauptnachteil von GIF-Dateien ist ihre enorme Dateigröße, die sie auch zum Drucken von Fotos ungeeignet macht. PNG Das PNG-Format ist ein Rastergrafik-(Bitmap-)Dateiformat, das auch verlustfreie Datenkomprimierung unterstützt. Aufgrund von Patentproblemen im Zusammenhang mit GIF ist PNG zu einer verbesserten, nicht proprietären Alternative geworden. Es wurde Mitte der 90er Jahre speziell für die Nutzung im Internet entwickelt und unterstützt Transparenz. Dies ist heute das am weitesten verbreitete Bilddateiformat im Internet. Das Größenproblem konnte jedoch nicht gelöst werden. Abhängig von der Verwendung sind PNG-Bilder oft größer als JPEGs und manchmal auch GIFs.
Als die Größe zu zählen begann
In den Anfängen des Internets, als auf Websites nur sehr wenige Bilder gehostet wurden, war die Größe kein Problem. Im Jahr 1995 betrug die durchschnittliche Seitengröße 14 KB und manchmal enthielt sie nur ein einziges Bild. Natürlich waren die Leute, die Remote-Verbindungen nutzten, etwas geduldiger als heute. Mit der Beschleunigung der Internetgeschwindigkeit sind jedoch die durchschnittliche Seitengröße und die Anzahl der verwendeten Bildseiten erheblich gestiegen. Webbenutzer werden weniger geduldig und die Bildgröße spielt eine Rolle – die Seitenleistung hat einen direkten Einfluss auf die Webkonvertierung. Infolgedessen wurde die Verwendung schwererer GIF-Dateien verringert und durch leichtere JPEG-Dateien ersetzt.WebP – leicht und schnell, aber langsam zu verstehen
Im Jahr 2010 veröffentlichte Google WebP als neues, leichtes Bildformat, das sowohl verlustbehaftete als auch verlustfreie Komprimierung nutzt und darauf abzielt, kleinere Bilder als JPEG zu erzeugen. WebP ermöglicht Transparenz und kann animiert werden. Allerdings ist das von Google stammende Format eher auf schnellere Bildladezeiten als auf eine höhere Bildqualität ausgerichtet. WebP ist ein gutes Beispiel für die Schwierigkeit, ein neues Format einzuführen. Selbst mit der Unterstützung von Google weist das Bilddateiformat eine Website-Nutzungsrate von weniger als 1 % auf. Einer der Hauptgründe ist die fehlende Unterstützung, die sich meist auf native Chrome- und Android-Apps beschränkt.Geringe Erwartungen an immersive Erlebnisse.
Es zeigt auch, dass in der heutigen Welt ein schnelles Laden von Seiten wichtig ist, aber das ist noch nicht alles. Auch die Bildqualität ist wichtig. Eine der Einschränkungen älterer Formate besteht darin, dass ihr Farbspektrum auf dem standardmäßigen Rot-Grün-Blau-Profil (sRGB) basiert, das in den 1990er Jahren für LCD-Bildschirme und Kameras entwickelt wurde. sRGB ist nur ein Bruchteil dessen, was das menschliche Auge erfassen kann. Möglicherweise haben Sie dies erlebt, nachdem Sie ein Foto einer Blume gemacht und es mit dem verglichen haben, was Sie tatsächlich gesehen haben (siehe Bild unten). Beides variiert stark, da ältere Bilddateiformate einfach nicht das gesamte Farbspektrum zeigen.
Die linke Seite des Bildes oben verwendet das in JPEG enthaltene sRGB-Profil. Die rechte Seite nutzt ein breiteres Farbspektrum als HEIF und sieht heller und detaillierter aus. Dieser Kontrast wird zur Veranschaulichung hervorgehoben: um sicherzustellen, dass auch Displays, die HDR und breitere Farbspektren nicht unterstützen, den Unterschied erkennen können. (Bildnachweis: Cloudinary) Zu einer Zeit, als die Erwartungen an die Benutzererfahrung relativ niedrig waren und wir davon ausgingen, online zu sein, war das kein Problem. Noch vor zehn Jahren hätten wir uns nicht vorstellen können, dass Menschen einen so großen Teil ihres Lebens online verbringen würden, über mehrere Geräte hinweg und solch eindringliche Erlebnisse benötigen würden. Wenn Menschen heute online einkaufen, wollen sie nicht nur sehen, wie ein Fahrer aussieht, sondern sie wollen eine umfassendere Vorstellung davon. Sie wünschen sich oft eine vollständige 360-Grad-Ansicht; Sie möchten das Bild des Produkts vergrößern und sich ein Bild von der Textur der Samtkante machen. Sie wollen die Konsistenz der Farben und ihre Eignung prüfen, um deren Qualität festzustellen. Der andere Faktor ist die Anwendung realer 3D-Experimente auf 2D-Bilder. Ein Fahrer in der realen Welt ist in 3D. Ein JPEG-Bridge-Bild ist es definitiv nicht. Hier kommen neue Formate wie HEIF ins Spiel.
HEIF: eine neue erfolgreiche Art.
HEIF wurde 2015 von der Moving Picture Experts Group (MPEG) durch die Bemühungen von Nokia und Apple entwickelt. HEIF unterstützt Einzelbilder sowie Bildsequenzen und unterstützt verlustbehaftete und verlustfreie Komprimierung. Nach unseren eigenen Untersuchungen sind neue Dateiformate wie HEIF 30–40 % kleiner als herkömmliche JPEG-Dateien. Die Qualität der Originaldatei bleibt stets erhalten, da die Änderungen separat in derselben Datei gespeichert werden.S & # 39; Gewöhnen Sie sich an die neue Welt der 3D- und Bewegtbilder
Mit dem HEIF-Format können Sie mithilfe sogenannter „Tiefenkarten“-Techniken 3D-ähnliche Bilder erstellen. Aber das ist erst der Anfang. Es unterstützt auch Bildsequenzen, sodass Sie animierte Bilder im Cinemagraph-Stil erstellen können, die durch die Harry-Potter-Filme bekannt sind. Es ermöglicht Ihnen, Bewegungen direkt bei der Aufnahme des Bildes zu erfassen und anzuzeigen und so ein immersives und kontextbezogenes Erlebnis zu schaffen. HEIF unterstützt auch Funktionen, die das Seherlebnis verbessern, wie HDR, das eine größere Farbhelligkeit bietet, und Adobe Wide-Gamut RGB, das einen erweiterten Bereich an Farbwerten speichern kann. Seit der Veröffentlichung von OS11 speichert Apple Bilder auf seinen Geräten im HEIF-Format und rendert sie im JPEG-Format, wenn sie an andere Geräte gesendet werden. Und wir kommen zu dem Punkt, der erklärt, warum diese neuen Formate trotz aller Vorteile so schwer zu erreichen sind.