Facebookpixel

info@mediakurser.se | 08 406 00 30 | Drottningg 88D STHLM

08 406 00 30

Prenumerera på bloggen – få nya inlägg den 1:a varje månad!

Ansvarig utgivare
Richard Stenlund
richard@mediakurser.se

avif som filformat

AVIF och JXL – nya filformat i Photoshop

JPG har varit det mest populära bildformatet på webben i över 30 år, men den tiden är snart förbi. Man har gjort flera försök att ersätta JPG under åren, men ingen har riktigt lyckats. Alternativen antingen erbjudit för liten nytta eller inte haft tillräckligt stöd i olika webbläsare. Men nu har vi två alternativ till JPG som redan används på många webbplatser, WebP och AVIF. WebP har funnits ett tag i Photoshop och nu kan du även spara bilder i filformatet AVIF. Dessutom har det tillkommit ytterligare ett alternativ till JPG som heter JXL.

Vad är AVIF?

avif

AVIF, eller AV1 Image File Format, är ett modernt och royaltyfritt bildformat som är designat för att leverera överlägsen komprimering och bildkvalitet, särskilt för webbanvändning. Det bygger på den öppna videokodeken AV1, som utvecklats av Alliance for Open Media (AOMedia), en grupp som inkluderar teknikjättar som Google, Netflix och Microsoft.

AVIF är känt för sin förmåga att skapa betydligt mindre filstorlekar än äldre format som JPG, med bibehållen eller till och med förbättrad visuell kvalitet. Detta gör det idealiskt för att snabba upp laddningstider på webbplatser, vilket är avgörande för användarupplevelse och SEO.

Fördelar med AVIF:

  • Effektiv komprimering: AVIF överträffar ofta JPEG, WebP och till och med JXL när det gäller att uppnå små filstorlekar utan märkbar kvalitetsförlust.
  • Stöd för HDR och brett färgomfång: Precis som JXL hanterar AVIF High Dynamic Range (HDR) och ett brett färgomfång, vilket möjliggör mer levande och verklighetstrogna bilder.
  • Transparens (Alpha-kanal): AVIF stöder genomskinlighet, likt PNG, vilket gör det användbart för komplexa webblayouter och bilder som behöver smälta in i olika bakgrunder.
  • Animationer: Formatet kan också hantera bildsekvenser och animationer, vilket positionerar det som ett potentiellt alternativ till GIF och PNG, men med mycket effektivare komprimering.
eiffeltornet
AVIF 165 KB 1000 x 667 pixlar

Nackdelar med AVIF

AVIF kan visas i alla moderna webbläsare, men i lite äldre webbläsare är stödet för sociala medier begränsat för närvarande. Användning av mycket gamla enheter eller långsamma uppdateringar innebär att kompatibiliteten är något mindre än 95 % idag. Det är den största anledningen till att användningen är något begränsad.

Programvarorna i Affinity-sviten kan importera AVIF men inte ännu exportera. Capture One har inget stöd ännu och det går att få stöd i GIMP om du installerar libheif eller libavif. AVIF är inte ett idealiskt alternativ för stora utskrifter (begränsad upplösning, plattsättning kan utöka dessa gränser men riskerar potentiella kvalitetsproblem). 12-bitars är bra för en slutlig bild, men är inte idealiskt för efterföljande redigering.

Varför är AVIF viktigt?

AVIF vinner snabbt mark på webben tack vare sitt fokus på prestanda och kvalitet. Trots att det kan vara mer beräkningskrävande att koda än vissa andra format, gör de resulterande små filstorlekarna det till ett attraktivt val för att optimera webbplatser. Webbläsarstödet har vuxit avsevärt de senaste åren, vilket bidrar till dess ökande popularitet.

Vad är JXL

JXL

JXL, eller JPEG XL, är ett modernt och royaltyfritt bildformat som är designat för att vara nästa generations standard för bilder på webben och inom professionell fotografering. Det utvecklas som en efterföljare till JPEG och siktar på att erbjuda överlägsen kvalitet och mindre filstorlekar.

