V počátcích webu byl výběr formátu obrázku jednoduchý: pokud šlo o fotografii, použili jste JPEG. Pokud to potřebovalo průhledné pozadí, použili jste PNG. Pokud jste chtěli, aby se pohyboval, použili jste GIF. Jak se však pohybujeme v roce 2026, oblast webového výkonu a Core Web Vitals drasticky změnila pravidla.
Poskytování těžkých, neoptimalizovaných souborů JPEG nebo PNG je dnes rychlou cestou k propadu v žebříčku vyhledávání Google. Moderní webové prohlížeče podporují neuvěřitelně efektivní formáty nové generace jako WebP a AVIF. Ale který z nich byste si měli vybrat? Měli byste JPEG úplně opustit? Pojďme se hluboce ponořit do technické mechaniky, výhod a nevýhod čtyř nejlepších obrazových formátů, které dnes dominují webu.
Legacy Titans: JPEG a PNG
Než pochopíme, proč jsou moderní formáty tak výkonné, musíme pochopit omezení technologií, které nahrazují.
JPEG (Joint Photographic Experts Group)
JPEG, který byl představen v roce 1992, způsobil revoluci v digitálním zobrazování tím, že zavedl ztrátovou kompresi. Tím, že se spoléhají na lidská biologická omezení – konkrétně na to, že naše oči jsou méně citlivé na jemné změny barev než změny jasu – algoritmy JPEG zahazují data, kterých si stejně pravděpodobně nevšimneme.
The Catch: JPEG nepodporuje průhlednost (alfa kanál). Navíc při vysokých kompresních poměrech vytváří JPEG vysoce viditelné blokové „artefakty“ kolem ostrých hran, což je hrozné pro snímky obrazovky, loga nebo prvky uživatelského rozhraní.
PNG (Portable Network Graphics)
PNG, vytvořený v roce 1996 jako open-source alternativa k silně patentovanému formátu GIF, používá bezeztrátovou kompresi. To znamená, že žádná data nejsou vyřazena. Obrázek PNG si zachovává absolutní pixelovou dokonalost, což z něj činí krále ploché grafiky, log a obrázků vyžadujících průhledné pozadí.
The Catch: Protože je bezztrátový, velikosti souborů PNG jsou v porovnání s JPEGy naprosto obrovské. Poskytování fotografie hrdiny v plné šířce jako PNG může mít za následek stažení 5 MB, což zcela zničí skóre největšího obsahu stránky (LCP).
Nová generace: WebP
WebP, vyvinutý společností Google a široce rozšířený ve všech prohlížečích do roku 2021, byl prvním skutečným „hybridním“ formátem navrženým speciálně pro moderní web.
Kouzlo WebP spočívá v jeho schopnosti zvládnout jak ztrátovou, tak bezztrátovou kompresi, přičemž také podporuje průhlednost a animaci. Byl navržen tak, aby nahradil JPEG, PNG a GIF jedinou příponou.
- Ztrátové WebP: Průměrně o 25 % až 34 % menší velikosti souborů než ekvivalentní obrázky JPEG.
- Bezztrátové WebP: Průměrně o 26 % menší velikosti souborů než ekvivalentní PNG.
Upgradujte své obrázky okamžitě
Nedovolte, aby staré formáty zničily vaše Core Web Vitals. Použijte náš bezpečný offline konvertor k transformaci vašich masivních JPEG a PNG na vysoce optimalizované soubory WebP přímo ve vašem prohlížeči.
Převést obrázky na WebPThe Bleeding Edge: AVIF
Pokud byl WebP evolucí, AVIF (AV1 Image File Format) je revolucí. AVIF, který byl vydán v roce 2019 a získal masivní trakci v polovině 2020, je založen na video kodeku AV1.
Zatímco WebP používá starší techniky komprese videa (VP8), AVIF využívá moderní, neuvěřitelně složité algoritmy navržené pro streamování videa v rozlišení 4K a 8K. Výsledky nejsou ničím menším než ohromující. AVIF může nabídnout zmenšení velikosti souboru až o 50 % ve srovnání s WebP s výrazně menším počtem kompresních artefaktů v zónách s nízkou věrností barev.
Proč ještě všichni nepoužívají AVIF?
Pokud je AVIF tak lepší, proč to není jediný formát, který používáme? Odpověď spočívá ve dvou technických překážkách:
- Doba kódování: Vzhledem k tomu, že komprese AVIF je tak matematicky složitá, vyžaduje generování souboru AVIF výrazně více výkonu procesoru než WebP nebo JPEG. Pokud převádíte tisíce obrázků nahraných uživateli na server, AVIF dramaticky zvýší vaše náklady na CPU.
- Rychlost dekódování: Starší smartphony mohou mít potíže s rychlým dekódováním velkých souborů AVIF, což mírně zpožďuje dobu vykreslování na zařízeních nižší třídy.
Srovnávací matice: Kterou byste měli použít?
Abychom vám usnadnili rozhodování, zde je rozpis porovnání těchto formátů mezi kritickými metrikami vývoje webu v roce 2026.
| Format | Compression | Transparency | Browser Support | Best Use Case |
|---|---|---|---|---|
| AVIF | Lossy & Lossless | Yes | ~95% | Hero banners, large photography where absolute smallest file size is critical. |
| WebP | Lossy & Lossless | Yes | 99.9% | The gold standard for general web use. E-commerce products, thumbnails, icons. |
| PNG | Lossless Only | Yes | 100% | Archival graphics or as a fallback for older email clients. |
| JPEG | Lossy Only | No | 100% | Legacy fallback only. Do not use for modern web delivery. |
Jak bezpečně obsluhovat moderní formáty (úryvek kódu)
Zatímco podpora prohlížeče pro WebP je prakticky univerzální, AVIF má stále určité nedostatky ve starších systémech. Nejlepším postupem pro vývoj webu je použití prvku <picture> HTML. To prohlížeči umožňuje vyjednat nejlepší formát, kterému rozumí.
<picture>
<!-- If the browser supports AVIF, it loads this -->
<source srcset="hero-image.avif" type="image/avif">
<!-- If no AVIF, but it supports WebP, it loads this -->
<source srcset="hero-image.webp" type="image/webp">
<!-- Fallback for legacy browsers (IE11, older email clients) -->
<img src="hero-image.jpg" alt="A beautiful landscape" width="800" height="600" loading="lazy">
</picture>Tato strategie progresivního vylepšování zajišťuje, že vaši mobilní uživatelé ušetří drahocennou šířku pásma s AVIF, zatímco vaši firemní uživatelé na zastaralém softwaru stále uvidí fungující web prostřednictvím záložního JPEG.
Často kladené otázky (FAQ)
Zlepší převod JPEG na WebP jeho kvalitu?
Ne. Když převedete ztrátový formát (JPEG) na jiný ztrátový formát (WebP), nemůžete obnovit data, která již byla ztracena. Výsledný soubor však bude výrazně menší v megabajtech, což zvyšuje rychlost stránky.
Bude Google hodnotit můj web výše, pokud místo WebP použiji AVIF?
Google výslovně neřadí weby podle přípony souboru. Google však striktně řadí na základě Core Web Vitals (konkrétně LCP). Protože jsou soubory AVIF menší, načítají se rychleji, což přímo zlepšuje vaše skóre LCP a nepřímo zvyšuje vaše SEO.
Mám převést logo svého webu na WebP?
Loga jsou obvykle vektorová grafika. Absolutně nejlepší formát pro logo je SVG (Scalable Vector Graphics), protože se spoléhá spíše na matematiku než na pixely, což má za následek nekonečnou škálovatelnost a malé velikosti souborů. Pokud musíte použít rastrový obrázek pro logo, Lossless WebP je vynikající volbou.
Konečný verdikt pro rok 2026
Dny spoléhání se na JPEG a PNG jsou oficiálně pryč. Pro 90 % webových vývojářů a vlastníků malých podniků je WebP naprostou sladkostí. Nabízí podporu univerzálních prohlížečů, bleskově rychlé časy kódování a obrovské úspory velikosti souborů.
Pokud provozujete mediální web s vysokým provozem, kde každý kilobajt šířky pásma stojí peníze, investujte prostředky serveru do kódování souborů AVIF. Ale pro nás ostatní je převod vaší knihovny obrázků na WebP nejvyšším úkolem návratnosti investic, který můžete letos pro výkon svého webu provést.