GIF formát je tu s námi již od roku 1987. Přežil flash, přežil Vine a přežívá i nástup moderních formátů, které ho na papíře překonávají ve všech technických parametrech. Otázka ale není, zda je GIF zastaralý. Otázka je, kdy ho ještě použít a kdy ho konečně nechat být. Má cenu snažit se o optimalizaci GIF, nebo sáhnout po alternativách?
Proč jsou moderní formáty lepší téměř ve všem?
GIF pracuje s paletou maximálně 256 barev. Pro fotografii nebo složitou grafiku je to katastrofa, pro jednoduchou animaci s plochými barvami to stačí. Problém je velikost souborů. Animovaný GIF o délce tří sekund bez problémů přeroste přes megabajt, někdy dokonce až přes pět. Na webu, kde každý kilobajt ovlivňuje rychlost načítání, je to daň, která bolí.
WebP animace, kterou Google představil jako nástupce GIF formátu, produkuje soubory o 60 až 80 procent menší při lepší kvalitě obrazu a plné podpoře průhlednosti. Zvládá miliony barev, přičemž GIF jich nabídne jen 256. Podpora v prohlížečích je od roku 2022 plošná.
AVIF je ještě pokročilejší. Tento formát postavený na kodeku AV1 přináší nejlepší poměr kvality a velikosti ze všech tří. Animovaný AVIF je výrazně menší než WebP při srovnatelné nebo lepší vizuální kvalitě. Podpora prohlížečů je o něco mladší, ale Chrome, Firefox i Safari ho bez problémů přehrají.
Kde GIF přesto vede?
Přes všechny technické nevýhody má GIF jednu vlastnost, která ho drží naživu: funguje všude a bez podmínek. Vložíte ho do e-mailu, otevře se v Outlooku, zobrazí ho Gmail, přehraje ho Apple Mail. Animovaný WebP v e-mailových klientech nefunguje spolehlivě a AVIF podporu v e-mailech prakticky nemá.
Pokud tedy posíláte newslettery s animovanou grafikou, GIF je stále jediná bezpečná volba. Alternativou je statický fallback obrázek, ale to znamená ztrátu celého animačního efektu pro velkou část příjemců.
Druhý případ je sdílení na sociálních sítích a v chatovacích aplikacích. Giphy, Tenor a podobné platformy stojí na GIF formátu. Slack, Discord, Teams, iMessage. Tyto platformy GIF přijmou, přehrají a sdílí bez konverze. Posíláte kolegovi reakci v chatu? GIF tam prostě patří a nikdo neřeší velikost souboru.
Třetí oblast je technická dokumentace a návody, kde GIF historicky dominuje jako formát pro krátké screencasty a ukázky kroků v uživatelském rozhraní. Nástroje jako LICEcap nebo ScreenToGif exportují přímo do GIF a workflow je pro technické pisatele zažitý. WebP animace se v dokumentačních nástrojích jako Notion nebo Confluence zobrazují správně, ale podpora exportu z nahrávacích nástrojů je stále omezenější.
Kdy přejít na WebP animaci?
Pokud animaci publikujete přímo na webu a máte kontrolu nad tím, jak se zobrazuje, WebP je správná volba. Nahradí GIF bez kompromisů a soubor bude výrazně menší. Na stránce s více animacemi to znamená reálný rozdíl v rychlosti načítání a skóre Core Web Vitals.
Implementace je jednoduchá. HTML element <picture> umožňuje nabídnout prohlížeči WebP jako primární formát a GIF jako fallback pro případy, kdy WebP není podporován. V praxi to dnes skoro nikdo nepotřebuje, ale pro jistotu je fallback dobrá praxe.
Konverzi GIF na WebP zvládne Squoosh v prohlížeči, ffmpeg v příkazové řádce nebo Cloudinary automaticky při nahrání souboru. Proces je rychlý a výsledek okamžitě porovnatelný.
Kdy sáhnout po AVIF?
AVIF dává největší smysl tehdy, když animace obsahuje fotorealistický obsah nebo složité přechody barev. Tam GIF selže úplně a WebP odvede slušnou práci, ale AVIF odvede nejlepší. Rozdíl ve velikosti souboru při stejné kvalitě je znatelný.
Podpora AVIF animací v prohlížečích je dobrá, ale ne perfektní. Safari přidalo podporu animovaného AVIF až v roce 2023 a starší verze ho nepřehrají. Pro weby cílící na konzervativnější publikum s pomalejší aktualizací zařízení je bezpečnější zůstat u WebP a AVIF přidat jako volitelný upgrade přes element <picture>.
Pro většinu běžných animací na webu je rozdíl mezi WebP a AVIF v praxi méně dramatický než rozdíl mezi GIF a WebP. Přechod z GIF na WebP přináší okamžitý a měřitelný zisk. Přechod z WebP na AVIF je optimalizace pro ty, kdo chtějí vytěžit maximum.
Kdy místo animace použít video?
Tady GIF prohrává nejvýrazněji. Animace delší než tři sekundy nebo animace s bohatým obsahem jsou na webu efektivnější jako video ve formátu MP4 nebo WebM. Soubor bývá mnohonásobně menší, kvalita výrazně lepší a prohlížeč přehraje video s hardwarovou akcelerací, zatímco GIF zatěžuje procesor.
Atribut autoplay, loop, muted a playsinline na HTML elementu <video> vytvoří chování identické s GIF animací, ale bez jeho nevýhod. Uživatel rozdíl nepozná. Vývojář ano.
Tři formáty, tři různé příběhy
GIF přežívá tam, kde mu moderní formáty nemohou konkurovat: v e-mailech, chatovacích platformách a sdílení přes Giphy. Mimo tyto oblasti ztrácí důvod k existenci. WebP je dnes výchozí volba pro animace na webu s plnou podporou prohlížečů a výrazně menšími soubory. AVIF je krok dál pro ty, kdo optimalizují do detailu a cílí na moderní prohlížeče.
Volba formátu je pragmatické rozhodnutí podle toho, kde se animace zobrazí a kdo ji uvidí. Znáte-li odpověď na tuhle otázku, správný formát se vybere sám.
Související příspěvky:
Hodláte v Brně pronajímat nebytové prostory? Co musí obsahovat nájemní smlouva a jaká práva a povinnosti z ní pro obě strany vyplývají
GDPR a ochrana osobních údajů ve světě marketingu na sociálních sítích
Dětské ručníky s vlastní výšivkou – vyzkoušejte hravé motivy pro nejmenší
Co odhalí technická SEO analýza se SEOtest.online a jak její výsledky využít?