Über den Autor Colin Bendell ist Senior Director für Strategie und Analytik im CTO-Büro von Cloudinary. Er ist begeistert von Daten, Webleistung und Benutzererfahrung. Colin ist auch Co-Autor von "High Yield Images".
Seit den Anfängen des Internets haben Webseiten dieselben Bilddateiformate verwendet: JPEG und GIF. Diese "Dinosaurier" wurden in den 80er und 90er Jahren entwickelt und sind immer noch eine sehr erfolgreiche Art. Aktuelle Daten von W3Techs zeigen, dass JPEG-, GIF- und PNG-Formate bei weitem die beliebtesten Formate auf den heutigen Websites sind.
Gleichzeitig scheint eine neue Art das moderne Web zu unterstützen. Leichte, leistungsstarke Formate wie Google WebP und das hocheffiziente Bilddateiformat (HEIF) sind für die heutigen digitalen Erlebnisse optimiert. Andere, wie die Formate AVIF (AV1) und JPEG XL, sind noch in Arbeit. Während ich GIFs liebe, entwickelt sich das Ökosystem mit schnelleren, schlankeren und intelligenteren Optionen.
Angesichts dieser Veränderungen fragen mich die Leute, wann die altmodischen Dinosaurier verschwinden werden. Wie bei der Stromversorgung in unseren Häusern würde ein Hard-Reset und die Einführung einer neuen Infrastruktur jedoch ein "meteorisches" Ereignis erfordern. Die Geburt des Internets war ein einzigartiger Moment, der die ersten Formate widmete, von Webanwendungen über Minensteuerungssysteme bis hin zu Autos und Fernsehgeräten. Um die Evolution besser zu verstehen, beginnen wir mit einem kurzen Anthropologie-Lehrbuch.
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, liegt der Ursprung des Standards in der Fotografie.
JPEG und wurde entwickelt, um Fotos zugänglich zu machen, damit sie als Bytes im Netzwerk verschoben werden können. JPEG löste dieses Problem mit einer Technik namens "verlustbehaftete Komprimierung", bei der alle Komponenten des Bildes gespeichert werden, aber unnötige Pixel entfernt werden. Die resultierende Dateigröße wird komprimiert, aber mit jeder gespeicherten Version verlieren Sie mehr Details (siehe Abbildung oben). Dies schafft praktische Probleme.
Beispielsweise ist es unmöglich, die genauen Informationen zu archivieren, die für bestimmte Arten von Abbildungen erforderlich sind. Dies ist nicht ideal für Markenlogos, da es unmöglich ist, die genaue Farbpalette des Unternehmens beizubehalten. Für den E-Commerce können JPEG-Dateien keine neuen Funktionen wie transparente Hintergründe oder Animationen unterstützen.
GIF
GIF, das von CompuServe ungefähr zur gleichen Zeit wie GIF entwickelt wurde, verwendet eine "verlustfreie" Komprimierung. Wie der Name schon sagt, können so die Originaldaten aus den komprimierten Daten perfekt rekonstruiert werden.
Dadurch eignet sich das GIF viel besser für Illustrationen / Grafiken und behält den genauen Farbcode bei. Sie können Bilder auch mit transparentem Hintergrund 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 Bitmap-Dateiformat (Raster Graphics), das auch die 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 entwickelt und wurde speziell für den Webgebrauch entwickelt. Es unterstützt Transparenz. Dies ist heute das am weitesten verbreitete Bilddateiformat im Web. Das Größenproblem konnte jedoch nicht überwunden werden. Je nach Verwendung sind PNG-Bilder normalerweise größer als JPEG und manchmal GIF.
Als die Größe zu zählen begann
Die Größe war in den frühen Tagen des Internets kein Problem, als auf Websites nur sehr wenige Bilder gehostet wurden. 1995 betrug die durchschnittliche Seitengröße 14 KB und manchmal enthielt sie nur ein einziges Bild. Natürlich waren die Leute, die Fernverbindungen verwendeten, etwas geduldiger als heute.
Mit der Beschleunigung der Internetgeschwindigkeit haben sich jedoch die durchschnittliche Seitengröße und die Anzahl der verwendeten Bildseiten erheblich erhöht. Webbenutzer werden weniger geduldig und die Bildgröße spielt eine Rolle - die Seitenleistung wirkt sich direkt auf die Webkonvertierung aus. Infolgedessen hat die Verwendung schwererer GIF-Dateien abgenommen und wurde 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 verwendet und darauf abzielt, Bilder zu erzeugen, die kleiner als JPEG sind. WebP ermöglicht Transparenz und kann animiert werden. Das von Google stammende Format konzentriert sich jedoch mehr auf schnellere Bildladezeiten als auf eine höhere Bildqualität.
WebP ist ein gutes Beispiel für die Schwierigkeit, ein neues Format einzuführen. Selbst mit Google-Unterstützung weist das Bilddateiformat eine Website-Nutzungsrate von weniger als 1% auf. Einer der Hauptgründe ist die mangelnde Unterstützung, die hauptsächlich auf native Chrome- und Android-Apps beschränkt ist.
Geringe Erwartungen an immersive Erlebnisse.
Es zeigt auch, dass in der heutigen Welt das schnelle Laden von Seiten wichtig ist, aber das ist noch nicht alles. Die Bildqualität ist ebenfalls wichtig. Eine der Einschränkungen älterer Formate besteht darin, dass ihr Farbspektrum auf dem Standard-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 aufgenommen und mit dem verglichen haben, was Sie tatsächlich gesehen haben (siehe Bild unten). Beide unterscheiden sich stark, da ältere Bilddateiformate nicht das gesamte Farbspektrum anzeigen.
Die linke Seite des obigen Bildes verwendet das in JPEG gefundene sRGB-Profil. Die rechte Seite verwendet 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)
In einer Zeit, in der die Erwartungen an die Benutzererfahrung relativ niedrig waren und wir erwartet hatten, online zu sein, war dies kein Problem. Noch vor zehn Jahren konnten wir uns nicht vorstellen, dass Menschen so viel Zeit ihres Lebens online auf verschiedenen Geräten verbringen würden, und dies würde solch eindringliche Erfahrungen erfordern. Wenn Leute online einkaufen, wollen sie nicht nur sehen, wie ein Fahrer aussieht, sondern eine umfassendere Idee. Sie möchten oft eine vollständige 360-Grad-Ansicht. Sie möchten das Bild des Produkts vergrößern und sich ein Bild von der Textur des Samtrandes machen. Sie wollen die Konsistenz der Farben und ihre Eignung aus Gründen untersuchen, um ihre 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-Brückenbild ist 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) dank der Bemühungen von Nokia und Apple entwickelt. HEIF unterstützt sowohl Einzelbilder als auch 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 immer erhalten, da die Änderungen separat in derselben Datei gespeichert werden.
S & # 39; Anpassung an die neue Welt von 3D und bewegten Bildern
Mit dem HEIF-Format können Sie 3D-ähnliche Bilder mit sogenannten "Tiefenkarten" -Techniken erstellen. Aber das ist erst der Anfang. Es werden auch Bildsequenzen unterstützt, sodass Sie animierte Bilder im Cinemagraph-Stil erstellen können, die durch die Harry-Potter-Filme berühmt wurden. Sie können die Bewegungen direkt nach der Aufnahme erfassen und anzeigen, um ein umfassendes und kontextbezogenes Erlebnis zu schaffen. HEIF unterstützt auch Funktionen, die das Seherlebnis verbessern, wie HDR, das eine höhere Farbhelligkeit bietet, und Adobe Wide-Gamut RGB, mit dem ein erweiterter Bereich von Farbwerten gespeichert werden kann.
Seit der Veröffentlichung von OS11 speichert Apple Bilder auf seinen Geräten im HEIF-Format und verarbeitet 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.
Der lange Schwanz, der Dinosaurier schützt.
Wir haben erwähnt, dass JPG und GIF während der Bildung des Internets entwickelt wurden und dass die gesamte verfügbare Infrastruktur sie weiterhin unterstützt. Dies erklärt, warum die Gesamtnutzungsrate von WebP trotz aller Bemühungen von Google so niedrig ist. Geräte mit Apple OS11 und höher können HEIF unterstützen, enthalten jedoch nur einen Teil der Geräte und Browserversionen in freier Wildbahn. Und Sie könnten überrascht sein, wie wild diese Welt ist.
Chrome und Safari für Mobilgeräte und PCs sind die am häufigsten verwendeten Browser. Es gibt jedoch eine sehr lange Liste von Problemumgehungen, die im obigen Diagramm durch die kleinsten und kleinsten Bereiche dargestellt werden (Quelle: Cloudinary State of Visual Media Report 2019).
Cloudinary hat kürzlich seinen Visual Media-Bericht der nächsten Generation veröffentlicht, damit die Benutzer besser verstehen, wie visuelle Inhalte angezeigt und verwendet werden. Bei der Analyse von Milliarden von Multimedia-Transaktionen in einer Stichprobe von mehr als 700 unserer Kunden waren wir sehr überrascht, die Länge der "Browser-Warteschlange" zu ermitteln. Es ist nicht überraschend zu erfahren, dass Chrome mit 56.6% der Browsernutzung den Krieg gewinnt, aber es gibt große regionale Unterschiede. In Großbritannien liegt Safari mit 41,1% an zweiter Stelle. In Indien sind Nokia Symbian-Smartphones nach wie vor beliebt und Nintendo DS-Geräte teilen täglich mehr als 15,000 Bilder. Ob Sie es glauben oder nicht, wir haben sogar einen Bildverkehr von Lotus Notes gesehen.
JPEG und GIF sind der kleinste gemeinsame Nenner von Formaten, die auf einer Vielzahl von Geräten und Browsern "nur funktionieren". Und das Problem mit dem langen Schwanz wird nicht so schnell verschwinden. Dies bedeutet, dass JPEGs und GIFs im Gegensatz zu echten Dinosauriern zumindest ohne Meteoriten nicht gefährdet sind. Daher müssen sich unsere Websites an neue Dateiformate und aufkommende Dinosaurier anpassen.
Colin Bendell, Senior Director für Strategie und Analytik, CTO Office bei Cloudinary