RychlostWeb Logo RychlostWeb Kontaktujte nás

Komprese obrázků bez ztráty kvality

Snižte velikost obrázků o 40–60 procent. Naučte se používat WebP, optimalizovat JPEG a PNG formáty správně.

12 min čtení Středně pokročilý Únor 2026
Složka s obrázky a ikona komprese znázorňující redukci velikosti souborů bez ztráty kvality

Proč je komprese obrázků tak důležitá?

Obrázky jsou největším viníkem pomalých webů. Když uživatel čeká na načtení stránky, často čeká právě na obrázky. Nejsou to zbytečné informace — jsou to skutečná data, která musíte přenášet.

Dobrá zpráva? Můžete zmenšit velikost obrázků o 40 až 60 procent a téměř nikdo to nepozná. Obrázky budou vypadat stejně, ale vaše web se bude otevírat o sekundy rychleji. Pro uživatele to znamená lepší zážitek. Pro vás to znamená lepší hodnocení v Google.

Graf ukazující rozdíl mezi původní a komprimovanou velikostí obrázků

Formáty, kterým skutečně věřit

Ne všechny formáty jsou stejné. WebP je nejmodernější, ale JPEG a PNG stále dominují. Věděli jste, že mnoho webů používá stále PNG pro fotografie? To je chyba.

WebP

Nejlepší poměr kvality a velikosti. Je až o 30 procent menší než JPEG. Prohlížeče ho podporují od roku 2018.

JPEG

Ideální pro fotografie. Podporuje miliony barev a je kompatibilní všude. Kvalita se nastavuje — vy říkáte, jak moc chcete zmenšit.

PNG

Nejlepší pro obrázky s průhledností a ikony. Ale pro fotografie? Používejte JPEG nebo WebP místo toho.

Softwarové nástroje pro kompresi obrázků - TinyPNG, ImageOptim, Squoosh

Jak kompresi dělat správně

Komprese není tajemství. Je to věda. Tady je přesný postup, který vám pomůže.

  1. Zvolte správný formát. Fotografie? JPEG nebo WebP. Ikony nebo grafika s textem? PNG.
  2. Zmenšete rozměry. Obrázek 40003000 pixelů, když ho zobrazujete v 400300 pixelech? To je marnotratství. Připravte obrázek na skutečnou velikost.
  3. Nastavte kvalitu. U JPEG kvalitu nastavíte na 75–85 procent. Uživatel rozdíl nevidí, ale velikost se sníží o 40 procent.
  4. Odstraňte metadata. Fotografie obsahuje EXIF data — datum pořízení, typ fotoaparátu. Web to nepotřebuje.
  5. Zkomprimujte online. Nástroje jako TinyPNG nebo Squoosh dělají veškerou práci za vás. Nahrajete obrázek, stáhnete optimalizovanou verzi.

Nástroje, které se vyplatí znát

Máte spoustu možností. Tady jsou nejlepší.

TinyPNG / TinyJPG

Online nástroj, který kompresi zvládne bez selhání. Nahrajete až 20 obrázků najednou. Není to ideální pro hromadné zpracování, ale výsledky jsou skvělé.

Google Squoosh

Bezplatný webový nástroj od Google. Vidíte náhled v reálném čase. Můžete měnit kvalitu a srovnávat velikost před a po.

ImageOptim (Mac)

Desktopová aplikace, kterou jednoduše přetáhnete obrázky. Automaticky je zoptimalizuje. Pro Mac uživatele je to nejrychlejší řešení.

ImageMagick

Pro vývojáře. Příkazový řádek, který vám umožní automatizovat kompresi. Nakalibrujete jednou, pak běží pro stovky obrázků.

Praktická čísla: co očekávat

Když správně kompresi nastavíte, uvidíte velké rozdíly. Tady je příklad z reálného projektu.

Původní JPEG fotografie: 2.4 MB

Kvalita 85 procent: 680 kB (snížení o 71 procent)

Převedeno na WebP: 420 kB (snížení o 82 procent)

A rozdíl v kvalitě? Skoro žádný. Uživatel fotku vidí stejně ostrý. Ale web se otevírá výrazně rychleji.

Příklad reálného obrázku před a po kompresi - stejná kvalita, ale menší velikost
Responzivní obrázky - různé verze pro mobilní a desktopové zařízení

Pokročilé techniky: srcset a picture element

Komprese je důležitá. Ale chytrá volba obrázků je ještě důležitější. Existují dva způsoby, jak posílat správný obrázek správnému zařízení.

Použijte srcset pro jednoduché případy. Atribut vám umožní poskytnout více verzí obrázku v různých rozlišeních. Mobilní zařízení dostane menší verzi, desktop dostane větší. Všechny jsou zkomprimované, ale každé zařízení dostane přesně to, co potřebuje.

Pro komplexnější scénáře? Element picture vám dá úplnou kontrolu. Můžete posílat WebP prohlížečům, které ho podporují, a PNG těm, které ne. Tím kombinujete nejlepší kvalitu s největší kompatibilitou.

Na závěr

Komprese obrázků není věda. Je to jednoduchý krok, který můžete udělat dnes. Nebude vás to trvat dlouho — pár hodin a vaši obrázky budou připravené.

Výhody? Váš web se otevírá rychleji. Uživatelé jsou spokojení. Google vás lépe hodnotí. Je to snadné. Začněte s TinyPNG a zkomprimujte první obrázky. Pak můžete jít dál.

Chcete pokračovat v optimalizaci?

Komprese obrázků je jen jeden krok. Zjistěte, jak vylepšit Core Web Vitals a zrychlit váš web ještě více.

Přečtěte si další článek

Důležité upozornění

Tato příručka je určena pro vzdělávací účely. Cílem je poskytnout vám znalosti o kompresi obrázků a optimalizaci webu. Postupy popsané zde jsou běžné praktiky používané profesionály. Výsledky se mohou lišit v závislosti na typu obrázku, formátu a nastavení komprese. Doporučujeme vždy testovat kompresi na vlastních obrázcích a ověřit si, že výsledná kvalita vám vyhovuje. Každý projekt je jedinečný a to, co funguje pro jednu stránku, nemusí fungovat stejně pro druhou.