Aby se uživatelům váš web líbil, nestačí jen kvalitní text. Důležité jsou i hezké obrázky, které často dokážou říci více než 1 000 slov. Ovšem abyste z obrázků získali opravdu maximum, je potřeba je správně optimalizovat, opravdu nestačí jen nahrát je do backendu vašeho webu.
►Pokud vaše obrázky nejsou optimalizované, zakládáte si na vážný problém v podobě zpomalení rychlosti stránky. Navíc vyhledávače nedokážou přečíst vaše obrázky bez alt textu.
Pojďme si společně ukázat, jak to změnit
Optimalizace obrázků vytváří mnoho výhod, jako je lepší uživatelský zážitek, rychlejší načítání stránek a další možnosti hodnocení. A navíc hraje stále důležitější roli v samotném vyhledávání, jelikož více než 20 % všech vyhledávání Google se odehrává právě ve vyhledávání obrázků.
Které faktory jsou však nejdůležitější pro to, aby byly vaše obrázky snadno nalezitelné ve vyhledávačích a současně nezpomalovaly váš web?
Zde je několik důležitých tipů pro optimalizaci obrázků, které byste měli znát.
Zvolte správný formát obrázku
Vyznat se ve všech různých formátech obrázků vám může připadat složité, ale přesto se před přidáváním obrázků na vaše stránky vyplatí ujistit se, že jste vybrali ten nejlepší typ souboru. I když existuje mnoho formátů obrázků, z nichž si můžete vybrat, pro web jsou nejběžnější PNG a JPEG.
- PNG: Vytváří kvalitnější obrázky, ale je s ním spojena větší velikost souboru. Umožňuje však efekt průhlednosti.
- JPEG: Může mít nižší kvalitu obrázku, ale můžete nastavit úroveň kvality komprese, abyste našli dobrou rovnováhu mezi kvalitou a velikostí.
Obrázky komprimujte
Jednou z největších chyb při správě webových stránek je nahrávání nekomprimovaných souborů. Komprimace zmenší velikost obrázků a zrychlí jejich načítání. Proto vřele doporučujeme obrázky před nahráním na web komprimovat. Můžete to provést ve Photoshopu nebo použít nástroj, jako je TinyPNG, který má i plugin pro WordPress, který můžete použít také. Skvělý je i plugin WP Smush pro WordPress. Zmenšuje velikost souboru obrázku, aniž by snížil jeho kvalitu.
Ať už použijete jakýkoli plugin, ujistěte se, že jste našli takový, který komprimuje obrázky externě na svých serverech. Sníží to zátěž vašeho vlastního webu.
Můžete jít ještě o krok dál a použít CDN pro obrázky, které dokáže detekovat zařízení a optimalizovat obrázek před doručením do prohlížeče. Můžete vyzkoušet například Cloudinary nebo Imgix.
►Čím budou vaše obrázky komprimovanější, tím bude váš web rychlejší. Pokud si nejste jisti, jak vaše obrázky ovlivňují rychlost stránek, doporučuji použít bezplatný nástroj PageSpeed Insights od Google.
Používejte unikátní obrázky
Jistě chcete, aby vaše fotografie na webu vynikly. Pokud svůj web zaplníte obrázky z fotobank, budete neoriginální – stejně jako tisíce jiných webů.
Obrázky z fotobank jsou sice hezké, ale používá je každý. Na vaše návštěvníky nebude působit příliš dobře, pokud na webu uvidí stejný obrázek jako u všech vašich konkurentů. A pokud se to nebude líbit návštěvníkům, nebudou spokojeny ani vyhledávače.
I když můžete mít své obrázky z fotobank dokonale optimalizované, nebudou mít stejný dopad ani potenciální přínos pro SEO jako originální, vysoce kvalitní obrázek.
►Čím více originálních obrázků máte, tím lepší bude uživatelský zážitek a tím větší máte šanci na umístění v relevantních vyhledáváních.
Používejte velké obrázky
Mějte na paměti, že velké obrázky mají větší pravděpodobnost, že se objeví ve službě Google Discover, což vám přinese spoustu návštěvníků. Velké obrázky musí mít šířku alespoň 1200 px a musí být povoleny pomocí nastavení max-image-preview:large nebo pomocí AMP.
Pozor na autorská práva
Bez ohledu na to, jaké fotografie se rozhodnete použít, ujistěte se, že nedochází ke konfliktu s autorskými právy. Pokud byste na webu zveřejnili obrázek, u kterého nemáte licenci k jeho použití, riskujete drahý soudní spor.
Soubory s obrázky správně pojmenujte
Pokud jde o SEO, je naprosto zásadní vytvářet popisné názvy souborů bohaté na klíčová slova. Názvy souborů obrázků upozorňují Google a další vyhledávače na to, co je předmětem obrázku. Obvykle názvy souborů vypadají jako "IMG_4523659" nebo něco podobného. To ovšem nikomu nic neřekne. Mnohem lepší je například „název_produktu.jpg“, z kterého je ihned jasné, o co jde. Změňte název souboru tak, aby vyhledávače lépe porozuměly jeho obsahu a zvýšily jeho hodnotu pro SEO.
Vyžaduje to trochu práce v závislosti na tom, jak rozsáhlá je vaše knihovna médií, ale změna výchozího názvu obrázku je vždy dobrý nápad. Představte si, že máte například obrázek mobilního telefonu. Mohli byste jej pojmenovat jednoduše "mobilní telefon", ale pokud na svých webových stránkách prodáváte mobilní telefony, budete zde mít pravděpodobně obrázků více, a není vhodné je pojmenovávat "mobilní telefon 1", "mobilní telefon 2“ atd. Mnohem lepší je pojmenovat jej „Samsung_Galaxy_M12“, aby uživatelé i vyhledávače obrázek správně pochopili.
Napište Alt (alternativní) text vhodný pro SEO
Alt tagy jsou textovou alternativou k obrázkům, pokud je prohlížeč nedokáže správně vykreslit. Podobně jako nadpis se atribut alt používá k popisu obsahu souboru s obrázkem.
Když se obrázek nechce načíst, zobrazí se rámeček, v jehož levém horním rohu je zobrazen alt text. Ujistěte se, že se k obrázku hodí a že je relevantní.
Věnovat pozornost alt tagům je prospěšné i pro celkovou SEO strategii stránky. Přidání vhodných alt tagů k obrázkům na vašich webových stránkách totiž může pomoci vašim stránkám dosáhnout lepších pozic ve vyhledávačích díky přiřazení klíčových slov k obrázkům. Dokonce i Google říká, že alt text u obrázků je velmi důležitý. Poskytuje totiž Googlu užitečné informace o tom, o čem obrázek je. Tyto informace mu pomáhají určit nejlepší obrázek, který se zobrazí ve vyhledávání na konkrétní dotaz uživatele.
Alt text je důležitý také pro osoby, které si nemohou obrázky prohlížet samy. Popisný text alt může zrakově postiženého uživatele prostřednictvím webové čtečky upozornit, co přesně se na fotografii nachází. Řekněme, že na svých webových stránkách máte například obrázek mobilního telefonu.
Text alt by mohl znít:
<img src="Samsung_Galaxy_M12.jpg" alt=" Samsung Galaxy M12"/>.
Lepší alternativní text, který popisuje obrázek, by však zněl:
<img src="Samsung_Galaxy_M12.jpg" alt=“Samsung Galaxy M12, 4GB/64GB s 6,5 PLS IPS displejem"/>.
Optimalizujte název a popis stránky
Google také prozradil, že v rámci algoritmu vyhledávání obrázků používá název a popis vaší stránky. Na stránce podpory Google se uvádí: "Všechny základní faktory SEO na stránce, jako jsou meta data, tagy v záhlaví, text na stránce, strukturovaná data atd., ovlivňují způsob, jakým Google hodnotí vaše obrázky.“
Definujte rozměry obrázků
Pokud používáte AMP nebo PWA, je nutné definovat rozměry obrázků ve zdrojovém kódu.
Pokud však nepoužíváte ani jedno, je stále osvědčeným postupem definovat šířku a výšku pomocí atributů width a height. Poskytuje to lepší uživatelský zážitek. Navíc to prohlížečům umožňuje zvolit velikost obrázku ještě před načtením CSS. Tím se zabrání tomu, aby stránka při načítání poskakovala. Atributy rozměrů obrázku jsou také důležité pro prevenci problémů s kumulativním posunem rozložení (CLS), které mohou narušit optimalizaci Core Web Vitals.
►Klíčové je zajistit, abyste u každého prvku obrázku a videa uváděli atributy šířky a výšky. Tím prohlížeči sdělíte, kolik místa má pro daný prvek přidělit, a zabráníte tak nepříjemnému posunu obsahu, který snižuje vaše skóre CLS.
Přizpůsobte své obrázky pro mobilní zařízení
Každá stránka by dnes měla být optimalizována pro mobilní telefony. Pokud není, razantně to zvýší míru okamžitého opuštění a sníží míru konverze. Jak svou stránku optimalizovat pro mobilní telefony?
Stručně řečeno, musíte používat responzivní obrázky. To znamená, že obrázek se bude zvětšovat či zmenšovat podle velikosti displeje, na kterém se zobrazuje.
Přidání obrázků do mapy stránek
Ať už přidáváte obrázky do své mapy stránek nebo vytváříte novou mapu stránek jen pro obrázky, chcete, aby se obrázky někde v mapě stránek nacházely.
Umístění obrázků v mapě stránek výrazně zvyšuje šanci, že vyhledávače budou vaše obrázky procházet a indexovat. Výsledkem je poté větší návštěvnost webu.
Pokud používáte WordPress, můžete použít pluginy Yoast nebo RankMath, které řešení mapy stránek nabízejí.
Zdroj: marketingland.com, facebook.com, cpcstrategy.com
Autor: Vlastimil Malík
Foto zdroj: pixabay.com
