AVIF - modernt bildformat för webbplatser.

Bildformat AVIF för webbplatser ökar SEO, PageSpeed & användarupplevelse.

Matthias Petri
publicerad:

Mindre än 0,1 procent av alla webbplatser använder AVIF-formatet och drar nytta av det bästa sättet för bildformat att mäta en förbättring av webbplatsens hastighet, användarupplevelse och online-synlighet på Google. Alla andra webbplatsägare utnyttjar ännu inte det potential som AVIF som bildformat erbjuder. Denna artikel är tänkt att hjälpa till och uppmuntra dig att seriöst överväga att använda AVIF-formatet och helst även använda det för bilderna på din webbplats.

Har du någonsin testat URL:en för din webbplats på Google PageSpeed Insights för att se hur din prestanda är? Om inte, testa det direkt med din egen webbplats.

Tar jag rätt, visas den här siffran tyvärr inte ännu på din webbplats, eller hur?

PageSpeed-Insights-resultat för TutKit - Desktop

Ju lägre din siffra är, desto mer optimeringsarbete behöver din webbplats för att förbättra din PageSpeed. Om du vecklar ut rekommendationerna för att förbättra din PageSpeed från Google längre ner på testverktygssidan, kan det mycket väl vara så att ett av punkterna inkluderar moderna bildformat – och det är om du fortfarande använder JPG- eller PNG-filformat för dina bilder.

PageSpeed-Insights rekommenderar användningen av AVIF.

Det här är en av flera anledningar till varför du ännu inte uppnår toppresultat med din webbplats på PageSpeed Insights och förmodligen inte klarar Core Web Vitals heller.

Både bilderna på vår byråwebbplats 4eck-media.de och här på TutKit.com laddas i AVIF-filformat – supersnabbt, superfint i en övertygande kvalitet. Och AVIF hjälper oss att uppnå en så hög PageSpeed som möjligt.

Det relativt nya filformatet för webbbilder är knappt känt av någon, varför det är dags att här introducera det moderna bildformatet AVIF för webbplatser med alla dess fördelar för SEO, PageSpeed och användarupplevelse.

