AVIF - sodoben slikovni format za spletne strani

AVIF format slike za spletne strani izboljšuje SEO, PageSpeed in uporabniško izkušnjo.

Matthias Petri
objavljeno:

Manj kot 0,1 odstotka vseh spletnih mest uporablja AVIF format in izkorišča najboljšo možnost za merljivo izboljšanje hitrosti spletnega mesta, uporabniške izkušnje in online vidnosti v Googlu. Vsi drugi upravitelji spletnih mest še ne izkoriščajo potenciala, ki ga ponuja AVIF kot format slike. Ta članek naj bi pomagal in te spodbudil, da se resno lotiš AVIF formata in ga ind po možnosti uporabljaš za slike na svoji spletni strani.

Si že kdaj preizkusil URL svoje spletne strani na Google PageSpeed Insights, kako je z učinkovitostjo? Če ne, to enkrat naredi direktno s svojo spletno stranjo.

Domnevam, da ti ta rezultat trenutno še ni prikazan za tvojo spletno stran, kajne?

Rezultat PageSpeed Insights za TutKit - Namizje

Bolj ko je tvoj rezultat nizek, več optimizacije potrebuje tvoje spletno mesto, da izboljšaš svojo PageSpeed oceno. Če pogledaš še nekoliko nižje na strani orodja za testiranje, lahko odkriješ priporočila Googla za izboljšanje tvoje PageSpeed ocene, pri čemer je mogoče, da bo ena točka vključevala sodobne formate slik - in sicer takrat, ko še vedno uporabljaš JPG ali PNG formate za svoje slike.

PageSpeed-Insights priporoča uporabo AVIF.

To je eden od več razlogov, zakaj s PageSpeed Insights še nisi dosegel najvišjih rezultatov z svojo spletno stranjo in verjetno tudi ne uspeš testiranja Core Web Vitalsov.

Tako slike na našem spletnem mestu agencije 4eck-media.de kot tudi tukaj na TutKit.com samem se nalagajo v formatu AVIF - izjemno hitro, v majhnem obsegu z navdušujočo kakovostjo. In AVIF nam pomaga, da dosežemo čim višjo PageSpeed oceno.

Relativno nov format slik za spletne strani skorajda ne pozna nihče, zato je čas, da tukaj predstavimo moderen format slike AVIF za spletne strani s vsemi njegovimi koristmi za SEO, PageSpeed in uporabniško izkušnjo.

