välpackad väska som ett AV1 (AVIF) -filformat

Allt om AV1 Bildfil-formatet (AVIF) för hemsidor

Bilder utgör en stor del av den data som laddas på en modern webbsida – och formatet du väljer påverkar direkt både laddningstid, SEO och användarupplevelse. Under de senaste åren har AVIF (AV1 Image File Format) vuxit från att vara en teknisk kuriositet till att bli det format många experter rekommenderar som förstahandsval. Här går vi igenom vad AVIF är, varför det spelar roll och hur du kan börja använda det.

Vad är AVIF?

AVIF står för AV1 Image File Format och är ett öppet, royaltyfritt bildformat som bygger på videokodeken AV1. Formatet utvecklas av Alliance for Open Media (AOMedia) – ett konsortium med tungviktare som Google, Apple, Mozilla, Netflix, Amazon och Microsoft bland medlemmarna. Den första specifikationen (version 1.0.0) fastställdes i februari 2019 och version 1.1.0 kom i april 2022.

I grunden handlar AVIF om att ta de avancerade komprimeringsalgoritmer som utvecklats för modern videostreaming och tillämpa dem på stillbilder. Resultatet är bilder som behåller hög visuell kvalitet i avsevärt mindre filstorlekar jämfört med äldre format som JPEG och PNG.

Fördelar med AVIF

Överlägsen komprimering. AVIF levererar markant bättre komprimering än JPEG, PNG och även WebP. I praktiken innebär det att en AVIF-bild ofta kan vara 50–70 % mindre än motsvarande JPEG-bild utan synbar kvalitetsförlust. Det är en enorm skillnad för webbplatser med många bilder.

Högre bildkvalitet vid små filstorlekar. Tack vare den moderna komprimeringsalgoritmen undviker AVIF de typiska problemen med JPEG, som blockartifakter och färgblödning kring skarpa kanter. Bilder ser helt enkelt renare och skarpare ut – även vid aggressiv komprimering.

Stöd för avancerade funktioner. Till skillnad från JPEG stödjer AVIF transparens (alfa-kanaler), HDR (High Dynamic Range), brett färgomfång (Wide Color Gamut) och både förlustfri och förlustrik komprimering. Det gör formatet flexibelt nog för allt från fotografier till grafik och logotyper.

Öppet och royaltyfritt. Eftersom AVIF bygger på AV1 – som är helt öppet och fritt att använda – finns det inga licensavgifter. Det är en viktig skillnad jämfört med exempelvis HEIC, som är belagt med komplexa patentlicenser.

Teknisk bakgrund

AVIF bygger på AV1-videokodeken, som i sin tur är en vidareutveckling av Googles VP9 och VP10. AV1 utvecklades för att leverera videostreaming med hög kvalitet vid låga bitrater – och den tekniken översätts direkt till mycket effektiv bildkomprimering.

Bilderna lagras i en HEIF-container (High Efficiency Image File Format), samma containerformat som används av Apples HEIC-bilder, men med AV1 som komprimeringskodek istället för HEVC. Det innebär att AVIF kan dra nytta av avancerade kodningstekniker som intra-prediction, transformkodning och modern entropi-kodning för att hitta och eliminera visuell redundans på ett sätt som äldre format inte klarar.

En nackdel att vara medveten om är att AVIF-kodning kan vara relativt långsam jämfört med JPEG eller WebP. Dekodningen – som är det som påverkar slutanvändaren – har dock förbättrats avsevärt de senaste åren och är i praktiken inte ett problem för normala användningsfall.

Webbläsarstöd och kompatibilitet

En av de vanligaste frågorna kring AVIF har historiskt varit webbläsarstödet. I dag är den frågan i princip besvarad: alla stora webbläsare stödjer AVIF fullt ut. Chrome har haft stöd sedan version 85 (augusti 2020), Firefox sedan version 93 (oktober 2021), Safari sedan version 16 (september 2022) och Edge sedan version 121 (januari 2024).

Enligt Can I Use ligger AVIF-stödet på drygt 93 % av alla webbläsare globalt, vilket gör formatet redo för bredare användning utan att du nödvändigtvis behöver en fallback – även om det fortfarande är god praxis att erbjuda en via HTML-elementet <picture>.

CMS-stöd. Joomla 5 har inbyggt AVIF-stöd i sin mediahanterare, och WordPress lade till stöd i version 6.5. På serversidan kräver bildmanipulering med AVIF att PHP 8.1 eller senare används tillsammans med GD-biblioteket kompilerat med AVIF-stöd, alternativt ImageMagick med libheif. De flesta moderna webbhotell erbjuder numera denna konfiguration.

