WebP je moderný formát obrázkov, ktorý pri podobnej vizuálnej kvalite vytvára menšie súbory než JPEG a PNG. Podporuje stratovú aj bezstratovú kompresiu, priehľadnosť aj animáciu. Menšie obrázky zrýchľujú načítanie stránky.
O koľko je WebP menší?
Podľa MDN je stratový WebP zvyčajne o 25 až 35 percent menší než JPEG pri podobnej vizuálnej kvalite a bezstratový WebP zhruba o 26 percent menší než PNG. Ide o typické hodnoty, výsledok závisí od konkrétneho obrázka.
Ako WebP na webe použijeme?
MDN odporúča pre rastrové obrázky uprednostniť WebP alebo AVIF, pretože sa lepšie komprimujú než PNG, JPEG a GIF. Pre staršie prehliadače je vhodné pripraviť záložný súbor vo formáte JPEG alebo PNG pomocou prvku <picture>. Google v dokumentácii o obrázkoch uvádza WebP medzi podporovanými formátmi vo Vyhľadávaní spolu s AVIF, JPEG, PNG, GIF, BMP a SVG.
Aké ďalšie vlastnosti WebP má?
- Podporuje stratovú aj bezstratovú kompresiu.
- Podporuje priehľadnosť, takže môže nahradiť PNG.
- Podporuje animáciu, takže môže nahradiť GIF.
Čo si zapamätať o pojme WebP?
WebP je praktický formát na zmenšenie obrázkov bez viditeľnej straty kvality. Zrýchľuje načítanie a pomáha pri metrike LCP. Aj pri ňom treba vyplniť alt text.
Ako to rieši webstrankanamieru.sk: Pojem WebP patrí do technickej časti optimalizácie. Postup nájdete v sekcii SEO na mieru, zistenia z praxe v novinkách a ceny v cenníku. Ak chcete skontrolovať svoj web, napíšte nám.
Súvisiace pojmy: LCP, Rýchlosť stránky, Lazy loading, Alt text, Optimalizácia obrázkov, Photoshop, Responzívny dizajn
Často kladené otázky o pojme WebP
Čo je WebP?
Je WebP menší než JPEG?
Podporuje WebP priehľadnosť?
Zobrazuje Google obrázky vo WebP?
Treba ponechať aj záložný formát?
Zdroje
- MDN Web Docs: Image file type and format guideVlastnosti, veľkosť a odporúčané použitie WebP.
- Google Search Central: Google image SEO best practicesFormáty obrázkov podporované Google Search.
- web.dev: Largest Contentful Paint (LCP)Veľkosť hlavného obrázka a LCP.