Jak zmenšit obrázek nebo fotku (a jaké velikosti použít na web)

Ve zkratce: fotku nejrychleji zmenšíte přímo tady na webu v nástroji Uprav obrázek on-line. Nahrajete ji, nastavíte kvalitu kolem 80 % a šířku (pro web obvykle 1200–1920 px) a stáhnete hotový soubor. Fotka z mobilu se tak zmenší z několika MB na stovky KB, aniž by bylo poznat, že je horší.

Správná velikost obrázků pro web v kostce:

Příliš velké obrázky zpomalují web a zhoršují SEO.

Jak zmenšit fotku online krok za krokem

V nástroji Uprav obrázek on-line to zvládnete za minutu. Postup je stejný na počítači i v mobilu:

1. Nahrajte fotky – přetažením do pole nebo kliknutím a výběrem souborů. Klidně několik najednou.
2. V Nastavení posuvníkem Kvalita zvolte 75–85 %. Formát nechte Původní, pro web zvolte WebP.
3. V Rozměrech vyberte, o kolik se má fotka zmenšit: 50 % (z mobilu vyjde asi 2000 px, to na web stačí), na náhledy 33 %. Fotka se nezdeformuje.
4. U každé fotky uvidíte nové rozměry, velikost a úsporu v procentech. Klikněte na Stáhnout, u více fotek na Stáhnout vše (ZIP).

Potřebujete fotku i oříznout nebo otočit? U fotky v seznamu klikněte na Oříznout, vyberte poměr stran a potvrďte.

Jiné online nástroje (Squoosh, TinyPNG, iloveimg) fungují podobně, každý má ale nějaký háček: jedna fotka najednou, limit počtu a velikosti souborů zdarma, nebo nahrávání fotek na cizí server.

Hromadné zmenšení fotek

Když potřebujete zmenšit desítky fotek najednou, třeba celou galerii z akce nebo fotky produktů, nahrajte je do nástroje všechny naráz. Zpracují se jedna po druhé se stejným nastavením a stáhnete je zabalené v ZIP. Na mobilu doporučuji dávky po deseti až dvaceti fotkách, ať má telefon dost paměti.

Bez internetu: ve Windows přidá nástroj Image Resizer z bezplatného balíku Microsoft PowerToys do průzkumníku volbu Změnit velikost obrázků pro označené soubory; na Macu označte fotky ve Finderu, otevřete je v Náhledu, vyberte všechny (Cmd + A) a použijte Nástroje → Upravit velikost.

Jak zmenšit velikost souboru JPG (z MB na KB)

O velikosti souboru rozhodují dvě věci a nejvíc ušetříte, když upravíte obě:

• rozměry v pixelech – fotka z mobilu má zhruba 4000 × 3000 px, na web ani do e-mailu tolik nepotřebujete. Zmenšení na šířku 1600 px sníží počet pixelů asi šestkrát.
• kvalita komprese – při kvalitě 75–85 % rozdíl okem většinou nepoznáte, soubor je ale několikrát menší než při 100 %.

Fotka z mobilu, která má 3–5 MB, má po zmenšení na 1600 px a kvalitě 80 % obvykle jen 200–400 KB. V nástroji nastavíte obojí najednou a u každé fotky hned vidíte, kolik jste ušetřili.

Nejdřív zmenšete rozměry, pak doladíte kvalitu.

Jak zmenšit fotku bez internetu

Když zrovna nemáte připojení, zmenšit fotku umí i programy, které už v počítači nebo telefonu máte. Většinou ale zvládnou jen jednu fotku a kvalitu komprese v nich nenastavíte.

Windows

• Fotky: otevřete fotku, v nabídce … (Zobrazit další) zvolte Změnit velikost obrázku, nastavte šířku nebo procenta a uložte kopii.
• Malování: Domů → Změnit velikost (Ctrl + W), zadejte pixely nebo procenta se zachováním poměru stran a uložte jako JPEG.

