SEO optimalizace obrázků zlepší rychlost i viditelnost webu. Jak na alt texty, názvy souborů, formáty, kompresi a lazy loading.
SEO optimalizace obrázků zajišťuje, aby obrázky na webu pomáhaly pozicím i rychlosti, místo aby je brzdily. Správně pojmenovaný, popsaný a komprimovaný obrázek přináší návštěvnost z vyhledávání obrázků, zlepšuje přístupnost a nezpomaluje načítání.
V tomto návodu vám jako SEO specialista ukážu, jak na alt texty, formáty, velikosti i lazy loading, abyste z obrázků vytěžili maximum. Je součástí průvodce On-page SEO: kompletní návod.
Co je SEO optimalizace obrázků
SEO optimalizace obrázků je soubor úprav, které pomáhají vyhledávači obrázek pochopit a zároveň zajišťují, aby nezpomaloval web. Patří sem výstižný název souboru, vyplněný alt text, vhodný formát, komprese a správná velikost.
Obrázky tvoří velkou část objemu dat na běžné stránce, takže jejich optimalizace má přímý vliv na rychlost načítání a tím i na Core Web Vitals. Zároveň dobře popsaný obrázek může přivádět návštěvnost z vyhledávání obrázků.
Optimalizace obrázků je tak oblast, kde se potkává on-page SEO, technické SEO i přístupnost. Přitom jde o úkony, které zvládnete rychle a u většiny webů přinášejí znatelný efekt.
Proč na obrázcích v SEO záleží
Obrázky ovlivňují SEO hned několika způsoby. Za prvé rychlostí – neoptimalizované obrázky bývají nejčastější příčinou pomalého webu a zhoršených Core Web Vitals.
Za druhé přístupností a srozumitelností: alt text popisuje obrázek vyhledávači i čtečkám obrazovky. Za třetí návštěvností: kvalitně popsané obrázky se zobrazují ve vyhledávání obrázků, které u některých témat přivádí významný provoz.
A konečně obrázky obohacují obsah a prodlužují čas strávený na stránce. Optimalizace obrázků proto není kosmetika, ale praktický nástroj, který zlepšuje rychlost, dostupnost i viditelnost zároveň.
U webů bohatých na fotografie, jako jsou e-shopy nebo blogy, je její dopad ještě výraznější.
Alt text: jak ho psát
Alternativní text (alt) je popis obrázku, který se zobrazí, když se obrázek nenačte, a který čtou vyhledávače i čtečky obrazovky. Měl by stručně a výstižně popsat, co je na obrázku, ideálně jednou větou.
Tam, kde to dává smysl, do něj přirozeně zapracujte klíčové slovo, ale nikdy ne na sílu – alt text není místo na hromadění slov. U dekorativních obrázků bez informační hodnoty může alt zůstat prázdný.
Dobře napsaný alt text pomáhá obrázku umístit se ve vyhledávání obrázků a zároveň zpřístupňuje obsah nevidomým uživatelům. Je to jeden z nejjednodušších on-page prvků, který se přesto často vynechává nebo odbývá.
Název souboru obrázku
Název souboru je signál, který se snadno opomíjí. Obrázek pojmenovaný nazev-produktu.jpg nese vyhledávači víc informací než IMG_4821.jpg.
Před nahráním proto soubory přejmenujte tak, aby výstižně popisovaly obsah, používaly malá písmena, pomlčky mezi slovy a žádnou diakritiku. Smysluplný název pomáhá obrázku zařadit se ve vyhledávání obrázků a doplňuje alt text.
U hromadného nahrávání se vyplatí mít na pojmenování jednoduchý systém. Jde o drobnost, ale v součtu s alt textem a kvalitním okolním obsahem tvoří jasný kontext, podle kterého Google obrázek zařadí.
Správné pojmenování navíc usnadní orientaci i vám při pozdější správě médií.
Formáty a komprese
Volba formátu ovlivňuje kvalitu i velikost obrázku. Přehled nejčastějších shrnuje tabulka:
| Formát | Hodí se na | Poznámka |
|---|---|---|
| JPG | Fotografie | Malá velikost, ztrátová komprese |
| PNG | Grafika, průhlednost | Větší soubory |
| WebP | Foto i grafiku | Menší než JPG i PNG |
| AVIF | Moderní weby | Nejlepší komprese |
Pro většinu webů je dnes ideální WebP, který nabízí výrazně menší velikost při zachování kvality. Každý obrázek navíc před nahráním komprimujte.
Velikost a rozměry obrázků
Častá chyba je nahrávat obrázky ve výrazně větším rozlišení, než web reálně potřebuje. Fotka z fotoaparátu může mít několik megabajtů a tisíce pixelů na šířku, zatímco na webu se zobrazí třeba v poloviční velikosti.
Před nahráním proto obrázek zmenšete na rozměry, ve kterých se skutečně zobrazí, a komprimujte ho. Tím razantně snížíte velikost souboru a zrychlíte načítání.
U obrázků je také dobré uvádět jejich rozměry v kódu, aby se během načítání neposouval obsah (což zhoršuje metriku CLS). Správná velikost je jeden z nejúčinnějších kroků pro rychlost webu, protože obrázky bývají zdaleka největší část přenášených dat.
Lazy loading a rychlost
Lazy loading znamená, že se obrázky mimo viditelnou oblast načtou až ve chvíli, kdy k nim uživatel doroluje. Díky tomu se úvodní část stránky zobrazí rychleji, protože prohlížeč nemusí hned stahovat všechny obrázky.
U delších stránek a e-shopů s mnoha fotkami má lazy loading velký dopad na rychlost i na Core Web Vitals. Moderní prohlížeče ho podporují nativně a u WordPressu bývá zapnutý automaticky nebo přes optimalizační plugin.
Pozor jen na hlavní obrázek v úvodní oblasti, který lazy loadingem zbytečně nezdržujte – ten chcete načíst přednostně. Správně nastavený lazy loading je tichý pomocník rychlosti, který uživatel ani nepostřehne.
Responzivní obrázky
Responzivní obrázky umožňují prohlížeči vybrat vhodnou velikost obrázku podle zařízení – menší pro mobil, větší pro desktop. Díky tomu se na telefon nestahuje zbytečně velká verze určená pro velkou obrazovku, což šetří data i čas načítání.
Technicky to řeší atributy, které moderní šablony a redakční systémy generují automaticky. Pro vás je důležité nahrávat obrázky v dostatečné kvalitě a nechat systém vytvořit potřebné velikosti.
Responzivní obrázky jsou součástí mobile-first přístupu, protože zajišťují svižné načítání i na slabších mobilních připojeních. V kombinaci s vhodným formátem a kompresí tvoří základ rychlého a zároveň pěkně vypadajícího webu.
Obrázková sitemapa a strukturovaná data
U webů, kde jsou obrázky důležité, pomáhá obrázková sitemapa nebo zahrnutí obrázků do hlavní sitemapy – vyhledávač tak snáz objeví obrázky, které chcete mít ve vyhledávání. Strukturovaná data pak mohou obrázky propojit s konkrétním obsahem, například produktem nebo receptem, a zvýšit šanci na rozšířený výsledek s náhledem.
Tyto kroky nejsou nutné pro každý web, ale u e-shopů, fotogalerií nebo receptových webů mají smysl. Většinu z toho navíc zajistí kvalitní SEO plugin.
Cílem je dát vyhledávači co nejjasnější kontext, ke kterému obsahu obrázek patří a proč je relevantní, aby ho mohl správně zařadit a zobrazit.
Vyhledávání obrázků jako zdroj návštěvnosti
Vyhledávání obrázků je u některých témat podceňovaný zdroj návštěvnosti. Lidé hledají obrázky produktů, návodů, inspirace nebo receptů a přes ně se dostávají na weby.
Aby váš obrázek měl šanci se zobrazit, potřebuje výstižný název, alt text a hlavně relevantní okolní obsah, protože Google obrázek zařazuje i podle kontextu stránky. U e-shopů a vizuálně zaměřených webů se tato optimalizace vyplatí obzvlášť.
Nejde o samostatnou disciplínu, ale o přirozený důsledek toho, že obrázky popisujete a zasazujete do kvalitního obsahu. Když to děláte důsledně, získáváte návštěvnost navíc, o kterou se konkurence s neoznačenými obrázky připravuje.
Časté chyby u obrázků, které vídám
Při auditech narážím na opakující se nedostatky v práci s obrázky:
- prázdné nebo chybějící alt texty,
- obrovské neoptimalizované soubory zpomalující web,
- názvy souborů typu IMG_1234.jpg bez popisu,
- obrázky bez uvedených rozměrů, které posouvají obsah,
- zastaralé formáty místo úspornějšího WebP.
Čím začít: priority u obrázků
Začněte u největších a nejnavštěvovanějších stránek: zkomprimujte velké obrázky, převeďte je do WebP a doplňte chybějící alt texty. Před nahráváním nových obrázků si zaveďte návyk je přejmenovat, zmenšit a popsat. U delších stránek ověřte, že funguje lazy loading. Jsou to rychlé kroky s okamžitým dopadem na rychlost i přístupnost.
- Každý důležitý obrázek potřebuje výstižný název a alt text.
- Komprimujte a používejte moderní formáty (ideálně WebP).
- Nahrávejte obrázky v rozměrech, ve kterých se zobrazí.
- Lazy loading a responzivní obrázky šetří rychlost na mobilu.
Brzdí vám obrázky web nebo z nich netěžíte návštěvnost? Rád je proženu v rámci SEO analýzy nebo komplexní optimalizace webových stránek.
Často kladené otázky
Co je alt text a k čemu slouží?
Alt text je popis obrázku, který čtou vyhledávače i čtečky obrazovky a který se zobrazí, když se obrázek nenačte. Pomáhá obrázku umístit se ve vyhledávání obrázků a zpřístupňuje obsah nevidomým uživatelům.
Jaký formát obrázků je nejlepší pro web?
Pro většinu webů je dnes ideální WebP, který nabízí menší velikost než JPG i PNG při zachování kvality. JPG se hodí na fotografie, PNG na grafiku s průhledností, AVIF nabízí nejlepší kompresi na moderních webech.
Jak obrázky nezpomalují web?
Komprimujte je, nahrávejte v rozměrech, ve kterých se zobrazí, používejte úsporný formát a zapněte lazy loading. Obrázky bývají největší část přenášených dat, takže jejich optimalizace má na rychlost největší vliv.
Musí mít každý obrázek alt text?
Informativní obrázky ano – popisuje je vyhledávači i čtečkám obrazovky. U čistě dekorativních obrázků bez informační hodnoty může alt zůstat prázdný, aby zbytečně nerušil uživatele asistivních technologií.
Mám do alt textu dávat klíčové slovo?
Pokud přirozeně popisuje obrázek, ano. Alt text má ale především popsat, co je na obrázku. Nacpávání klíčových slov do altů nepomáhá a může působit jako spam, proto ho používejte střídmě a věcně.
Přináší vyhledávání obrázků návštěvnost?
U vizuálních témat ano. Lidé hledají obrázky produktů, návodů nebo inspirace a přes ně se dostávají na weby. Výstižný název, alt text a relevantní okolní obsah zvyšují šanci, že se váš obrázek zobrazí.