JXL har en rad fördelar som gör det intressant. En av de främsta är dess överlägsna komprimering, vilket resulterar i betydligt mindre filer jämfört med JPEG, WebP och AVIF, ofta utan synlig kvalitetsförlust. Detta är avgörande för att snabba upp webbplatser och minska bandbreddsförbrukningen. Formatet stöder både förlustfri och förlustbelastad komprimering, vilket ger flexibilitet för olika användningsområden – från arkivering till webbpublicering.

En stor fördel är bakåtkompatibiliteten med JPEG. JXL kan omkoda befintliga JPEG-filer till ett mindre JXL-format utan att förlora någon information från original-JPEG:en. När filen avkodas får du exakt samma bild tillbaka som den ursprungliga JPEG:en.

JXL är idealisk för utskrift/efterföljande redigering tack vare nästan obegränsad upplösning och 32-bitars stöd. Har utmärkt stöd i Adobe-programvara (inklusive 8-32-bitars exporter från PS v26.8 beta). JXL är royaltyfritt och stödet ökar snabbt. Stöder kodning av färgdata i kodströmmen för att minska filstorleken jämfört med att bädda in en fullständig ICC-profil.

Inget stöd i InDesign och WordPress

Men trots att JXL är ett format som är idealist för tryck så har tyvärr inte Adobe InDesign inbyggt stöd för filformatet JXL (JPEG XL) för direkt montering eller export.

Medan JPEG XL är ett modernt och effektivt bildformat som erbjuder bra komprimering och funktioner som HDR och transparens, är stödet för det fortfarande under utveckling och inte fullständigt implementerat i alla program, inklusive InDesign.

Andra Adobe-produkter som Photoshop (version 26.8 och framåt) och Lightroom/Camera Raw stöder JXL, men det gäller ännu inte för InDesign.

Om du har JXL-filer som du behöver använda i InDesign, måste du för närvarande konvertera dem till ett mer traditionellt format som stöds av InDesign, till exempel JPEG, PNG, TIFF eller PSD. Men vi som använder InDesign får hoppas att programmet i framtiden får stöd för JXL så att vi som gör trycksaker även kan dra nytta av det här nya filformatet.

En annan nackdel med JXL i dagsläget är avsaknaden av stöd i olika webbläsare och CMS. I dagsläget är inte JXL kompatibelt med t.ex. WordPress. Men förhoppningsvis kan det tillkomma i framtiden.

Framtiden för JXL

Utöver detta stöder JXL funktioner som HDR (High Dynamic Range), brett färgomfång, transparens (alpha-kanal) och även enkla animationer. Det är också utformat för att vara snabbt att både koda och avkoda, vilket är viktigt för prestanda. Även om stödet inte är fullständigt implementerat i alla webbläsare och programvaror ännu, ses JXL som en stark kandidat att bli ett dominerande bildformat i framtiden.

london bridge
JXL – 104kb 1000×667 px

Vad är WebP

webp

WebP är ett bildformat utvecklat av Google, lanserat 2010, med målet att optimera bilder för webben. Dess främsta syfte är att minska filstorleken utan att kompromissa med bildkvaliteten, vilket leder till snabbare laddningstider för webbsidor.

Stöds i stor utsträckning på webben (av alla moderna webbläsare). Formatet använder både förlustfri (lossless) och förlustbelastad (lossy) komprimering. Förlustbelastad komprimering i WebP kan ofta uppnå upp till 30% mindre filstorlekar jämfört med JPEG, med likvärdig upplevd kvalitet. Vid förlustfri komprimering är filerna typiskt mindre än PNG-filer.

En viktig fördel med WebP är dess stöd för transparens (alpha-kanal), vilket gör det till ett flexibelt alternativ till både JPEG och PNG. Det kan hantera bilder med genomskinliga bakgrunder, vilket är idealiskt för ikoner, logotyper och andra grafiska element på webben. Dessutom stöder WebP animationer, vilket gör det till en potentiell ersättare för GIF, men med mycket effektivare komprimering. WebP har också snabbare kodningshastighet än AVIF vilket gör formatet attraktivt för webbplatser som bearbetar med ett mycket stort antal bilder.