Operativsystem. macOS 13 (Ventura) och iOS 16 stödjer AVIF nativt – du kan visa AVIF-bilder direkt i Finder, QuickLook och appen Filer. Windows stödjer formatet via en gratis tilläggspaketet från Microsoft Store. Android har nativt stöd från version 12.

Användningsområden

Webbplatser och e-handel. Det mest uppenbara användningsområdet är webben. Genom att byta till AVIF för produktbilder, hero-bilder och redaktionella fotografier kan du drastiskt minska den totala sidvikten. Det förbättrar laddningstiden, Core Web Vitals (särskilt LCP) och i förlängningen SEO-rankingen.

Bildhantering och fotografi. AVIF:s stöd för HDR och brett färgomfång gör det intressant för fotografer och designers som vill distribuera högkvalitativa bilder digitalt utan att filstorlekarna skenar. Adobe Photoshop har sedan juni 2025 fullt stöd för att öppna, redigera och spara AVIF-filer. GIMP har haft nativt AVIF-stöd sedan 2020, och Lightroom stödjer formatet sedan version 7.0.

Digital publicering. E-böcker, digitala magasin och nyhetssajter med mycket bildmaterial kan dra stor nytta av AVIF. Filstorleksminskningen innebär snabbare nedladdning, mindre dataförbrukning för mobila läsare och en generellt smidigare läsupplevelse.

Implementering i praktiken

Det bästa sättet att implementera AVIF på en webbplats är att använda HTML:s <picture>-element, som låter webbläsaren välja det mest effektiva format den stödjer:

<picture>
  <source srcset="/bild.avif" type="image/avif">
  <source srcset="/bild.webp" type="image/webp">
  <img src="/bild.jpg" alt="Beskrivande alt-text">
</picture>

Med den här strukturen får användare med moderna webbläsare AVIF-versionen, medan äldre webbläsare faller tillbaka på WebP eller JPEG. Det är en robust lösning som inte kräver JavaScript.

Ett annat alternativ är att låta en CDN-tjänst sköta formatomvandlingen automatiskt. Tjänster som Cloudflare, Imgix och ImageKit kan analysera webbläsarens Accept-header och servera rätt format från en och samma URL. Det förenklar implementeringen avsevärt, särskilt för sajter med stora bildarkiv.

Om du använder Joomla 5 kan du ladda upp AVIF-bilder direkt i mediahanteraren, förutsatt att AVIF finns tillagt i listan över tillåtna filtyper och MIME-typer i inställningarna. Kontrollera även att din server kör PHP 8.1+ med GD-biblioteket kompilerat med AVIF-stöd.

Hur du konverterar till AVIF

Bildredigeringsprogram. Adobe Photoshop (från juni 2025-versionen) kan öppna och spara AVIF direkt. GIMP har haft nativt stöd sedan version 2.10, och Krita stödjer AVIF sedan version 5.0. Om du arbetar med äldre versioner av Photoshop finns det en tredjeparts-plugin för AVIF tillgänglig.

Onlineverktyg. Squoosh (utvecklat av Google Chrome-teamet) är ett utmärkt gratisverktyg för att konvertera enskilda bilder och experimentera med kvalitetsinställningar. Du ser resultatet i realtid och kan jämföra original och komprimerad version sida vid sida.

Kommandoradsverktyg. För masskonvertering och automatiserade arbetsflöden är verktyg som libavif (med verktyget avifenc) eller ImageMagick bra alternativ. De kan enkelt integreras i byggprocesser och CI/CD-pipelines.

CMS-plugins. Både Joomla och WordPress har tillägg som automatiskt kan konvertera uppladdade bilder till AVIF. För Joomla finns exempelvis plugin-paketet Responsive Images som hanterar konvertering. WordPress har flera alternativ, bland annat plugins som konverterar JPEG-bilder till AVIF vid uppladdning med fallback via picture-elementet.

AVIF jämfört med JPEG, PNG och WebP

Hur står sig AVIF i jämförelse med de format de flesta redan använder? Här är en överblick:

Egenskap	JPEG	PNG	WebP	AVIF
Komprimering (foto)	Bra	Dålig	Mycket bra	Utmärkt
Transparens	Nej	Ja	Ja	Ja
HDR-stöd	Nej	Nej	Nej	Ja
Förlustfri komprimering	Nej	Ja	Ja	Ja
Animation	Nej	Nej	Ja	Ja (begränsat)
Webbläsarstöd	Universellt	Universellt	~95 %	~93 %
Kodningshastighet	Snabb	Snabb	Snabb	Långsam

