Néhány éve a WebP megalapozta pozícióját mint a web referencia képformátuma, fokozatosan kiszorítva a JPEG-et és a PNG-t. De megjelent egy új kihívó, aki megelőzte: az AVIF. Jobban tömörített, pontosabb, és mostanra minden modern böngésző támogatja, az AVIF 2026-ban a web számára elérhető leghatékonyabb képformátumként érvényesül. Íme, mi ez, miben különbözik a WebP-től, és mikor érdemes áttérni rá.
Mi az AVIF formátum?
Az AVIF (AV1 Image File Format) az AV1 videokodekből levezetett képformátum, amelyet az Alliance for Open Media fejlesztett — egy konzorcium, amelynek tagjai a Google, Apple, Mozilla, Netflix, Amazon, Microsoft és az Intel. 2019-ben indult hivatalosan, és 2022-2023-tól érte el a széleskörű webes elterjedéshez szükséges érettséget.
A JPEG-gel vagy PNG-vel ellentétben, amelyek évtizedek óta létező tömörítési algoritmusokon alapulnak, az AVIF a legmodernebb videotömörítési technológiákat hasznosítja az állóképek kódolásához. Az eredmény látványos: egyenértékű vizuális minőség mellett az AVIF fájl jelentősen kisebb, mint egy JPEG vagy WebP.
AVIF vs WebP vs JPEG: a főbb különbségek
Annak megértéséhez, miért érvényesül az AVIF, íme a három formátum közvetlen összehasonlítása a web szempontjából fontos kritériumok szerint:
| Kritérium | JPEG | WebP | AVIF |
|---|---|---|---|
| Tömörítés (azonos minőség) | Alap | −25–35 % | −40–55 % |
| Átlátszóság (alpha) | Nem | Igen | Igen |
| Animáció | Nem | Igen | Igen |
| HDR / széles színtartomány | Nem | Korlátozott | Igen (natív) |
| Színmélység | 8 bit | 8 bit | Legfeljebb 12 bit |
| Böngészőtámogatás 2026 | Univerzális | Univerzális | +97 % (csaknem univerzális) |
| Kódolási sebesség | Gyors | Gyors | Lassabb |
| Dekódolási sebesség | Gyors | Gyors | Kicsit lassabb |
| Licenc | Szabad | Szabad (Google) | Szabad (royalty-free) |
Miért jobb az AVIF a WebP-nél
A WebP jelentős előrelépés volt, amikor a Google 2010-ben bevezette — kb. 25-35%-os méretcsökkentést kínált a JPEG-hez képest. De az AVIF több ponton is jóval tovább megy:
- Jobb tömörítés: az AVIF 40-55%-kal csökkenti a fájlméreteket a JPEG-hez képest azonos vizuális minőség mellett, szemben a WebP 25-35%-ával. Képekben gazdag oldalakon ez jelentős teljesítménykülönbséget jelent
- Kevesebb vizuális műtermék: a WebP látható tömörítési műtermékektől szenved a gradiens területeken és vékony éleken alacsony bitsebességen. Az AVIF ezeket a területeket lényegesen jobb pontossággal kezeli
- Natív HDR-támogatás: az AVIF natívan támogatja a HDR-t (High Dynamic Range) és a széles színtereket (Display P3, Rec. 2020), ami ideálissá teszi csúcskategóriás kijelzőkhöz és professzionális fotózáshoz
- Színmélység: az AVIF csatornánként legfeljebb 12 bitet támogat, szemben a WebP 8 bitjével, összehasonlíthatatlanul gazdagabb színpalettát biztosítva
- Rugalmas krominancia-almintavételezés: az AVIF támogatja a 4:4:4, 4:2:2 és 4:2:0 módokat, finom szabályozást biztosítva a minőség/méret kompromisszum felett a képtípustól függően
Tudta? az AVIF-tömörítés különösen lenyűgöző portrékban és bőrtónusokban, ég-gradientekben és összetett háttéren szöveget tartalmazó képekben — pontosan azokban az esetekben, amikor a WebP látható műtermékeket kezd mutatni. Nagyon egyszerű képeknél (ikonok, vektoros illusztrációk) a nyereség kisebb, és az SVG marad az előnyösebb.
Böngészőtámogatás 2026-ban
Az AVIF elfogadásának egyik történelmi akadálya a részleges böngészőtámogatás volt. 2026-ban ez már nem így van:
- Chrome: a 85-ös verziótól támogatott (2020. augusztus)
- Firefox: a 93-as verziótól támogatott (2021. október)
- Safari: a 16.0-s verziótól támogatott (2022. szeptember)
- Edge: a 121-es verziótól támogatott (2024)
- Opera, Samsung Internet, Brave: mind támogatott
2026-ban az AVIF globális támogatása meghaladja a Can I Use adatai szerint a világszerte használt böngészők 97%-át. Az egyetlen figyelemre méltó kivétel egyes beágyazott böngészők és néhány ipari vagy kormányzati környezet, ahol Internet Explorer vagy Edge Legacy nagyon régi verzióit futtatják — marginális esetek.
Az AVIF fő hátránya: lassú kódolás
Az AVIF nem tökéletes. Fő gyengesége a kódolási sebesség: AVIF fájlt generálni lényegesen lassabb, mint JPEG-et vagy WebP-t kódolni, különösen a legmagasabb minőségi szinteken. A beállításoktól és hardvertől függően egy kép AVIF-be kódolása 5-20-szor tovább tarthat, mint WebP-be.
Menet közben képeket generáló oldalak esetén (pl. e-kereskedelmi platform milliónyi termékváltozattal) ez a késedelem problémás lehet. Általános megoldások:
- AVIF képek előzetes kódolása feltöltéskor és CDN-ről való kiszolgálásuk
- A kódolási sebesség paraméter (speed) használata a generálás felgyorsítására egy kis tömörítési nyereség rovására
- Hibrid AVIF + WebP tartalék stratégia fenntartása a <picture> tagon keresztül
Hogyan implementálja az AVIF-t webhelyén
A legelegánsabb módja az AVIF integrálásának a maximális kompatibilitás megőrzése mellett a HTML <picture> tag használata több forrással:
<picture>
<source srcset="kep.avif" type="image/avif">
<source srcset="kep.webp" type="image/webp">
<img src="kep.jpg" alt="Kép leírása" width="800" height="600">
</picture>A böngésző automatikusan kiválasztja a legjobb támogatott formátumot. Egy modern böngésző betölti az AVIF-et, egy régebbi visszaesik a WebP-re, a nagyon régi böngészők betöltik a JPEG-et. Nem szükséges JavaScript, szerver oldali érzékelés sem kell.
A képek AVIF-re konvertálásához elérhető eszközök:
- Squoosh (Google) — ingyenes online eszköz, valós idejű vizuális összehasonlítás
- ImageMagick — parancssor: convert input.jpg -quality 80 output.avif
- Sharp (Node.js) — nagy teljesítményű képfeldolgozó könyvtár
- Cloudinary, Imgix, Cloudflare Images — automatikus AVIF konverzió és kézbesítés CDN-en keresztül
Az AVIF valóban felváltja a WebP-t?
Tiszta teljesítmény szempontjából igen — az AVIF szinte minden technikai kritérium szerint felülmúlja a WebP-t. De a migráció nem feltétlenül azonnali minden projekt esetén:
- Ha képfeldolgozási folyamata már optimalizált WebP-re és képei könnyek, az AVIF-nyereség rövid távon esetleg nem indokolja a teljes felülvizsgálatot
- Új projektekhez vagy képfelújításokhoz az AVIF-nek kell lennie az alapértelmezett első választásnak
- A hibrid <picture> AVIF + WebP + JPEG stratégia jelenleg a legjobb gyakorlat: maximalizálja a teljesítményt a modern böngészőkön a kompatibilitás feláldozása nélkül
Tudta? a fő képi CDN-ek (Cloudflare, Cloudinary, Fastly, imgix) mostantól automatikusan kiszolgálják az AVIF-et, az Accept fejlécen keresztül észlelve a látogató böngészőjét. Ha ezen szolgáltatások egyikét használja, lehet, hogy már AVIF előnyeit élvezi kódmódosítás nélkül — egyszerűen ellenőrizze a képei válaszfejlécét a böngésző fejlesztői eszközeivel.