Liksom JPG är den begränsad till 8-bitars djup och saknar stöd för transparens. Inget stöd för HDR (varken inbyggt eller med en förstärkningskarta) och precis som med AVIF saknas stöd i vissa äldra webbläsare. Stödet är dock något större än AVIF.

känguru
WebP – 71kb 1000 x 616 px

Användning och framtid för WebP

WebP har fått brett stöd i moderna webbläsare som Chrome, Firefox, Edge och Safari, vilket har bidragit till dess utbredda användning. Trots att nyare format som AVIF och JXL har dykt upp, är WebP fortfarande ett mycket relevant och populärt val för webbutvecklare som vill optimera bildprestanda på sina webbplatser. Det har bevisat sig vara en effektiv lösning för att förbättra webbplatsers hastighet och användarupplevelse.

JPG – en gammal trotjänare

jpg

JPG är det mest stödda bildformatet för webben (100 % kompatibelt). Sedan det lanserades på 90-talet har det varit standarden för att dela bilder på webben, via e-post och i de flesta digitala kameror. Dess popularitet grundar sig i dess förmåga att drastiskt minska filstorleken genom förlustbelastad (lossy) komprimering, vilket gör det snabbt att ladda och enkelt att lagra. Det erbjuder ett säkert och kompatibelt sätt att dela HDR i hög kvalitet idag (när du använder en förstärkningskarta). Det kommer sannolikt att ersättas av AVIF-förstärkningskartor i framtiden när stödet växer, men är till stor hjälp idag. JPG accepteras med alla sociala medier för uppladdningar. Brett stöd för smarta telefoner/sms.

pyramider
JPG/JPEG – 478 kb 1000×514 px

Vad är JPG:s begränsningar?

Trots sin utbredda användning har JPG flera begränsningar som blir allt tydligare i dagens högupplösta och bandbreddskrävande värld.

  • Filerna är mycket större än nyare alternativ.
  • Kvalitetsförlust vid komprimering: Eftersom JPG använder förlustbelastad komprimering, försvinner en del bilddata permanent varje gång du sparar en bild. Detta kan leda till synliga artefakter som “blockighet” eller färggradienter, särskilt vid hög komprimering eller efter upprepad redigering och resparning.
  • Ingen transparens: JPG stöder inte transparenta bakgrunder (alpha-kanal), vilket är en stor nackdel för webbgrafik, logotyper eller bilder som behöver smälta in sömlöst i olika designlayouter.
  • Ingen animation: JPG är endast för stillbilder och kan inte användas för animationer, till skillnad från GIF, WebP eller AVIF.
  • Begränsad färgdjup: Traditionell JPG stöder bara 8-bitars färgdjup, vilket kan vara otillräckligt för modern HDR-fotografering (High Dynamic Range) och skärmar som kan visa ett mycket bredare färgomfång.
  • Ej lämpligt för grafik med skarpa kanter: För bilder med text, linjer eller skarpa kontraster (som ikoner eller diagram) kan JPG:s komprimering leda till suddighet och oönskade artefakter.

Framtiden för JPG-formatet

Trots sina begränsningar kommer JPG sannolikt att leva kvar under lång tid framöver på grund av dess universella kompatibilitet. Nästan varje enhet, programvara och webbplats kan öppna och visa JPG-filer utan problem. Detta enorma etablerade ekosystem gör det svårt för nya format att helt ersätta det över en natt.

Däremot kommer JPG:s dominans att minska. De nya formaten som WebP, AVIF och JXL (JPEG XL) är designade för att övervinna JPG:s brister. De erbjuder betydligt bättre komprimeringsförhållanden, vilket resulterar i mindre filstorlekar med bibehållen eller till och med förbättrad kvalitet. Dessutom stöder de funktioner som transparens, HDR och animationer som JPG saknar.

Det populära PNG-formatet

png

PNG, eller Portable Network Graphics, är ett rasterbildformat som kom till som en förbättring av GIF. Dess mest framträdande egenskap är förmågan att hantera transparens (alpha-kanal) på ett mycket effektivt sätt. Det gör det idealiskt för grafik, logotyper och bilder som behöver integreras sömlöst på olika bakgrunder.