Ett konkret exempel: en fotografisk bild sparad som JPEG i kvalitet 60 kan landa på runt 72 KB. Samma bild som WebP hamnar på cirka 32 KB, och som AVIF på bara 12 KB – ungefär en sjättedel av JPEG-filens storlek vid jämförbar upplevd kvalitet.

WebP (utvecklat av Google) är fortfarande ett starkt alternativ, framför allt för icke-fotografiska bilder som illustrationer och ikoner där det också erbjuder snabb kodning. Men för fotografier och bilder där filstorlek verkligen spelar roll är AVIF i de flesta fall det bättre valet.

Det bör också nämnas att JPEG XL är ett annat modernt format som konkurrerar med AVIF. JPEG XL erbjuder likvärdig komprimering, fler funktioner (som progressiv avkodning och förlustfri omkomprimering av JPEG) – men saknar ännu stöd i Chromium och Firefox som standard, vilket gör det opraktiskt för webbdistribution just nu.

Framtiden för AVIF

AVIF har gått från experimentellt format till etablerad standard på bara några år. Med fullständigt webbläsarstöd, inbyggt stöd i de stora CMS-plattformarna och bred acceptans bland CDN-tjänster och bildredigerare är formatet redo för allmän användning.

Att det dessutom är öppet och royaltyfritt – till skillnad från exempelvis HEIC – gör det till ett framtidssäkert val. Alliansen bakom AV1 fortsätter att utveckla och optimera kodeken, vilket innebär att vi kan förvänta oss ytterligare förbättringar av både komprimeringseffektivitet och kodningshastighet framöver.

Den praktiska rekommendationen för 2025 och framåt är tydlig: använd AVIF som primärt format för bilder på webben, med WebP och JPEG som fallback för äldre enheter. Det ger bästa möjliga balans mellan bildkvalitet, filstorlek och kompatibilitet.

Sammanfattning

AVIF erbjuder betydligt bättre komprimering än JPEG, PNG och WebP, med stöd för moderna funktioner som HDR, transparens och brett färgomfång. Formatet stöds av alla stora webbläsare, operativsystem och CMS-plattformar, och det är öppet och royaltyfritt. För webbplatser som vill förbättra laddningstid, Core Web Vitals och användarupplevelse är AVIF det mest effektiva bildformatet att satsa på.

Vanliga frågor om AVIF

Vilka webbläsare stödjer AVIF?
Alla moderna webbläsare: Chrome (sedan version 85), Firefox (93), Safari (16) och Edge (121). Sammantaget täcker det drygt 93 % av alla webbläsare globalt.

Kan jag konvertera befintliga bilder till AVIF?
Ja. Du kan använda verktyg som Squoosh, ImageMagick eller libavif för enskilda filer eller masskonvertering. Photoshop, GIMP och Krita stödjer AVIF nativt.

Hur mycket mindre blir filerna jämfört med JPEG?
Typiskt 50–70 % mindre vid jämförbar visuell kvalitet. Exakta besparingar varierar beroende på bildens innehåll och komprimeringsinställningar.

Stöder AVIF transparens?
Ja, AVIF har fullt stöd för alfa-kanaler, vilket gör det till ett bra alternativ för grafik, logotyper och bilder som behöver transparenta bakgrunder.

Behöver jag fortfarande en fallback?
Det rekommenderas. Även om stödet är brett finns det äldre enheter och nischwebbläsare som inte hanterar AVIF. Använd <picture>-elementet med WebP och JPEG som fallback för bästa kompatibilitet.

Kan jag använda AVIF i Joomla?
Ja. Joomla 5 har inbyggt stöd för AVIF i mediahanteraren. Se till att din server kör PHP 8.1 eller senare med GD-biblioteket kompilerat med AVIF-stöd, och att filtypen och MIME-typen (image/avif) är tillagda i mediainställningarna.

Organisationen bakom AV1-formaten heter Alliance for Open Media och har sin webbplats här: aomedia.org

Google har skrivit om AVIF här: web.dev/learn/images/avif

Hur kan vi på Webbproffs hjälpa er med AVIF?

Vi kan kontrollera om er server har rätt konfiguration för AVIF – det vill säga PHP 8.1+ med GD-biblioteket eller ImageMagick kompilerat med AVIF-stöd. Vi hjälper er även att komma igång med export av bilder till AVIF i Photoshop eller GIMP, och vi kan analysera er webbplats för att identifiera hur mycket bandbredd och laddningstid ni kan spara genom att byta bildformat. Hör av er så berättar vi mer!

Läs mer om våra optimeringstjänster här