Wat is Avif, het nieuwe royalty-free beeldformaat?

© PXimport

Wat is Avif, het nieuwe royalty-free beeldformaat?

Geplaatst: 31 maart 2021 - 07:13

Aangepast: 17 november 2022 - 10:40

Koen Vervloesem

Avif is een nieuw beeldformaat voor het web, geoptimaliseerd om afbeeldingen in hoge kwaliteit met zo weinig mogelijk bandbreedte aan te bieden. Het gebruik ervan is royalty-free, en de eerste webbrowsers hebben al ondersteuning ingebouwd.

Rond 2015 waren diverse bedrijven ontevreden over de stand van zaken op het gebied van videoformaten voor het web. Het w3c had geen videoformaat in de html5-specificatie opgenomen en ook in webrtc (zie PCM 10 van vorig jaar) was men niet tot overeenstemming gekomen over één verplicht videoformaat. Amazon, Cisco, Google, Intel, Microsoft, Mozilla en Netflix sloegen daarom de handen ineen en richtten de Alliance for Open Media op om een royalty-free alternatief voor videoformaten als h.264 en hvec te ontwikkelen.

In de jaren erna voegden talloze bedrijven zich bij AOMedia. In 2018 werd av1 gepubliceerd, wat staat voor AOMedia Video 1. Het videoformaat is geoptimaliseerd voor streamen via internet, in het bijzonder realtime-toepassingen zoals webrtc. Het kan worden gebruikt met containerformaten isobmff (ISO Base Media File Format) en Matroska.

Het compressie-algoritme van av1 voor video’s is ook bruikbaar om stilstaande beelden te comprimeren. Het wordt dan gebruikt in combinatie met het containerformaat heif (High Efficiency Image File Format), een speciaal geval van isobmff. De bestandsextensie is meestal .avif en het mime-type image/avif. AOMedia publiceerde in 2019 de royalty-free specificatie van het beeldformaat avif.

Avif kan zowel een lossy als een lossless codec gebruiken, net zoals webp dat kan. Je kunt ook een alfakanaal voor transparante gebieden instellen. Bovendien kun je zelfs een serie van geanimeerde afbeeldingen in een avif-bestand steken, waardoor je een soort geanimeerde gifs op hoge kwaliteit krijgt. Avif is daarnaast een van de eerste beeldformaten die hdr (high dynamic range) ondersteunt, en biedt verder een breed gamma aan kleurenruimtes. De kleurdiepte kan 8, 10 of 12 bit zijn, wat beter is dan de 8 bit van webp.

Minder bandbreedte

Het belangrijkste voordeel van avif vergeleken met andere beeldformaten is dat het zelfs met heel lage bitrates nog aanvaardbare beelden kan produceren. Vergeleken met jpeg zie je bijvoorbeeld veel minder artefacten van de compressie. In situaties waar lage bandbreedte of weinig opslagruimte belangrijk zijn, komt avif dan ook heel goed tot zijn recht. Maar ook op het web is voor veel afbeeldingen niet de hoogste kwaliteit nodig. Daar presteert avif eveneens heel goed: voor dezelfde kwaliteit neemt een avif-bestand doorgaans maar de helft in van een jpeg-bestand.

Als je weet dat meer dan de helft van de bandbreedte van een gemiddelde website aan afbeeldingen wordt besteed, zie je al snel hoe belangrijk dit voordeel is. Sinds oktober 2020 ondersteunt Cloudflare avif-afbeeldingen in zijn api (application programming interface), en het bedrijf raadt het gebruik van avif aan voor websites die afbeeldingen in hoge kwaliteit met zo weinig mogelijk bandbreedte willen aanbieden. Dat is belangrijk als de bezoekers zich op een traag netwerk bevinden of in landen waar bandbreedte duur is.

 

© PXimport

Nadelen

Omdat avif een afgeleide is van een videoformaat, zijn er ook enkele nadelen. Zo is er geen ondersteuning voor progressive rendering. Je moet wachten tot het volledige bestand is gedownload voordat het in je webbrowser wordt weergegeven. Voor hogeresolutiebeelden kan dat even duren. Andere beeldformaten zoals jpeg ondersteunen wel progressive rendering en tonen al tijdens het downloaden van het bestand delen van de afbeelding. Dus hoewel een jpeg-bestand doorgaans groter is dan een avif-bestand van gelijkwaardige kwaliteit, voelt het inladen van het jpeg-bestand wel sneller aan omdat je al eerder een deel te zien krijgt.

Een ander nadeel is dat encoding tamelijk processorintensief is. Je kunt het zelf uitproberen met cavif, waarmee je png- en jpeg-bestanden naar avif omzet, of met de officiële encoder van libavif. Ook het decoderen is wat intensiever dan bij andere formaten, maar is zelfs op low-end Android-telefoons niet merkbaar traag. De ontwikkelaars van VLC werken aan een zo snel mogelijke decoder, genaamd dav1d.

AVIF gebruiken

Microsoft ondersteunt avif sinds de Windows 10 mei 2019-update. Als je de gratis av1-videocodec uit de Microsoft Store hebt geïnstalleerd, toont de Verkenner miniaturen, voorvertoningen en exif-metadata van avif-afbeeldingen. Ook Paint ondersteunt dan avif-afbeeldingen en Microsoft biedt api’s aan voor ontwikkelaars die met avif-afbeeldingen in hun software willen werken.

In Paint.net kun je sinds versie 4.2.2 (september 2019) avif-afbeeldingen openen, en sinds versie 4.2.14 (waarvan de bètaversie in augustus 2020 uitkwam) ook afbeeldingen in avif-formaat opslaan. Voor GIMP bestaat er een plug-in die ondersteuning toevoegt. Je kunt ook afbeeldingen online omzetten naar avif-formaat met de webapp Squoosh van het Google Chrome-team, maar dan moet je webbrowser wel avif ondersteunen.

Het zullen vooral de webbrowsers zijn waarin avif-ondersteuning belangrijk wordt. Firefox ondersteunt avif voorlopig niet standaard, maar je kunt de ondersteuning sinds Firefox 77 (juni 2020) wel inschakelen door in about:config de optie image.avif.enabled op true te zetten. Google ondersteunt avif sinds Chrome 85 (augustus 2020) en schakelt die ondersteuning zelfs standaard in. Op de webpagina Can I use AVIF vind je de huidige ondersteuning door de meest gebruikte webbrowsers.

Op je eigen website kun je ook avif-bestanden gebruiken. Om te voorkomen dat dit tot problemen leidt bij webbrowsers die nog geen avif ondersteunen, voorzie je in je html-code een fallback, bijvoorbeeld als volgt:

<picture> <source srcset="foto.avif" type="image/avif"/> <source srcset="foto.webp" type="image/webp"/> <img alt="Foto" src="foto.jpg"/> </picture>

Je webbrowser toont dan het bestand foto.avif als hij het type image/avif ondersteunt. Zo niet, dan probeert hij het webp-bestand te tonen (dat al breder ondersteund is). Als ook dat faalt, toont hij het bestand foto.jpg in het breed ondersteunde jpeg-formaat.

Deel dit artikel
Voeg toe aan favorieten