Vsebina članka za AVIF:

    Kaj je AVIF format slike?

    AVIF je nov format slike, ki je bil leta 2020 objavljen s strani Alliance for Open Media (AOMedia). Format temelji na izgubni kompresijski algoritmu AV1 in ponuja vrsto prednosti pred drugimi pogostimi formati slik, kot sta JPEG in PNG ter spletni format WebP.

    Slike AVIF so občutno manjše od slik v formatu JPEG pri enaki kakovosti slike. To je posledica dejstva, da AV1 ponuja precej bolj učinkovito kompresijo. Zato lahko slika AVIF pri enaki kakovosti slike kot slika JPEG pogosto zasede do 50 % manj prostora.

    Slike AVIF prav tako omogočajo večjo globino barv kot slike v formatu JPEG. Slike AVIF lahko shranijo do 12-bitno barvno globino, medtem ko slike JPEG podpirajo samo 8-bitno barvno globino. To vodi v večjo barvno globino in realistične barve v slikah AVIF.

    Poleg tega so slike AVIF sposobne shranjevanja alfa kanalov. Alfa kanali se uporabljajo za določanje transparentnosti slik. S tem so slike AVIF idealne za uporabo v grafičnih aplikacijah, kjer je potrebna transparentnost.

    AVIF je odprtokoden format in ga podpira širok nabor ponudnikov programske opreme in strojne opreme. Večina priljubljenih programov za obdelavo slik in brskalnikov že podpira slike AVIF. Zato je že skrajni čas, da se ta sodoben format slike uveljavi!

    Tukaj je nekaj prednosti AVIF glede na druge pogoste formate slik:

    • Boljše kompresijsko razmerje: Slike AVIF so občutno manjše od slik v formatih JPEG in PNG pri enaki kakovosti slike.
    • Večja globina barv: Slike AVIF podpirajo do 12-bitno barvno globino, medtem ko slike v formatih JPEG in PNG podpirajo samo 8-bitno barvno globino.
    • Podpora za alfa kanale: Slike AVIF lahko shranjujejo transparentnost, kar pomeni, da odpravljajo potrebo po slika v formatih PNG ali pa tudi WebP na spletnih straneh.
    • Odprtokoden format: AVIF je odprtokoden format in ga podpira širok nabor ponudnikov programske opreme in strojne opreme.
    • AVIF je prepričljiv format slike za spletne strani, ki nudi številne prednosti pred drugimi pogostimi formati (vključno z WEBP).

    Pričakovati je, da bo AVIF v prihodnosti igral vse večjo vlogo pri shranjevanju in prikazu slik na spletnih straneh - tudi zato, ker je Google vključil uporabo tega formata v priporočila rezultatov PageSpeed Insights in trenutno vsi priljubljeni brskalniki v svojih novejših različicah podpirajo AVIF. 

    Zato se splača zgodaj vključiti ta format v svojo spletno stran, da že zdaj izkoristite prednosti za SEO, PageSpeed in uporabniško izkušnjo.

    Zakaj prinaša AVIF prednosti za SEO, PageSpeed in uporabniško izkušnjo?

    Največjo prednost bo najbolj vidna, če primerjamo slike v pogledu. Kot primer sem generiral sliko prek Midjourney podjetja z jato klovnskih rib v ločljivosti 1024x1024 v formatu PNG.

    • Original-PNG: 1,43 MB
    • Optimirano preko TinyPNG: 393 KB - prihranek 73 %
    Izboljšanje PNG slike prek TinyJPG.

    Originalno PNG datoteko sem nato konvertiral preko squoosh.app z naslednjim rezultatom:

    • Optimirano preko Squoosh kot WebP: 84 kb - prihranek 94 %
    • Optimirano preko Squoosh kot AVIF: 42 kb - prihranek 97 %
    Primerjava stiskanja WebP in AVIF prek Squoosh-a.

    V rezultatu je AVIF slika ob enaki vizualni kakovosti le pol manjša od WebP slike. V mnogih drugih testih se je pokazalo, da se kompresijski artefakti, kot se pojavljajo pri prekomerni kompresiji JPG datotek, začnejo opazno kazati šele, ko kakovost pade pod 30 proti 20 ali nižje. Pri kakovosti 30 ostanejo celo tekstualni elementi v slikah s piksli lepo ostro definirani brez kompresijskih artefaktov.

    Takšne prihranke pri spletnih mestih s slikami je treba visoko ceniti.

    AVIF za boljše SEO vrednosti, PageSpeed in uporabniško izkušnjo

    Google je že leta 2021 postavil vitalne jedrne vrednosti (Core Web Vitals) spletnega mesta kot faktor rangiranja. Sem spada na primer hitrost nalaganja, to je vrednost, kako hitro se glavna vsebina naloži za vašega uporabnika. Google navaja čase do 2,5 sekunde kot dobro vrednost, ki jo morajo lastniki spletnih mest zasledovati za svoje uporabnike.

    Večji slikovni podatki povzročajo daljše čase nalaganja. Jedrne spletne vrednosti se v tem primeru štejejo kot neuspešne.

    Poleg tega se pojavi druga težava. Če so večji slikovni podatki, ki temeljijo na PNG ali JPEG, na spletnem mestu, se lahko zgodi, da je besedilna vsebina že naložena, medtem ko se slika počasneje naloži. Posledično lahko pride do t. i. kumulativnih sprememb postavitve, torej majhnih premikov, ki s prikazom slike potisnejo spodnje dele spletnega mesta navzdol, kamor tudi spadajo. Takšni kumulativni premiki postavitve niso po godu Googlu in jih označuje kot napake CLS, kar pripelje do neuspeha jedrnih spletnih vrednosti. Poleg tega je za vsakega obiskovalca spletnega mesta super, če se strani hitro nalagajo in se vsebine takoj prikažejo s klikom. Poleg tega lahko slike na spletnem mestu postavite v boljšo kakovost, brez da bi kompresijo potegnili tako daleč, da so že vidne kompresijske artefakte. Velikost datoteke ostane majhna tudi pri brezizgubnem pretvorjanju ali običajni kompresiji v primerjavi s PNG ali JPEG. AVIF format na več načinov poveča uporabniško izkušnjo za vsakega uporabnika. Google nas s prehodom jedrnih spletnih vrednosti prisili, da naredimo nekaj za naše obiskovalce, da ne bi bili razočarani ob obisku naše spletne strani.

    S tem lahko prispevate k izboljšanju uporabniške izkušnje, hitrosti strani in tehnične kakovosti vašega spletnega mesta, kar se bo pozitivno odrazilo na vaši spletni vidnosti.

    Podpora brskalnikov za AVIF slike

    Prav za nove tehnike se mnogi lastniki spletnih mest nekoliko zadržujejo in raje počakajo nekaj mesecev. Po eni strani nočejo postati beta testiralci velikih izdaj, kot sta spletni trgovinski sistem ali CMS, po drugi strani pa nikoli ni zagotovljeno, da ne bo težav s posameznimi brskalniki ali napravami.

    Pri AVIF slikovnem formatu je dejansko odločilno, ali najpogostejši brskalniki že podpirajo ta format. Spletna stran caniuse.com vam daje informacije o tem: https://caniuse.com/avif

    Podpora AVIF v brskalnikih
    Screenshot: https://caniuse.com/avif

    AVIF že podpira skoraj 85 % globalne uporabe brskalnikov. V Nemčiji je s podatkom iz 2. septembra že 80,33 % ... no, Nemčija pač, kjer so vrzeli v mobilnem omrežju še vedno del vsakdana in številne regije še vedno trpijo zaradi počasnega interneta (tudi moja regija: medtem ko sem v pisarni z Gigabitom, dobim doma le 9 MBit/s).

    Vidiš torej, da AVIF v najpomembnejših brskalnikih podpirajo že nekaj časa.

    Koliko spletnih mest že uporablja AVIF format?

    Podobno kot caniuse.com vam w3tech.com statistično nudi informacije o uporabi določenih tehnologij, vključno z uporabljenimi slikovnimi formati na spletnih mestih.

    Uporaba AVIF na spletnih straneh.
    Screenshots von https://w3techs.com/

    Odstotek vseh spletnih mest, ki uporabljajo (stanje september 2023): 

    • PNG: 82,1 %
    • JPEG: 78 %
    • SVG: 55,2 %
    • GIF: 21,7 %
    • WebP: 9,2 %
    • ICO in BMP: vsak 0,2 %
    • AVIF: 0,1 % (zaokroženo)

    Trenutno uporablja manj kot 0,07 odstotka vseh spletnih mest format AVIF. Kaj? To je še vedno smešno malo. Ampak hey, to je priložnost za vas, da postanete tehnološka kopja pri uporabi sodobnih slikovnih formatov. Na krivulji na desni slike je že jasno, da se uporaba povečuje iz meseca v mesec … še vedno v promilu. To se bo zagotovo kmalu pospešilo.

    Zanimivo je, da se manj kot 10 odstotkov vseh spletnih mest drži Googlovega priporočila za sodobne spletno formate. Vsi ostali delajo ustne pri PageSpeed in uporabniško izkušnjo ter verjetno ne izpolnjujejo temeljnih spletnih kazalcev, kar se negativno odraža na spletni vidljivosti.

    AVIF proti WebP - kaj je boljše za vaše spletno mesto?

    Pojdimo še enkrat na neposreden test za ilustracijo. Slika desno iz glave TutKit.com je pred konvertiranjem v AVIF imela 600 KB kot PNG datoteka zaradi prozornosti.

    TutKit v glavnem delu.

    Zdaj se prikazuje sistemsko kot WebP datoteka s 159 KB (naša rezervna rešitev!). Tudi če jo optimizirate s orodjem, kot je TINYPNG, ki lahko zmanjša tudi WebP datoteke, ostane pri 128 KB. Kljub temu, da je zmanjšan za 20 odstotkov.

    Kot AVIF datoteka, ki je privzeto prikazana pri nas, slika sedaj meri le še 94 KB, torej le nekaj več kot 59 odstotkov velikosti rezervne WebP datoteke. V vseh testih je AVIF uspel preseči WebP format glede na velikost datoteke pri enaki vizualni kakovosti.

    Zakaj se odločiti za AVIF namesto WebP?

    • AVIF lahko ohranja prosojnost in z večjo kompresijo ter manjšo velikostjo datoteke še vedno prinaša boljšo slikovno kakovost.
    • Podpora za AVIF je z dobrih 85 % že zagotovljena pri vseh priljubljenih brskalnikih. Trend je naraščajoč.
    • Vaše spletno mesto se bo hitreje naložilo z AVIF v primerjavi z WebP. To je še posebej prednostno pri spletnih mestih z veliko slikami, kot so spletni trgovinami z stranmi kategorij, kjer je postavljenih veliko slik izdelkov, pa tudi pri spletnih mestih, kjer morajo slike biti prikazane visoko kakovostno (spletni portfelji, referenca itd.), zagotovili boste visoko vizualno kakovost z manjšo datotečno velikostjo.

    Na spletni strani caniuse.com je zapisano, kar piše neposredno na strani za WebP: „AVIF in JPEG XL sta zasnovana za nadomestitev WebP.“ AVIF in JPEG XL naj bi nadomestila WebP. 

    Podpora za brskalnike WebP
    Screenshot: https://caniuse.com/webp

    Preden se vprašate, ali bi morda zapravljali svoj čas z AVIF, ker se zdi, da se JPEG XL prav tako udeležuje tekme, vas lahko pomirim. Združljivost brskalnikov z JPEG XL je praktično neobstoječa pri 0,08 odstotka.

    Podpora brskalnika za JPEG-XL
    Screenshot: https://caniuse.com/jpegxl

    V aplikaciji Squoosh lahko slike že pretvorite v format JPEG XL in ima "samo" podobne vrednosti kot WebP (glej sliko spodaj). 

    AVIF ostaja zmagovalec formata. Uporabite ga pravočasno in izkoristite vse njegove prednosti tudi za svoja spletna mesta!

    Squoosh.app - najboljše orodje za pretvorbo JPG, PNG, WebP v AVIF

    V preteklosti smo v ekipi uporabljali spletno orodje TinyJPG ali TinyPNG za optimizacijo slik v formatih JPG, PNG ali tudi WebP za uporabo na spletnih mestih, zdaj pa sem velik oboževalec Squoosh iz podjetja Google. 

    Squoosh je brezplačno orodje za pretvorbo slik, ki ga je razvil Google. Orodje deluje kot spletna storitev, pa tudi lokalno na vašem računalniku ali strežniku (node.js!). Omogoča pretvorbo slik v različne formate, vključno s formati JPEG, PNG, GIF in WebP. In najboljše je, da lahko pretvori vaše slike tudi v AVIF format.

    Squoosh.app - Pretvornik slik podjetja Google za AVIF.

    Pretvornik slik Squoosh uporablja vrsto tehnik za zmanjšanje velikosti slike, ne da bi pri tem vplival na kakovost. Med njimi so stiskanje informacij o barvah, zmanjševanje ločljivosti in odstranjevanje nepotrebnih podatkov.

    Preprosto povlecite sliko in nastavite želeni format. Nekaj klikov in vaša slika je pretvorjena in optimizirana.

    Tako izgleda, če vstavite sliko WebP in jo pretvorite in stisnete enkrat v AVIF (levo) in enkrat v JPEG XL (desno). S pomičnim drsnikom si lahko ogledate, katera stopnja kakovosti je prava, da ohranite vidno kakovost. V privzeti nastavitvi je ena stran vedno izvirna datoteka za primerjavo. Torej imate popoln nadzor nad rezultatom.

    Primerjava stiskanja Squoosh
    V neposrednem primerjavi med AVIF in JPEG XL je spet jasen zmagovalec: AVIF

    Uporabi tudi Squoosh za urejanje vsebine in razvoj spletnih strani, da zmanjšaš velikost svojih slik zahvaljujoč sodobnim spletnim oblikam kot sta WebP ali AVIF ter izboljšaš čase nalaganja svojih spletnih mest. Prav tako lahko zmanjšaš velikost svojih JPG datotek - podobno kot pri TinyJPG - če jih želiš na primer naložiti v socialna omrežja. Prednost v primerjavi s TinyJPG je ta, da imaš popoln nadzor nad kompresijo in lahko eksperimentiraš z različnimi nastavitvami optimizacije, da dosežeš najboljšo kakovost pri najmanjši možni velikosti.

    Tukaj je nekaj prednosti Squoosh:

    • Podpira različne formate slik, v katere se lahko pretvori 
    • Uporablja različne tehnike za zmanjšanje velikosti slik.
    • Omogoča predogled stisnjenih slik
    • Nudi niz možnosti za optimizacijo
    • Orodje je brezplačno in enostavno za uporabo.

    Ena od negativnih strani vseh pozitivnih lastnosti je, da trenutno Squoosh lahko obdeluje le eno sliko naenkrat in ne omogoča obdelave več slik hkrati. Upam, da bo ta funkcionalnost še dodana.

    Obsežna pretvorba v PHP ogrodjih slik iz JPG in PNG v AVIF in WebP na strežniški ravni

    Na TutKit.com smo sami pretvorili naše slike, ki so bile vključene v portal kot JPG in PNG datoteke - več kot 14.000 posameznih datotek - na strežniški ravni v AVIF format in kot rezervno možnost za starejše brskalnike tudi v WebP formatu. Prav tako smo tehnično rešili, da naši urejevalci še naprej nalagajo slike kot JPG ali PNG, kot so vajeni naši oblikovalci, in jih označujejo z meta podatki v portalu. Sistem nato samodejno pri izhodu vključi vdelavo AVIF in kot rezervno možnost vsem starejšim (ali nezdružljivim) brskalnikom prikaže v WebP formatu.

    Da bo delovalo na strežniški ravni, uporabi najnovejše različice programske opreme. Nove funkcije imagecreatefromavif in imageavif za AVIF format sta na voljo le pod PHP 8.1+ in če je bil vgrajen GD razširitev s podporo za AVIF. Zahteva libavif različice 0.8.2 ali višje.

    Prav tako bodi pozoren na združljivost s operacijskimi sistemi. AVIF je na voljo v paketih libavif-dev/libavif-devel v repozitorijih:

    • od Ubuntu 21.04  
    • od Debian 11 
    • od Alpine 3.13 
    • od Fedora 34

    Tukaj je prikaz PageSpeed ocene za mobilni pogled TutKit.com. Medtem ko je pri namizju relativno enostavno doseči vrednost nad 90, je za mobilne poglede res izziv. Še naprej se trudimo, da bi to vrednost še izboljšali proti 100, saj vemo: PageSpeed je dober za uporabniško izkušnjo in s tem prispeva k našim SEO uspehom.

    Hitrost strani za TutKit - mobilna naprava.

    Tisto, kar zveni tako sproščeno z vključitvijo AVIF tukaj v našem PHP ogrodju Laravel, se na koncu kopiči v več kot 60 vprašanj v našem orodju JIRA, povezanih s pretvorbo in vključitvijo (vključno z raziskovanjem, razvojem, odpravljanjem napak, testiranjem). Medtem ko vtičniki delo v klasičnem CMS, kot je WordPress, zelo olajšajo, lahko pri obsežnem individualnem razvoju - kot pri nas - traja tudi do tri tedne. Prednosti uporabe AVIF so vredne truda! 

    Mimogrede: Morda bom kmalu napisal članek, zakaj pri portalih, kot je TutKit.com, raje uporabljamo PHP ogrodje namesto WordPress-a ali drugih CMS.

    Vtičniki za uporabo AVIF v WordPress-u

    CMS WordPress podpora za nalaganje AVIF slik po privzeto za september 2023 ni na voljo - drugače kot na primer CMS Contao, ki podpira AVIF od verzije 5.0.0 dalje. Zato trenutno pri uporabi WordPress-a potrebuješ dva dodatna koraka, da lahko prikažeš svoje slike v AVIF formatu.

    1. Vzpostaviti podporo za AVIF v WordPress-u
    2. Pretvoriti slike iz JPG/PNG/WEBP v AVIF

    Obstaja več vtičnikov za WordPress, ki omogočajo uporabo AVIF slik na WordPress spletnih mestih. Tukaj so trije vtičniki, ki jih lahko preveriš: 

    • AVIF podpora: Ta vtičnik omogoča nalaganje in prikaz AVIF slik na WordPress spletnih mestih. Prav tako podpira samodejno pretvorbo slik iz JPEG in PNG v AVIF slike.
    • Pretvornik za medije: Ta vtičnik pretvarja vse slike v tvoji WordPress medijski knjižnici v AVIF slike. Ponuja tudi niz možnosti za prilagajanje kakovosti slike in stopnje stiskanja.
    • ShortPixel Image Optimizer: Ta vtičnik optimizira slike v tvoji WordPress medijski knjižnici, vključno s pretvorbo v AVIF slike. Ponuja tudi niz drugih funkcij za izboljšanje kakovosti in uspešnosti slik.

    Ti vtičniki so dober način za izkoriščanje prednosti AVIF slik na WordPress spletnih mestih.

    AVIF-Support-Uploader kot vtičnik za WordPress

    Tukaj je dodatek za podporo AVIF - trenutno ima samo 1.956 prenosov in manj kot 800 namestitev - očitno je, da je AVIF za uporabnike WordPressa še popolnoma neznan.

    Na 43,1 odstotka vseh spletnih mest deluje s CMS WordPress. Ko bo WordPress na sistemski ravni podpiral AVIF, bo AVIF začel svojo zmagovalno pot in bo izrinil JPG, PNG in tudi WebP. - Matthias Petri


    POSODOBITEV 05.04.2024: WordPress 6.5 zdaj končno podpira tudi AVIF! S tem bodo podporne vtičnike potrebovali samo še starejše različice WordPressa. Še toliko bolj se splača posodobiti na WordPress 6.5 in novejše različice.

    Vtičnik Local Image Sharp za Strapi spletna mesta

    Tudi mi uporabljamo AVIF na naši spletni strani agencije 4eck-media.de, ki uporablja CMS Strapi zgrajen na node.js. Vtičnik Local Image Sharp za Strapi omogoča uporabo AVIF slik na Strapi spletnih mestih. Vtičnik uporablja sharp Image Processing Toolkit za pretvorbo slik v AVIF slike.

    Vtičnik Local Image Sharp vam ponuja vrsto funkcij, med drugimi:

    • Avtomatska pretvorba slik v AVIF slike
    • Nastavitev kakovosti slike in stopnja stiskanja
    • Podpora za različne slikovne formate

    Za namestitev vtičnika ga prenesite iz trgovine z vtičniki Strapi in ga namestite kot kateri koli drug vtičnik Strapi.

    Local-Image-Sharp na trgu Strapi

    Nastavili smo ga tako, da slike še vedno nalagamo v Strapi sistem kot JPG ali PNG. Sistem slike pretvori v AVIF in WEBP v šest različnih ločljivosti, da se pravilno dimenzionirane slike glede na napravo (namizje, tablični računalnik, mobilni telefon) prikažejo v brskalniku kot AVIF. Za starejše brskalnike imamo tudi rezervno rešitev z WebP slikami, ki se potem prikažejo. 

    Najbolje je uporabiti znaznačenje Picture, ki vsebuje značke Source in Image, da prikažete slike v pravilni dimenziji in v obeh oblikah AVIF in WebP z izvorom iz oblike JPEG ali PNG.

    Branje slik v sodobnem spletnem formatu je poleg predpomnilnika ena ključnih potez za odlično delovanje naše spletne strani agencije:

    PageSpeed Insights za 4eck-media - namizje

    Opozorilo o meta-slikih in strukturiranih podatkih

    Ker Google do danes ne podpira AVIF formata slik, v shemi označevanja "sliko" še vedno navedemo pripadajočo datoteko JPG. Prav tako meta-slika, ki jo navajamo na vsaki strani izdelka, da ponudimo Googlu predogled slike za prikaz naslovne slike, vsebuje še vedno format JPG.

    Boljše je varno kot žal. Na forumih je že poročal nekdo, da je popolna spletna vidljivost slik izginila po prehodu na AVIF. Te izkušnje ne moremo potrditi. Spletna vidljivost je pri nas ostala konstantna, vendar so se vpeljave googlebotov za priklice slik povečale. Zanimivo je, da vidimo, da se googlebot sprehaja skozi WebP slike, ki so pripravljene za ustavitev za starejše brskalnike. Zdi se, da google trenutno indeksira WebP slike za indeks. 

    Zato bi moja priporočila, da še uporabimo izvor JPG v meta podatkih za slike in tudi za strukturirane podatke.

    Orodja in programska oprema za obdelavo AVIF slik

    Slike se pogosto in radi obdelujejo, zato je združljivost s formatom AVIF seveda zaželena pri običajnih programih za obdelavo slik. Včasih prenesemo obstoječo sliko s spletne strani, da naredimo spremembo. Dobro je, če jo vaš priljubljeni program za obdelavo slik tudi odpre, kar pomeni najpomembnejšo funkcijo pri združljivosti AVIF. Čeprav se nato shranjuje v drugem formatu, jo je mogoče spet pretvoriti v AVIF prek Squoosh ali drugih orodij.

    Tukaj je seznam programske opreme za obdelavo slik za združljivost z AVIF (s stanjem septembra 2023):

    • Gimp: Lahko uvozi, ureja in izvozi AVIF od različice 2.10.22 naprej.
    • Photopea: lahko uvozi in ureja AVIF, vendar ga ne more izvoziti. Shranjevanje je nato mogoče v drugem formatu datoteke.
    • Affinity Photo: ne podpira AVIF
    • Photoshop: brez podpore, vendar plugin pomaga vzpostaviti združljivost.

    Vtičnik za AVIF za Photoshop

    Tukaj najdete vtičnik, s katerim lahko Photoshop odpre tudi datoteke AVIF.
    https://github.com/0xC0000054/avif-format

    Prenos je mogoč v zavihku izdaj strani.

    Ko prenesete ZIP, datoteko Av1Image.8bi postavite v mapo, kjer Photoshop išče vtičnike. To je običajna mapa za nameščanje:
    C:\Program Files\Common Files\Adobe\Plug-ins\CC

    Ali ta mapa: C:\Program Files\Adobe\Photoshop [različica]\Vtičniki

    Photoshop mora biti zaprt. Nato zaženite Photoshop, da se lahko vtičnik naloži. Nato lahko AVIF datoteke odprete neposredno v Photoshopu s povleci in spusti ali prek odprtega pogovornega okna.

    AVIF v Photoshopu

    Prikaz AVIF slik v sistemu Windows

    Ko prenesete slike s spletne strani, ker jih želite urediti ali drugače potrebujete, želite seveda, da jih tudi brskalnik datotek odpre in prikaže.

    Za Windows 10 je to mogoče, vendar je za to potrebna razširitev. Če kliknete na AVIF datoteko, najprej prejmete sporočilo o napaki. 

    Napaka pri prikazu AVIF na Windows operacijskem sistemu.

    V sporočilu o napaki je povezava. Ko nanjo kliknete, vas preusmeri v Microsoft Store, kjer lahko prenesete razširitev AVIF. Ta je velika le 1,61 MB.

    Razširitev AVIF za Microsoft

    Nato lahko slike v formatu AVIF tudi v sistemu Windows odprete in prikažete v brskalniku datotek.

    Sporočilo AVIF v sistemu Microsoft.

    Namesto GIF animacij raje vključite AVIF animacije na spletna mesta

    Tukaj je spletni pretvornik za pretvorbo GIF animacij v AVIF animacije. https://mconverter.eu/convert/gif/avif/

    Medtem ko je moj testni GIF velik 787 KB, se animacija kot AVIF zmanjša na 411 KB.

    Moje osebno mnenje

    Po mojem mnenju je AVIF najboljša možnost, da vključite sodobne slikovne formate v spletne strani. Prednosti pri stiskanju in kakovosti slike so prepričljive. Noben drug format slike ne združuje teh lastnosti in ne izboljšuje toliko časov nalaganja. Trenutno še vedno premalo upraviteljev spletnih strani uporablja format AVIF, čeprav je podpora brskalnikov več kot 85 % in tehnično ni ovira, da bi še vedno uporabljali WebP kot rezervo. SEO se spreminja. Samo AVIF ni dovolj, da dosežemo najvišje rezultate pri analizi straniške hitrosti; poleg tega so potrebni še drugi tehnični dejavniki. Ko gre za integracijo sodobnih slikovnih formatov, boste z AVIF glede na WebP lahko dosegli boljše rezultate.

    Samo optimiziran vsebina ne bo več dovolj, saj količina vsebin preplavlja internet zaradi umetne inteligence, zaradi česar se veliko spletnih mest spoprijema z enakopravnostjo vsebine z drugimi tekmovalci za spletno vidnost. Tehnično optimiziranje za iskalnike in zlasti Izpolnjevanje pomembnih spletnih ciljev sredstev postajata vse močnejša faktorja za uvrščanje in razlikovanje, saj si Google želi zagotoviti uporabnikom največjo možno uporabniško izkušnjo. AVIF je - poleg drugih dejavnikov - del rešitve za pospeševanje časa nalaganja, povečanje uporabniške izkušnje in perspektivno izboljšanje spletnega vidnosti.

    Izvedite več o SEO, uporabniški izkušnji, oblikovanju in tehničnih trendih

    Če vas načeloma zanimajo teme o SEO, uporabniški izkušnji, orodjih za umetno inteligenco in novih spletnih tehnologijah, lahko v naših usposabljanjih in drugih člankih na tem blogu izveste več.

    1101,908,1094,1055,1096

    Sedaj je vaša vrsta

    Če je bil ta prispevek koristen za vas, nam lahko napišete preglede na Google. Vsak pregled nas podpira. Če potrebujete pomoč pri uporabi AVIF v svojem spletnem projektu, nas lahko kontaktirate prek naše agencije.

    Objavljeno ob s spletne strani Matthias Petri
    Objavljeno ob:
    S spletne strani Matthias Petri
    Matthias Petri je leta 2010 skupaj s svojim bratom Stefanom Petri ustanovil agencijo 4eck Media GmbH & Co. KG. Skupaj s svojo ekipo vodi priljubljeno strokovno forumsko stran PSD-Tutorials.de ter spletni portal za e-učenje TutKit.com. Objavil je številne vadnice za obdelavo slik, trženje in oblikovanje ter poučeval kot zunanji predavatelj na FHM v Rostocku na temo "Digitalni marketing in komunikacija". Za svoje delo je prejel več nagrad, med drugim posebno nagrado Webseite-Award Mecklenburg-Predpomorjanske 2011 in naziv Kreativmacher Mecklenburg-Predpomorjanske 2015. Leta 2016 je bil imenovan za člana Fellow centra za kompetence v kulturi in ustvarjalnih industrijah zvezne vlade in je aktiven v pobudi "Smo vzhod" kot podjetnik in izvršni direktor skupaj z mnogimi drugimi protagonisti vzhodnonemškega porekla.
    Nazaj na pregled