Změna velikosti obrázků řeší jinou věc než komprese kvality, protože nejde o to, kolik detailů soubor obětuje, ale kolik pixelů vlastně obsahuje. Předchozí článek o online JPEG optimalizátoru upozornil, že zdrojem pro další velikosti by měl být vždy originál, ne už dřív zkomprimovaná verze, tenhle text se věnuje kroku, který nastává hned potom, tedy tomu, na jaké rozměry se má originál vlastně přepočítat. Špatně zvolený poměr stran nebo zbytečné zvětšování malého originálu dokážou zkazit výsledek úplně jinak než agresivní komprese.
Proč zvětšení nikdy nenahradí chybějící detail
Klasický postup, kdy se malý obrázek jednoduše roztáhne na větší rozměr, vede k rozmazání, protože algoritmus si nemůže vymyslet detaily, které v původním souboru nejsou. Místo malého neostrého obrázku tak většinou vznikne jen větší mazanice, jak popisuje tento nedávný návod na zvětšení detailu fotografie pomocí umělé inteligence, podle kterého klasický ořez a roztažení obrazu často vede právě k téhle ztrátě kvality. Novější nástroje řeší tohle omezení tak, že rozpoznají hrany a textury a chybějící detaily dopočítají, místo aby jen mechanicky přepočítaly existující pixely, ale ani tahle metoda nenahradí kvalitní zdrojovou fotografii tam, kde skutečně chybí rozlišení.
Jak si nerozbít obrázek špatným poměrem stran
Obrázek má vždycky svůj přirozený poměr mezi šířkou a výškou, a pokud se při změně velikosti zadá jen jeden rozměr bez ohledu na druhý, výsledek vypadá stlačený nebo natažený. Fotografie s obličejem nebo produktem tenhle druh zkreslení prozradí na první pohled, zatímco u abstraktní grafiky si toho někdy nevšimne ani autor.
Jednoduchý výpočet, který ochrání poměr stran
Pokud má nová šířka být 800 pixelů a originál má poměr stran 16:9, stačí 800 vydělit šestnácti a výsledek vynásobit devíti, čímž vyjde odpovídající výška 450 pixelů. Stejný postup funguje i obráceně, tedy od zadané výšky k dopočítané šířce, a většina nástrojů na změnu velikosti tenhle přepočet navíc umí zamknout automaticky, takže stačí zadat jeden rozměr a druhý se dopočítá sám.
Kolik verzí velikostí web skutečně potřebuje
Předchozí článek popsal, jak atribut srcset umožní nabídnout prohlížeči víc velikostí téhož obrázku, ale nevysvětlil, kolik verzí se má vlastně připravit. V praxi se obvykle zjistí nejmenší a největší šířka, ve které se obrázek na webu zobrazí, a mezi těmito hranicemi se doplní ještě dvě až tři mezilehlé velikosti odstupňované po dvou až čtyřech stovkách pixelů. Víc verzí než tohle už přináší jen málo užitku navíc, zatímco příprava každé další velikosti stojí čas i místo na serveru.
DPI je pro web irelevantní, rozhoduje jen počet pixelů
Řada lidí si plete DPI s kvalitou obrázku na obrazovce, ačkoli tenhle údaj má smysl jedině při tisku, kde určuje, kolik bodů se vejde na jeden palec papíru. Prohlížeč ale DPI vůbec neřeší a zajímá ho jen skutečný počet pixelů na šířku a výšku, takže dva soubory se stejným rozlišením v pixelech vypadají na displeji identicky bez ohledu na to, jaké DPI mají uvedené v metadatech.
Automatizace změny rozměrů při nahrávání do WordPressu
Vedle jednorázové úpravy online nástrojem existuje i cesta automatizace přímo v redakčním systému. Plugin Imsanity umožňuje nastavit maximální šířku a výšku zvlášť pro obrázky v článcích a zvlášť pro knihovnu médií, přičemž redakční systém pak každý nahraný soubor na tenhle rozměr automaticky zmenší. Automatizace se hodí tam, kde do knihovny médií přibývají desítky souborů týdně, zatímco pro jednorázovou přípravu konkrétní sady obrázků před publikací zůstává rychlejší online nástroj s okamžitým náhledem výsledku.
Co online nástroj na změnu velikosti obrázků s nahraným souborem udělá
Nástroj po nahrání souboru nabídne zadání cílové šířky nebo výšky v pixelech spolu se zamčeným poměrem stran, takže nehrozí náhodné zkreslení. Dávkové zpracování víc souborů najednou umožňuje připravit celou sadu velikostí pro responzivní šablonu z jednoho místa, aniž by bylo nutné každý soubor upravovat zvlášť. Výsledek jde porovnat s originálem ještě před stažením, takže je vidět, zda zvolený rozměr obrázku nezpůsobil viditelné rozostř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 jiný rozměr a porovnat výsledek s předchozí verzí.
Dvě situace, které výsledek nejčastěji zkazí
První je zvětšování malého originálu na rozměr, který web potřebuje, místo dohledání zdroje s dostatečným rozlišením už od začátku. Druhá je zadání šířky i výšky ručně bez zamčeného poměru stran, a tenhle postup prakticky vždycky skončí viditelně deformovaným obrázkem, ať už jde o portrét, produktovou fotku nebo ilustraci.
Než obrázek uložíte
Poměr stran a cílové rozlišení stojí za pozornost stejnou měrou jako komprese, protože špatně zvolený rozměr obrázek zkazí jinak, ale stejně viditelně jako přehnaná ztráta kvality. Kontrola náhledu před stažením ukáže obojí najednou, takže se vyplatí nezaškrtávat ji jako samozřejmost.
Zkontrolujete si u obrázku ještě před uložením, jestli výsledný rozměr sedí na pixel přesně, nebo se spoléháte na to, že to nějak vyjde?
Související příspěvky
