Jak zmenšit obrázek bez viditelné ztráty kvality
Váš web se načítá šest sekund. E-mail se vrátí, protože příloha je příliš velká. Příspěvek na sociálních sítích vypadá skvěle, ale nahrávání trvalo věčnost. Téměř vždy je viníkem to samé: obrázky, které jsou daleko větší, než potřebují být.
Dobrá zpráva je, že velikost souborů obrázků lze výrazně snížit — často o 70 % a více — bez jakéhokoli viditelného rozdílu v kvalitě. Klíčem je pochopit, co obrázky vůbec zvětšuje.
Rozlišení vs. velikost souboru: klíčový rozdíl
Mnoho lidí si plete rozlišení obrázku s velikostí souboru. Jsou to věci, které spolu souvisejí, ale jsou oddělené.
Rozlišení je počet pixelů v obrázku, měřený jako šířka × výška. Obrázek 4000 × 3000 pixelů má 12 milionů pixelů (12 megapixelů). Rozlišení určuje, jak velký může být obrázek zobrazován, aniž by vypadal rozmazaně.
Velikost souboru je počet bajtů, které obrázek zabírá na disku. Závisí na rozlišení, ale také na formátu, úrovni komprese a obsahu obrázku.
Tady je důvod, proč na tomto rozdílu záleží: obrázek 4000 × 3000 zobrazený ve velikosti 800 × 600 na webu plýtvá více než 90 % svých pixelů. Prohlížeč musí stáhnout všech 12 milionů pixelů a pak většinu z nich zahodit, aby zobrazil obrázek v menší velikosti. Změna velikosti obrázku na skutečné zobrazovací rozměry před nahráním může snížit velikost souboru o 80 % a více, bez jakéhokoli viditelného rozdílu.
Věděli jste? Typická fotografie ze smartphonu má 4000 × 3000 pixelů nebo více. Obrázek na celou šířku webu zřídka potřebuje více než 1920 × 1080 pixelů. Pro miniaturu na blogu obvykle stačí 600 × 400 pixelů.
Pochopení formátů obrázků
Zvolený formát má obrovský vliv na velikost souboru.
JPG (JPEG)
Univerzální standard pro fotografie. JPG používá ztrátovou kompresi, což znamená, že zahazuje část obrazových dat, která lidské oko pravděpodobně nepozoruje. Při kvalitě 80–85 % vypadají obrázky JPG identicky s originálem, ale jsou zlomkem velikosti.
Nejlepší pro: Fotografie, obrázky s přechody, realistické snímky.
PNG
PNG používá bezztrátovou kompresi: žádná data se nezahazují. To je ideální pro obrázky vyžadující přesnou reprodukci pixelů, jako jsou loga, snímky obrazovky a grafika s textem. Soubory PNG jsou však pro fotografický obsah výrazně větší než JPG.
Nejlepší pro: Loga, snímky obrazovky, grafiku s textem, obrázky vyžadující průhlednost.
WebP
Vyvinutý společností Google, WebP nabízí ztrátovou i bezztrátovou kompresi. Produkuje soubory o 25–35 % menší než JPG při stejné kvalitě a podporuje průhlednost (na rozdíl od JPG). Všechny moderní prohlížeče WebP podporují.
Nejlepší pro: Webové obrázky jakéhokoli typu. Nejlepší dostupný univerzální webový formát.
| Formát | Komprese | Průhlednost | Typická velikost fotografie |
|---|---|---|---|
| JPG | Ztrátová | Ne | 200–500 KB |
| PNG | Bezztrátová | Ano | 1–5 MB |
| WebP | Obojí | Ano | 150–350 KB |
Tip Pokud máte obrázky WebP, které potřebujete konvertovat kvůli kompatibilitě, podívejte se na náš průvodce: Jak konvertovat WebP do JPG.
Jak funguje komprese obrázků
Všechna komprese obrázků využívá stejný základní princip: lidské oko nedokáže vnímat každý detail, který fotoaparát zachytí. Kompresní algoritmy identifikují a odstraňují informace, jejichž absence si nikdy nevšimnete.
Ztrátová komprese konkrétně využívá:
- Citlivost na barvy. Lidské oči jsou citlivější na změny jasu než na změny barev. Komprese snižuje přesnost barev agresivněji.
- Vysokofrekvenční detaily. Jemné textury a jemné přechody lze zjednodušit bez znatelného efektu.
- Redundance. Oblasti podobné barvy (modrá obloha, bílá zeď) lze reprezentovat efektivněji.
Trik spočívá v nalezení správné úrovně komprese. Příliš malá komprese plýtvá šířkou pásma. Příliš velká komprese zavádí viditelné artefakty: rozmazání, pruhy a blokovité oblasti.
Praktická pravidla pro různé případy použití
Pro weby
- Maximální šířka: 1920 pixelů pro hero obrázky na celou šířku, 800–1200 pixelů pro obsahové obrázky
- Formát: WebP s záložním JPG
- Kvalita: 75–85 %
- Cílová velikost: pod 200 KB na obrázek, pod 100 KB pro miniatury
Pro e-mailové přílohy
- Maximální šířka: 1200–1600 pixelů
- Formát: JPG (univerzální kompatibilita)
- Kvalita: 80–85 %
- Cílová velikost: pod 500 KB na obrázek, celkové přílohy pod 10 MB
Pro sociální sítě
Každá platforma má své optimální rozměry, ale obecně platí:
- Instagram: 1080 × 1080 (čtvercový), 1080 × 1350 (na výšku)
- Facebook: 1200 × 630 pro náhledy odkazů
- LinkedIn: 1200 × 627
- Formát: JPG nebo PNG
- Kvalita: 85–90 % (platformy vaše obrázky při nahrávání znovu komprimují, takže začít s o něco vyšší kvalitou je moudré)
Varování Platformy sociálních sítí komprimují vaše obrázky znovu po nahrání. Pokud nahrajete již silně komprimovaný obrázek, dvojitá komprese může produkovat viditelné artefakty. Začněte s mírně komprimovanými obrázky (kvalita 85 %+) a nechte platformu provést vlastní optimalizaci.
Nejčastější chyby
1. Nahrávání originálních souborů z fotoaparátu
Surová fotografie z moderního smartphonu má 3–8 MB. Surový soubor ze zrcadlovky může mít 25–50 MB. Jejich přímé nahrávání na web je nejčastější příčinou pomalu se načítajících stránek.
2. Používání PNG pro fotografie
PNG je špatný formát pro fotografie. Fotografie uložená jako PNG může být 5–10× větší než tatáž fotografie uložená jako JPG při kvalitě 85 %, bez jakéhokoli viditelného rozdílu.
3. Nekomprimování bez předchozí změny velikosti
Komprimace obrázku o šířce 4000 pixelů na 200 KB je daleko méně efektivní než jeho nejprve zmenšení na šířku 1200 pixelů a poté komprese. Nejprve změňte velikost, pak komprimujte.
4. Opakované komprimování
Pokaždé, když otevřete JPG, upravíte ho a znovu uložíte, dojde k jeho rekomprimaci. Po několika cyklech úprav a ukládání se kvalita viditelně sníží. Vždy pracujte z originálu a komprimujte pouze konečnou verzi.
Tip Komprimujte obrázky zdarma přímo v prohlížeči: Jak komprimovat obrázek. Upravte kvalitu, změňte rozměry a sledujte úspory velikosti souboru v reálném čase.
Dopad optimalizace obrázků
Optimalizace obrázků není jen otázkou pohodlí. Pro weby přímo ovlivňuje:
- Rychlost načítání stránky. Rychlejší stránky se umísťují výše ve výsledcích vyhledávání Google.
- Uživatelský zážitek. 53 % mobilních uživatelů opustí stránky, které se načítají déle než 3 sekundy.
- Náklady na přenos dat. Pro weby s vysokou návštěvností může optimalizace obrázků ušetřit výrazné náklady na hosting.
- Přístupnost. Uživatelé s pomalým připojením nebo omezeným datovým plánem z toho profitují enormně.
Připraveni optimalizovat obrázky? Postupujte podle návodu krok za krokem: Jak komprimovat obrázek. Je zdarma, funguje v prohlížeči a umožňuje vidět rozdíl v kvalitě před stažením.