Otázka, jak velký smí JPEG soubor na webu vůbec být, nemá jednu univerzální odpověď, protože se liší podle toho, k čemu obrázek slouží. JPEG optimalizátor online pomáhá tuhle cílovou velikost reálně trefit, místo aby autor obsahu jen odhadoval, jestli komprese stačila. Vyzkoušet si to jde, podívejte se zde. Tento text navazuje na dřívější checklist rychlosti webu, který u produktové fotografie doporučil nepřekračovat 150 kilobajtů, a rozšiřuje tuto hranici i na další typy obrázků, se kterými se web běžně setkává.
Jaká velikost JPEG souboru je na webu ještě v pořádku
Tento starší checklist osmi kroků ke zrychlení webu doporučuje, aby JPEG soubor s produktovou fotografií nepřesáhl 150 kilobajtů, přičemž vizuální kvalita při správné kompresi zůstane pro návštěvníka nepostřehnutelná. Podobnou hranici, obrázek pod 1 megabajt a v ideálním případě v nižších stovkách kilobajtů, uvádí i tento návod na optimalizaci obrázků pro e-shop. Pro jiné typy obsahu ale platí úplně jiná čísla, tlačítko může vystačit s pár kilobajty, zatímco ilustrační obrázek snese klidně desítky. Podle stejného přehledu se u pozadí stránky za rozumnou hranici považuje kolem 20 kilobajtů, u reklamního banneru zhruba 25 kilobajtů, u zmenšeniny fotky jen jednotky kilobajtů a u složitějšího diagramu nebo komixu klidně stovka. Tyto hodnoty samozřejmě nejsou přesným zákonem, spíš orientačním rámcem, ve kterém se dá s jistotou pohybovat bez obav z toho, že obrázek stránku zbytečně zatíží.
Jak si stanovit vlastní cílovou velikost
Nejjednodušší postup je zařadit každý obrázek na stránce do jedné z několika kategorií podle role, kterou hraje, a pro každou kategorii si předem stanovit horní hranici v kilobajtech. Ikony a tlačítka patří do té nejpřísnější kategorie, hlavní fotografie do té nejbenevolentnější, a všechno ostatní se rozloží mezi ně podle toho, jak moc detailů návštěvník skutečně potřebuje vidět.
Proč se cílová velikost liší podle typu obsahu
Hlavní produktová fotografie na detailu zboží nese víc vizuální informace, kterou zákazník skutečně potřebuje vidět, takže si zaslouží víc kilobajtů než malá zmenšenina ve výpisu kategorie. Titulní obrázek v hlavičce stránky se navíc načítá jako první, ještě předtím, než se stihne zobrazit zbytek obsahu, takže jeho velikost ovlivňuje první dojem z rychlosti celé stránky mnohem víc než obrázek někde uprostřed dlouhého textu.
Jak JPEG optimalizátor online pomůže cíl trefit
Bez nástroje na kompresi zbývá jen odhad, jak moc obrázek zmenšit, a opakované ukládání zkouškou omylu v grafickém programu. Online optimalizátor místo toho ukáže náhled výsledné velikosti souboru přímo u posuvníku kvality, takže jde vidět, při jaké úrovni komprese se soubor vejde pod stanovenou hranici. Porovnání verze před úpravou a po ní navíc rovnou potvrdí, jestli komprese na cílové velikosti nezanechala viditelné artefakty. U dávky víc fotografií ze stejné sady, třeba produktových záběrů jednoho zboží z různých úhlů, jde tímto způsobem projít celou skupinu souborů a u každého zvlášť potvrdit, že padl do stejné cílové kategorie, aniž by výsledná kvalita mezi jednotlivými snímky kolísala.
Kdy je i menší JPEG pořád moc velký
Zmenšení souboru samotnou kompresí má svůj strop, pokud fotografie zůstává v původním rozlišení. Obrázek pořízený v rozlišení pro tisk nebo pro velký monitor, zobrazený na stránce v šířce pár set pixelů, ponese zbytečně mnoho dat i po agresivní kompresi, protože prohlížeč stejně zobrazí jen zlomek přenesených pixelů. V takovém případě nejdřív pomůže zmenšení rozměrů na cílovou velikost zobrazení, teprve pak dává komprese plný smysl. Fotografie s rozlišením 4000 na 3000 pixelů, zobrazená na stránce v šířce 600 pixelů, přenáší i po kompresi zbytečně mnoho dat, protože prohlížeč sedminásobně větší obrázek stejně jen zmenší přímo v okně. Zmenšení rozměrů na skutečnou zobrazovanou velikost dokáže samo o sobě ušetřit víc dat než další zpřísňování komprese na už tak zmenšeném rozlišení.
Co se děje s nahranými soubory
Online nástroje tohoto typu obvykle zpracují soubor a po určité době, často po hodině od nahrání, data automaticky odstraní ze serveru. Původní fotografie zůstává nedotčená v zařízení uživatele, takže je možné kdykoliv zkusit jinou úroveň komprese a znovu porovnat výslednou velikost s cílovou hranicí.
Nejčastější chyby v praxi
V praxi se u velikosti JPEG souborů na webu opakuje několik podobných problémů:
- Použití stejné cílové velikosti pro hlavní produktovou fotografii i pro malou zmenšeninu ve výpisu.
- Komprese fotografie v původním, zbytečně velkém rozlišení místo nejprve zmenšení rozměrů na cílovou šířku zobrazení.
- Spoléhání na odhad místo skutečného ověření výsledné velikosti souboru po kompresi.
- Ponechání titulního obrázku v hlavičce stránky mimo cílové hranice, přestože se načítá jako první ze všech.
Co si z tohoto postupu odnést
Cílová velikost JPEG souboru se liší podle role, kterou obrázek na stránce hraje, od pár kilobajtů u tlačítka až po stovky kilobajtů u hlavní produktové fotografie. Online optimalizátor, u kterého jde náhledovat velikost výsledku ještě před stažením, mění odhad na ověřitelný výsledek a šetří čas, který by jinak zabralo opakované zkoušení v grafickém programu.
Máte pro jednotlivé typy obrázků na svém webu stanovenou cílovou velikost souboru, nebo kompresi řešíte stejně u všech bez rozdílu?