Mac

• Náhled: Nástroje → Upravit velikost, zadejte šířku v pixelech. Při ukládání přes Soubor → Exportovat jde posuvníkem nastavit i kvalita JPEG.
• Finder: klikněte na fotku pravým tlačítkem, zvolte Rychlé akce → Převést obrázek a vyberte formát i velikost (malá, střední, velká).

Mobil

• iPhone: při přiložení fotek do e-mailu nabídne aplikace Mail volbu velikosti (malá, střední, velká). Fotky se ukládají ve formátu HEIC, se kterým si některé weby a formuláře neporadí – nástroj výše je převede do JPG, nebo v Nastavení → Fotoaparát → Formáty zvolte Nejkompatibilnější.
• Android: galerie některých telefonů (například Samsung) má v úpravách fotky volbu Změnit velikost. Pokud ji nenajdete, otevřete v prohlížeči telefonu nástroj výše.

Proč řešit velikost obrázků na webu

Velké obrázky způsobují:

• pomalé načítání
• vyšší odchodovost
• horší pozice ve vyhledávání

Rychlost webu přímo ovlivňuje počet zákazníků.

Doporučené velikosti obrázků (px)

Úvodní obrázek (hero)

Šířka 1600–1920 px, výška podle rozvržení stránky. Větší rozlišení nemá smysl.

Obrázky v obsahu

Například fotka v sekci „O mně“: šířka 800–1200 px. Ideální poměr rychlosti a kvality.

Náhledy a menší obrázky

Stačí 400–800 px. Častá chyba je nahrávat zbytečně velké soubory.

Obrázky přes celou šířku

Maximálně zhruba 1600 px. Víc je většinou zbytečné.

Jak velké mají být obrázky v KB

Doporučené hodnoty:

• úvodní obrázek: 150–300 KB
• běžný obrázek: 50–150 KB
• malé obrázky: do 50 KB

Menší velikost = rychlejší web.

Automatická optimalizace ve WordPressu

Pokud máte web na WordPressu, pomůže plugin ShortPixel. Umí:

• automatickou kompresi
• převod do moderních formátů
• optimalizaci všech obrázků

Ideální dlouhodobé řešení.

Na webech, které tvořím na míru pro firmy a živnostníky, žádný plugin potřeba není – obrázky připravím ve správných rozměrech i formátu už při tvorbě. S úpravou fotek pomůžu i samostatně, viz grafické a fotoeditační práce.

Jaký formát obrázků použít

Nejlepší formáty pro web:

• JPG – vhodný pro fotografie
• PNG – vhodný pro grafiku s průhledností
• WebP – menší velikost, moderní standard
• AVIF – ještě menší než WebP, moderní formát

Doporučení: používejte WebP, případně AVIF.

Potřebujete obrázek převést z jednoho formátu do jiného? V převodu obrázků online zvládnete HEIC z iPhonu na JPG, PNG na JPG, JPG na PNG i JPG nebo PNG na WebP.

Nejčastější chyby

• nahrávání obrázků přímo z mobilu (několik MB)
• fotky z iPhonu ve formátu HEIC, který web neumí zobrazit
• žádná komprese
• špatné rozměry
• PNG u fotografií místo JPG nebo WebP

Výsledek: pomalý web.

Jak optimalizace obrázků ovlivňuje web

Správné obrázky:

• zrychlí načítání
• zlepší SEO
• sníží odchody návštěvníků

Často jde o jeden z nejrychlejších způsobů, jak zlepšit výkon webu.

Rychlost je jen jedna z věcí, podle kterých se pozná dobrý web. Další najdete v článcích Jak poznat kvalitní webové stránky a Co musí obsahovat web, aby přiváděl zákazníky.

Trápí vás pomalý web? Začít můžete návrhem nového webu zdarma – uvidíte, jak by mohl vypadat, a rozhodnete se až potom.