Innehållsförteckningen för AVIF-artikeln:

    Vad är AVIF-bildformatet?

    AVIF är ett nytt bildformat som lanserades år 2020 av Alliance for Open Media (AOMedia). Formatet bygger på förlustfri komprimeringsalgoritmen AV1 och erbjuder ett antal fördelar jämfört med andra vanliga bildformat som JPEG och PNG samt webbformatet WebP.

    AVIF-bilder är betydligt mindre än JPEG-bilder med samma bildkvalitet. Det beror på att AV1 erbjuder en betydligt effektivare komprimering. Så en AVIF-bild kan vara upp till 50 % mindre än en JPEG-bild med samma bildkvalitet.

    AVIF-bilder erbjuder även en högre färgdjup än JPEG-bilder. Så AVIF-bilder kan spara upp till 12-bitars färgdjup medan JPEG-bilder bara stöder 8-bitars färgdjup. Detta leder till en större färgomfång och mer realistiska färger i AVIF-bilder.

    Dessutom kan AVIF-bilder spara alfa-kanaler. Alfa-kanaler används för att definiera transparensen i bilder. Detta gör AVIF-bilder idealiska för användning i grafiska applikationer där transparens krävs.

    AVIF är ett öppet format och stöds av många program- och hårdvaruleverantörer. De flesta vanliga bildredigeringsprogram och webbläsare stöder redan AVIF-bilder. Just därför är det dags att detta moderna bildformat får fäste!

    Följande är några av fördelarna med AVIF jämfört med andra vanliga bildformat:

    • Bättre kompressionsförhållanden: AVIF-bilder är betydligt mindre än JPEG- och PNG-bilder med samma bildkvalitet.
    • Högre färgdjup: AVIF-bilder stödjer upp till 12-bitars färgdjup, medan JPEG- och PNG-bilder bara stöder 8-bitars färgdjup.
    • Stöd för alfa-kanaler: AVIF-bilder kan spara transparens, vilket ersätter behovet av PNG- eller WebP-bilder som fortfarande används på webbplatser idag.
    • Öppet källkodsformat: AVIF är ett öppet källkodsformat och stöds av många program- och hårdvaruleverantörer.
    • AVIF är ett övertygande bildformat för webbplatser som erbjuder många fördelar jämfört med andra vanliga format (inklusive WEBP).

    Det är lätt att förutse att AVIF kommer spela en allt större roll i lagring och visning av bilder på webbplatser i framtiden – inte minst eftersom Google direkt har inkluderat användningen av det i rekommendationerna i PageSpeed Insights-resultaten och nu stöder alla vanliga webbläsare det i de senaste versionerna.

    Därför lönar det sig att vara tidigt ute med att integrera det i din egen webbplats för att redan nu dra nytta av fördelarna för SEO, PageSpeed och användarupplevelse.

    Varför ger AVIF fördelar för SEO, PageSpeed och användarupplevelse?

    Den största fördelen blir synligast när vi jämför bilderna i vyn. Som exempel har jag genererat en bild på Midjourney av en stimma clowndoktorfiskar i upplösningen 1024x1024 i PNG-format.

    • Original-PNG: 1,43 MB
    • Optimerad via TinyPNG: 393 KB - sparade 73 %

    Den ursprungliga PNG-filen lät jag sedan konverteras via squoosh.app med resultatet:

    • Optimerat via Squoosh som WebP: 84 kb - sparade 94 procent
    • Optimerad via Squoosh som AVIF: 42 kb - sparade 97 procent
    Komprimeringsjämförelse WebP och AVIF via Squoosh

    I resultatet är AVIF-bilden vid samma optiska kvalitet bara hälften så stor som WebP-bilden. I många andra tester har det visat sig att kompressionsartefakter, som syns vid för hög kompression av JPG-filer, bara blir lätt synliga när kvaliteten sjunker under 30 mot 20 eller lägre. Vid kvalitet 30 förblir till och med textdelar i pixmapsgarafik skarpa utan kompressionsartefakter.

    De här besparingarna på bildtunga webbplatser kan inte värderas tillräckligt högt.

    AVIF för bättre SEO-värden, PageSpeed och användarupplevelse

    Google har redan 2021 gjort en webbplats vitala kärnvärden (Core Web Vitals) till en rankningsfaktor. Dessa inkluderar till exempel sidans laddningstid, det värde som visar hur fort huvudinnehållet laddas för din användare. Google anger tider upp till 2,5 sekunder som en bra värde som webbplatser bör sträva efter för sina användare.

    Större bildfiler orsakar längre laddningstider. Core Web Vitals anses då inte uppfyllda.

    Dessutom finns det en annan potentiell problem. Om större bildfiler, som till exempel baseras på PNG eller JPEG, placeras på webbplatsen, kan det hända att textinnehållet redan har laddats medan en bild laddas långsammare. Det kan då uppstå så kallade kumulativa layoutskiften, små förskjutningar som med visningen av en bild pressar ned de nedre delarna av webbplatsen, där de för övrigt hör hemma. Google ogillar sådana kumulativa layoutskiften och markerar dem som CLS-fel, vilket leder till att Core Web Vitals heller inte anses uppfyllda.

    Dessutom känns det helt enkelt fantastiskt för varje besökare på webbplatsen när sidorna är snabba och innehållet visas genast vid klick. Dessutom kan du placera bilder av bättre kvalitet på webbplatsen utan att komprimera dem så mycket att kompressionsartefakter syns. Filstorleken förblir även vid förlustfri konvertering eller vanlig kompression trevligt liten jämfört med PNG eller JPEG. AVIF-formatet höjer därmed användarupplevelsen från flera aspekter för varje användare. Google tvingar oss således med kraven på Core Web Vitals att göra något för våra besökare så att de inte blir frustrerade under besöket på vår webbplats.

    På detta sätt kan du bidra till förbättringen av användarupplevelsen, PageSpeed och den tekniska kvaliteten på din webbplats, vilket i sin tur kommer att påverka din synlighet online positivt.

    Browserstöd för AVIF-bilder

    Särskilt när det gäller helt nya tekniker är varje webbplatsägare något tveksam och väntar gärna några månader. Å ena sidan vill man inte vara betatestare för stora utgåvor av e-handelssystem eller CMS, å andra sidan finns det aldrig några garantier för att det inte kan finnas problem med vissa webbläsare eller enheter.

    Vid AVIF-bildformatet är det faktiskt avgörande om de vanligaste webbläsarna nu stödjer formatet. Webbplatsen caniuse.com ger dig information om detta: https://caniuse.com/avif

    AVIF-stöd från webbläsare
    Screenshot: https://caniuse.com/avif

    Nästan 85 procent av den globala webbläsarantalet stöder redan AVIF. I Tyskland är det med data från den 2 september alltid 80,33 % … tja, Tyskland haltar fortfarande efter när det gäller mobilnätet och vissa regioner lider fortfarande av långsamt internet (inklusive min egen region: medan jag på kontoret har gigabit hastighet, har jag bara 9 Mbit/sec hemma när jag jobbar).

    Du ser alltså att AVIF redan stöds i de mest använda webbläsarna sedan en tid tillbaka.

    Hur många webbplatser använder redan AVIF-formatet?

    Precis som kaniuse.com ger w3tech.com statistik om användningen av olika tekniker. Så även för använda bildformat på webbplatser.

    AVIF-användning på webbplatser.
    Screenshots från https://w3techs.com/

    Procentandel av alla webbplatser som använder (med data från september 2023):

    • PNG: 82,1%
    • JPEG: 78 %
    • SVG: 55,2 %
    • GIF: 21,7 %
    • WebP: 9,2 %
    • ICO och BMP: vardera 0,2 %
    • AVIF: 0,1 % (avrundat)

    Så för närvarande använder mindre än 0,07 procent av alla webbplatser AVIF-formatet. Whaaat? Det är ju skrattretande lite. Men hej, det är en chans för dig att bli spjutspets för användningen av moderna bildformat. På kurvan i bilden till höger blir det redan tydligt att användningen ökar månad för månad ... fortfarande i promilleområdet. Det kommer säkert att accelerera snart.

    Intressant nog följer inte ens 10 procent av alla webbplatser Googles rekommendationer för moderna webbaserade format. Alla andra gör avkall på PageSpeed och användarupplevelsen och klarar förmodligen inte heller Core Web Vitals, vilket negativt påverkar onlinesynligheten.

    AVIF vs. WebP - vad är bättre för din webbplats?

    Låt oss göra en direkt test för att förtydliga. Bilden till höger i head-området på TutKit.com hade före konvertering till AVIF som en PNG-fil över 600 KB på grund av transparensen.

    TutKit på huvudområdet.

    Den visas nu systemmässigt som en WebP-fil på 159 KB (vårt reservalternativ!). Även om den nu optimeras med verktyg som TINYPNG, som också kan minska WebP-filer, kommer den att ligga kvar på 128 KB. Ändå minskat med 20 procent.

    Som AVIF-fil, som standardvisas hos oss, har bilden nu bara 94 KB, vilket är bara 59 procent av storleken på WebP-reserven. I alla tester lyckades AVIF slå WebP-formatet i filstorlek vid samma visuella kvalitet.

    Vilka skäl talar för AVIF istället för WebP?

    • AVIF kan hantera transparens och bibehåller en bättre bildkvalitet vid högre kompression och mindre filstorlek.
    • Stödet är redan över 85 % för AVIF i alla vanliga webbläsare. Tendensen är stigande.
    • Din webbplats kommer att laddas ännu snabbare med AVIF jämfört med WebP. Speciellt på bildtunga webbplatser som onlinebutiker med kategorisidor, där det placeras många produktbilder, är detta en fördel. Likaså på webbplatser där bilderna måste visas högkvalitativt (portföljwebbplatser, referenser etc.), säkerställer du en hög visuell kvalitet med låg filstorlek.

    Det är också ett tecken på vad caniuse.com skriver direkt på WebP-sidan: "AVIF och JPEG XL är utformade för att ersätta WebP." AVIF och JPEG XL ska ersätta WebP. 

    WebP webbläsarstöd
    Screenshot: https://caniuse.com/webp

    Innan du funderar på om du kan satsa fel på AVIF eftersom JPEG XL också verkar vara med i loppet, kan jag lugna dig direkt. Webbläsarkompatibiliteten med JPEG XL är praktiskt taget obefintlig med endast 0,08 procent.

    JPEG-XL webbläsarstöd
    Screenshot: https://caniuse.com/jpegxl

    I Squoosh kan du redan konvertera bilder till JPEG XL och det visar "bara" liknande värden som WebP (se bilden längre ner). 

    AVIF är och förblir vinnaren när det gäller format. Satsa snabbt på det och dra nytta av alla fördelar även för dina webbplatser!

    Squoosh.app - det bästa verktyget för konvertering från JPG, PNG, WebP till AVIF

    Medan vi tidigare i teamet använde TinyJPG respektive TinyPNG som onlineverktyg för att optimera JPG-, PNG- eller även WebP-filer för användning på webbplatser, är jag nu en stor fan av Squoosh från Googles hus. 

    Squoosh är en kostnadsfri bildkonverterare utvecklad av Google. Verktyget fungerar som en onlinetjänst, men också lokalt på din dator eller server (node.js!). Det kan konvertera bilder till olika format, inklusive JPEG, PNG, GIF och WebP. Och det bästa av allt: det konverterar också dina bilder till AVIF-formatet.

    Squoosh.app - Bildkonverter från Google till AVIF

    Bildkonverteraren Squoosh använder en mängd olika tekniker för att minska bildstorleken utan att påverka kvaliteten. Det inkluderar komprimering av färginformation, minskning av upplösning och borttagning av redundant data.

    Dra bara bilden in och ställ in det önskade formatet. Några klick och din bild är färdigkonverterad och optimerad.

    Så här ser det ut när du lägger in en WebP-bild och sedan konverterar och komprimerar den en gång som AVIF (vänster) och en som JPEG XL (höger). Med skjutreglaget kan du också jämföra vilken kvalitetsnivå som är rätt så att den synliga kvaliteten bibehålls. I standardläge är en av sidorna alltid den ursprungliga filen för jämförelse. Så du har full kontroll över resultatet.

    Kompressionsjämförelse Squoosh
    I den direkta jämförelsen mellan AVIF och JPEG XL finns det återigen en tydlig vinnare: AVIF

    Använd även du Squoosh för att vårda ditt innehåll och webbutveckling, för att minska storleken på dina bilder tack vare moderna webbformat som WebP eller AVIF och för att förbättra laddningstiderna på dina webbplatser. Du kan även minska storleken på dina JPG-filer - liknande TinyJPG - om du till exempel vill ladda upp dem på sociala medier. Fördelen jämfört med TinyJPG är att du har full kontroll över komprimeringen och kan experimentera med olika optimeringsinställningar för att uppnå bästa kvalitet vid minsta möjliga storlek.

    Här är några fördelar med Squoosh:

    • Stödjer en mängd olika bildformat som kan konverteras 
    • Använder olika tekniker för att minska bildstorleken.
    • Möjliggör förhandsvisning av komprimerade bilder
    • Erabjder ett antal optimeringsinställningar
    • Verktyget är gratis och enkelt att använda.

    En liten nackdel med alla positiva egenskaper: För närvarande kan Squoosh endast bearbeta en bild åt gången och saknar stöd för batchbehandling. Jag hoppas att den här funktionen kommer snart.

    Batch-konvertering på serversidan i PHP-ramverk från bilder i JPG och PNG till AVIF och WebP

    Vi på TutKit.com konverterade våra bilder, som var inbäddade i portalen som JPG- och PNG-filer - totalt mer än 14 000 enskilda filer - till AVIF-format och som fallback för äldre webbläsare också till WebP-format. Vi har också tekniskt löst det så att våra redigerare fortsätter ladda upp bilder i JPG eller PNG, precis som våra designers är vana vid, och taggar dem med metadata i portalen. Systemet lägger automatiskt in AVIF och som fallback för alla äldre (eller icke-stödjer) webbläsare visas bilderna i WebP.

    För att kunna köra detta på serversidan, se till att använda de senaste programvaruversionerna. De nya funktionerna imagecreatefromavif och imageavif för AVIF-formatet är endast tillgängliga i PHP 8.1+ och om GD-tillägget har byggts med stöd för AVIF. Den kräver libavif version 0.8.2 eller senare.

    Se även till att vara uppmärksam på kompatibiliteten med operativsystemen. AVIF görs tillgängligt genom libavif-dev/libavif-devel-paketen i följande repositories:

    • från Ubuntu 21.04  
    • från Debian 11 
    • från Alpine 3.13 
    • från Fedora 34

    Här är en PageSpeed-utvärdering för den mobila versionen av TutKit.com. Medan det är relativt enkelt att uppnå en hög poäng över 90 på en stationär dator, är det verkligt utmanande för mobila enheter. Vi arbetar fortfarande på att förbättra poängen mot 100, eftersom vi vet att PageSpeed är bra för användarupplevelsen och därmed också påverkar våra SEO-framgångar.

    PageSpeed Insights för TutKit - mobil

    Vad som låter så enkelt med integreringen av AVIF här i vårt PHP-ramverk Laravel resulterade slutligen i över 60 ärenden i vår JIRA-plattform, som var relaterade till konvertering och integrering (inklusive forskning, utveckling, buggfixning, testning). Medan plugins kraftigt minskar arbetet i ett klassiskt CMS som WordPress, kan det vid omfattande individuell utveckling ibland ta upp till tre veckor, som det gjorde för oss. Fördelarna med att använda AVIF är definitivt värda det! 

    Förresten: Kanske kommer jag snart att skriva en artikel om varför vi på plattformar som TutKit.com föredrar att använda ett PHP-ramverk istället för WordPress eller andra CMS.

    Tillägg för användning av AVIF i WordPress

    CMS:et WordPress stödjer inte uppladdningen av AVIF-bilder som standard i september 2023 - till skillnad från CMS:et Contao, som har stött AVIF sedan version 5.0.0. Därför behöver du för närvarande göra två extra steg när du använder WordPress för att kunna använda dina bilder i AVIF-format.

    1. Etablera stöd för AVIF i WordPress
    2. Konvertera bilderna från JPG/PNG/WEBP till AVIF

    Det finns flera WordPress-tillägg som möjliggör användningen av AVIF-bilder på WordPress-webbplatser. Här är tre tillägg som du kan titta närmare på: 

    • AVIF Support: Detta tillägg gör det möjligt för dig att ladda upp och visa AVIF-bilder på WordPress-webbplatser. Det stödjer även automatisk konvertering av JPEG- och PNG-bilder till AVIF-bilder.
    • Converter for Media: Detta tillägg konverterar alla bilder i din WordPress-mediebibliotek till AVIF-bilder. Det erbjuder även flera alternativ för att anpassa bildkvaliteten och kompressionsgraden.
    • ShortPixel Image Optimizer: Detta tillägg optimerar bilder i ditt WordPress-mediebibliotek, inklusive konvertering till AVIF-bilder. Det erbjuder även flera andra funktioner för att förbättra bildkvaliteten och -prestandan.

    Dessa tillägg är ett bra sätt att dra nytta av fördelarna med AVIF-bilder på WordPress-webbplatser.

    AVIF-Support-Uploader som WordPress-tillägg

    Här hittar du AVIF Support-pluginet - just nu har den dock endast 1 956 nedladdningar och färre än 800 installationer - man ser att AVIF fortfarande är helt okänt för WordPress-användare.

    För närvarande körs 43,1 procent av alla webbplatser med CMS:et WordPress. Så snart WordPress stöder AVIF på systemnivå, kommer AVIF att slå igenom och skala ned JPG, PNG och även WebP från tronen. - Matthias Petri


    UPPDATERING 05.04.2024: Med WordPress 6,5 stödjer WordPress äntligen också AVIF! Därmed kommer supporttillägg bara behövas för äldre versioner av WordPress. Det är ännu mer värt att uppdatera till WordPress 6,5 och högre.

    Pluginet Local Image Sharp för Strapi-webbplatser

    Vi använder själva även AVIF på vår byråwebbplats 4eck-media.de, som använder node.js-baserade Strapi CMS. Local Image Sharp-pluginet för Strapi möjliggör användningen av AVIF-bilder på Strapi-webbplatser. Pluginet använder sharp-bildbehandlingsverktyget för att konvertera bilder till AVIF-bilder.

    Local Image Sharp-pluginet erbjuder en rad funktioner, inklusive:

    • Automatisk konvertering av bilder till AVIF-bilder
    • Anpassning av bildkvalitet och kompressionsgrad
    • Stöd för olika bildformat

    För att installera pluginet, ladda ner det från Strapi Plugin Store och installera det som vilket annat Strapi-plugin som helst.

    Lokal-Bild-Sharp på Strapi-Market

    Vi har konfigurerat det så att vi fortfarande laddar upp bilder som JPG eller PNG till Strapi-systemet. Systemet konverterar bilderna till AVIF och WEBP i sex olika upplösningar för att visa lämpliga bilder i webbläsaren som AVIF beroende på enhet (Stationär dator, Surfplatta, Mobil). För äldre webbläsare har vi även en reservlösning med WebP-bilder som då visas. 

    Använd helst <picture>-taggen, som då innehåller en <source>- och en <img>-tagg, för att visa dina bilder i rätt dimension och format med AVIF och WebP, med JPEG eller PNG som källa.

    Bilderna i moderna webbformat var tillsammans med cache en av de viktigaste påskyndarna av prestanda på vår byråwebbplats:

    PageSpeed Insights för 4eck-media - desktop

    OBS till Meta-thumbnails och strukturerade data

    Eftersom Google Bilder ännu inte stöder AVIF-formatet, anger vi fortfarande det associerade JPG-filen som Schema-Markup "image". Likaså meta-miniatyren som vi anger för varje produktsida för att erbjuda Google en förhandsvisning av Search-Snippetet innehåller fortfarande JPG-formatet.

    Bättre säker än ledsen. Det har redan rapporterats i forumen att någon har förlorat hela bildernas synlighet online efter att ha bytt till AVIF. Vi kan inte bekräfta denna erfarenhet. Synligheten online har förblivit konstant hos oss, men Crawling-förfrågningarna från Googlebot för bilder har ökat. Intressant nog ser vi att Googleboten kryper igenom WebP-bilderna, som finns som reservlösning i källkoden för äldre webbläsare. Google verkar för närvarande krypa igenom WebP-bilderna för att indexera dem.

    Därför skulle mitt råd vara att även fortsättningsvis använda JPG-källan i metadatan för miniatyrer och strukturerade data.

    Verktyg och programvara för bildredigering av AVIF-bilder

    Bilder redigeras ofta och gärna, därför är kompatibilitet med AVIF-formatet naturligtvis önskvärt med de vanliga bildredigeringsprogrammen. Ibland laddar du ner en befintlig bild från webbplatsen för att göra en förändring. Då är det bra om ditt favoritbildprogram kan öppna det, vilket är den viktigaste funktionen med AVIF-kompatibilitet. Även om det då sparas i ett annat format, kan det konverteras tillbaka till AVIF-formatet via Squoosh eller andra verktyg.

    Här är en lista över bildredigeringsprogram för AVIF-kompatibilitet (per september 2023):

    • Gimp: Kan importera, redigera och exportera AVIF sedan version 2.10.22.
    • Photopea: Kan importera och redigera AVIF, men inte exportera. Det går att spara i ett annat filformat.
    • Affinity Photo: Ingen support för AVIF
    • Photoshop: Ingen support, men ett plugin hjälper till att skapa kompatibilitet.

    AVIF-plugin för Photoshop

    Här hittar du ett plugin som gör det möjligt för dig att öppna AVIF-filer i Photoshop.
    https://github.com/0xC0000054/avif-format

    Det går att ladda ner från fliken Releases på sidan.

    När du har laddat ner ZIP-filen, lägg till Av1Image.8bi i mappen där Photoshop letar efter tillägg. Detta är standardmappen vid installation:
    C:\Program Files\Common Files\Adobe\Plug-ins\CC

    Eller denna mappen: C:\Program Files\Adobe\Photoshop [version]\Plug-ins

    Photoshop måste stängas. Starta sedan Photoshop så att insticksprogrammet kan laddas. Därefter kan du öppna AVIF-filer direkt via Dra & Släpp eller genom Öppna-dialogen i Photoshop.

    AVIF i Photoshop

    Visa AVIF-bilder i Windows

    När jag laddar ner bilder från webbplatsen för att redigera dem eller på annat sätt behöva dem, vill jag naturligtvis att filbläddaren ska kunna öppna och visa dem.

    Från Windows 10 fungerar det, men en förlängning krävs. Om du klickar på en AVIF-fil får du först ett felmeddelande. 

    AVIF-visningsfel på Windows

    I felmeddelandet finns en länk. Om du klickar på den tar det dig till Microsoft Store för AVIF-förlängningen. Ladda ned den. Den är endast 1,61 MB.

    AVIF-tillägg för Microsoft

    Efteråt kan du öppna och visa bilder i AVIF-format även under Windows i din filbläddare.

    AVIF-annons under Microsoft

    Istället för GIF-animationer, använd hellre AVIF-animationer på webbplatser

    Här finns en online-omvandlare för att konvertera GIF-animationer till AVIF-animationer. https://mconverter.eu/convert/gif/avif/

    Medan min test-GIF är 787 KB stor, minskar animationen som AVIF till 411 KB.

    Min personliga slutsats

    AVIF är enligt min åsikt det bästa alternativet för att för närvarande integrera moderna bildformat på webbplatser. Fördelarna med komprimering och bildkvalitet är övertygande. Inget annat bildformat kombinerar dessa egenskaper och ökar laddningstiderna så mycket. För närvarande använder alltför få webbplatsägare AVIF-formatet trots att webbläsarstödet är över 85 % och det inte är någon teknisk hinder att fortsätta använda WebP som reservlösning. SEO förändras. AVIF ensam räcker naturligtvis inte för att uppnå toppresultat i PageSpeed-Insights; också ytterligare tekniska faktorer behövs för det. När det gäller att integrera moderna bildformat kommer du att kunna uppnå bättre resultat med AVIF jämfört med WebP.

    Endast innehållsoptimerat för nyckelord kommer inte längre räcka, eftersom Internet översvämmas med innehåll genom AI, vilket får många webbplatser att konkurrera om online-synlighet med sina konkurrenter på en hög innehållsmässig nivå. Teknisk SEO och särskilt uppfyllandet av Core Web Vital blir därför allt mer en starkare rankingfaktor och därmed en Tie Breaker, eftersom Google vill erbjuda användarna bästa möjliga användarupplevelse. AVIF är - tillsammans med andra faktorer - en del av lösningen för att påskynda dina laddningstider, förbättra användarupplevelsen och perspektivisk förbättra online-synligheten.

    Lär dig mer om SEO, användarupplevelse, design och tekniska trender

    Om du grundläggande är intresserad av ämnen som SEO, användarupplevelse, AI-verktyg och nya webbteknologier, kan du lära dig mer i våra utbildningar och i ytterligare artiklar här på bloggen.

    1101,908,1094,1055,1096

    Nu är det din tur

    Om detta inlägg har varit värdefullt för dig, skriv gärna en recension på Google. Varje recension stöder oss. Om du behöver hjälp med att använda AVIF i ditt webbprojekt, kontakta oss gärna via vår byråsida.

    Publicerad den av Matthias Petri
    Publicerad den: Från Matthias Petri
    Matthias Petri grundade, tillsammans med sin bror Stefan Petri, företaget 4eck Media GmbH & Co. KG år 2010. Tillsammans med sitt team driver han den populära fackforumet PSD-Tutorials.de och e-lärandeportalen TutKit.com. Han har publicerat många träningsprogram för bildbehandling, marknadsföring och design och har undervisat som lärare vid FHM Rostock inom "Digital Marketing & Kommunikation". För sitt arbete har han blivit flera gånger belönad, inklusive med Specialpriset för webbplatsutmärkelsen i Mecklenburg-Vorpommern 2011 och som Kreativmacher Mecklenburg-Vorpommern 2015. Han blev utnämnd till Fellow av Kompetenscentrum för Kultur- och Kreativindustri i Tyskland 2016 och engagerar sig i Initiativet "Vi är öst" som entreprenör och vice vd tillsammans med många andra förespråkare med östeuropeisk härkomst.
    Tillbaka till översikten