Čo je WebP?
WebP je moderný obrazový formát vyvinutý spoločnosťou Google, ktorý ponúka o 25-35 % menšie súbory ako JPEG pri rovnakej vizuálnej kvalite. Podporuje stratovú aj bezstratovú kompresiu, priehľadnosť (alfa kanál) a animácie. Je podporovaný všetkými modernými prehliadačmi.
Definícia WebP
Čo je WebP
WebP je obrazový formát, ktorý vyvinula spoločnosť Google a prvýkrát ho predstavila v roku 2010. Cieľom bolo vytvoriť formát, ktorý bude menší ako JPEG a PNG pri zachovaní porovnateľnej kvality. WebP využíva predikčné kódovanie z video kodeku VP8 (stratová kompresia) a VP8L (bezstratová kompresia).
Výhody WebP oproti JPEG a PNG
- Menšia veľkosť — stratový WebP je o 25-35 % menší ako JPEG, bezstratový WebP je o 26 % menší ako PNG
- Priehľadnosť — na rozdiel od JPEG podporuje alfa kanál (priehľadnosť) s oveľa menšou veľkosťou ako PNG
- Animácie — WebP animácie sú výrazne menšie ako GIF (až o 64 %)
- Stratová aj bezstratová kompresia — jeden formát pre oba typy kompresie
Podpora a implementácia
WebP podporujú všetky moderné prehliadače od roku 2020 (vrátane Safari 14+). Pre staršie prehliadače sa používa element <picture> s JPEG/PNG fallbackom:
- Next.js — komponent
<Image>automaticky generuje a servíruje WebP verzie - WordPress — od verzie 5.8 natívne podporuje nahrávanie a zobrazovanie WebP
- CDN — Cloudflare, AWS CloudFront a ďalšie CDN automaticky konvertujú obrázky do WebP
Praktický príklad
Príklad: E-shop s 500 produktovými fotografiami vo formáte JPEG — priemerná veľkosť 120 kB na obrázok, celkovo 60 MB.
Po konverzii do WebP s kvalitou 80 % sa priemerná veľkosť zníži na 82 kB — celkovo 41 MB. Ušetrí sa 19 MB prenesených dát. Na stránke kategórie s 30 produktmi sa načíta o 1,2 MB menej dát, čo na mobilnom pripojení znamená o 1,5 sekundy rýchlejšie načítanie.
Často kladené otázky
Čo je WebP formát?
WebP je moderný obrazový formát od Google, ktorý ponúka lepšiu kompresiu ako JPEG a PNG. Podporuje priehľadnosť, animácie aj stratovú a bezstratovú kompresiu. Je podporovaný všetkými modernými prehliadačmi.
Je WebP lepší ako JPEG?
Áno, WebP dosahuje o 25-35 % menšie súbory pri rovnakej vizuálnej kvalite. Navyše podporuje priehľadnosť, čo JPEG nedokáže. Jedinou výhodou JPEG je širšia podpora v starších softvéroch a zariadeniach.
Ako prevediem obrázky do WebP?
Môžete použiť online nástroj Squoosh od Google, príkazový riadok cwebp, knižnicu Sharp v Node.js alebo editovacie programy ako Photoshop a GIMP. Next.js konvertuje obrázky do WebP automaticky.
Podporuje Safari formát WebP?
Áno, Safari podporuje WebP od verzie 14 (macOS Big Sur, iOS 14) vydanej v roku 2020. Globálne pokrytie prehliadačov s podporou WebP presahuje 97 %.
Súvisiace pojmy
Potrebujete pomôcť s webom?
Napíšte mi a poradím vám s vaším projektom. Prvá konzultácia je zadarmo a nezáväzná.