PNG använder förlustfri komprimering. Det innebär att ingen bilddata går förlorad när du sparar filen. Det garanterar hög bildkvalitet, särskilt för grafik med skarpa linjer och text. Dock leder den förlustfria komprimeringen till väldigt stora filstorlekar jämfört med förlustkomprimerande format som JPG eller WebP, vilket påverkar laddningstider på webben. PNG stöder inte heller animationer. Troligen är PNG det format som först blir ersatt av de nya filformaten?

island
PNG – 2 Mb 1000×1000 px

Jämförelser AVIF, WebP, JXL och JPG

Bilderna är sparade i Photoshop. JPG är komprimerade i kvalitet 10. WebP är komprimerad i kvalitet 90, AVIF är komprimerad i kvalitet 75 (snabb komprimering, vilket ger något större filstorlekar) och JXL (ännu ej kompatibelt med WordPress) är komprimerat i kvalitet 75.





Som vi ser i de olika bildexemplen ger både AVIF, WebP och JXL betydligt mindre filstorlekar än JPG till en inte synbar kvalitetsförsämring. Något om överraskande mig något var att WebP står sig så bra i jämförelse med AVIF och JXL. Jag hade förväntat mig att de två nyare filformaten skulle ge betydligt mindre filstorlekar än WebP, men det var inte fallet med alla bildexempel. Däremot tycker jag mig kunna ana en lite högre bildkvalitet med AVIF-bilderna.

Så sparar du som AVIF

I Photoshop sparar du dina AVIF-bilder under Arkiv >> Spara som. Kan du inte se det alternativet kan du testa att klicka på knappen Skapa kopia i fönstret där du väljer var du ska spara din bild.

spara som avif

När du sparar har du en del alternativ att ta ställning till. Högst upp väljer du Färgkomprimering. Välj Icke förstörande om du vill bevara genomskinlighet i en bild. Alltså det som tidigare motsvarat PNG-filer. Ingen bilddata går förlorad, men filstorlekarna blir betydligt högre.

Förstörande innebär att bilden komprimeras. AVIF använder de avancerade komprimeringsalgoritmerna från AV1-videokodeken. Detta är det vanligaste sättet att använda AVIF för att uppnå små filstorlekar. Viss bildinformation kastas bort under komprimeringen, men AVIF är utformad för att minimera synlig kvalitetsförlust, ofta bättre än JPEG och WebP vid samma filstorlek.

Färgföljsamhet innebär att bilden bibehåller sina ursprungliga färger så korrekt som möjligt genom komprimeringsprocessen. Till skillnad från äldre format som JPEG, kan AVIF hantera färger utanför det traditionella sRGB-färgomfånget. Det stöder profiler som Display P3 och BT.2020, vilka kan representera betydligt fler färger. Detta är avgörande för att visa bilder med levande och korrekta nyanser på moderna skärmar som stöder dessa bredare gamuts. AVIF kan lagra bilder med ett högre bitdjup, ofta 10 eller 12 bitar per färgkanal, jämfört med JPG:s standard på 8 bitar. Ett högre bitdjup möjliggör en större mängd färgtoner och nyanser, vilket minskar risken för “banding” (synliga färgband) och säkerställer mjukare färggradienter. Detta är särskilt viktigt för att undvika posterisering i områden med små färgskillnader, som en blå himmel.

spara som avif

Sammanfattning – AVIF och JXL i Photoshop

JPG är den äldsta standarden, känd för små filer via förlustbelastad komprimering men saknar transparens och kan förlora kvalitet. WebP är Googles uppgradering med mindre filer, transparens och animationer, nu med brett stöd. AVIF erbjuder ännu bättre komprimering, HDR och brett färgomfång, men är nyare. JXL är det mest avancerade framtidsformatet med överlägsen komprimering, fullt HDR-stöd och unik bakåtkompatibilitet med JPG. Val av format beror på prioriteringar som filstorlek, kvalitet och kompatibilitet.

>> Skaffa Photoshop med Creative Cloud

WordPress 6.9

WordPress 6.9 är här

Då är det dags för ytterligare en så kallad ”stor” uppdatering av WordPress. WordPress 6.9 är årets andra stora WordPress-uppdatering. WordPress 6.9 har kodnamnet “Gene”

Läs mer »