Úvodní stránka
Obrázky často tvoří největší část webových stránek a ve výsledcích vyhledávání Google mají vlastní kartu. Jsou důležitou součástí kompletní strategie SEO, takže jejich optimalizace je pro lepší viditelnost nezbytná.
Jak vyhledávače indexují a chápou obrázky
Vyhledávače procházejí webové stránky, aby objevily obrázky a získaly z nich data, jako jsou metadata a názvy souborů. K pochopení kontextu a obsahu obrázků používá Google faktory, jako je okolní text, název souboru obrázku, alt text, popisky a obsah stránky.
Co je SEO pro obrázky?
Optimalizace obrázků zahrnuje techniky pro zvýšení viditelnosti na stránkách s výsledky vyhledávání (SERP) pomocí komprese obrázků, používání responzivních obrázků, implementace líného načítání, přidávání relevantního textu alt, používání popisných názvů souborů a implementace strukturovaných dat.
1. Zvolte správný formát obrázku
Google podporuje formáty JPEG, PNG, WebP, BMP, GIF a SVG. Každý formát má své výhody a nevýhody:
-
PNG: Bezztrátová komprese, lepší kvalita, podpora průhlednosti, větší velikost souboru.
-
JPEG: ztrátová komprese, nastavitelná kvalita, menší velikost souboru.
-
WebP: Efektivní, menší velikost souborů, podporovaný všemi hlavními prohlížeči.
-
GIF: Vhodné pro jednoduchou grafiku a animace.
-
SVG: Vektorové, škálovatelné, ideální pro loga a ikony.
-
BMP: Velký, nekomprimovaný, vysoká kvalita, nevhodný pro web kvůli velikosti.
Doporučení: Pro optimální kvalitu a dobu načítání použijte PNG a pro nasazení na webu jej převeďte do WebP.
2. Vytváření jedinečných obrázků
Vyhněte se generickým fotografiím. Používejte originální, vysoce kvalitní obrázky, abyste zlepšili uživatelský komfort a SEO. Společnost Google doporučuje, aby obrázky byly široké alespoň 1200px a aby se v meta tagu robots používalo nastavení max-image-preview:large
, které zajistí, že se v aplikaci Google Discover budou zobrazovat jako velké obrázky.
<meta name='robots' content='index, follow, max-image-preview:large' />
3. Optimalizace názvů souborů obrázků
Používejte popisné názvy souborů bohaté na klíčová slova, abyste vyhledávačům pomohli pochopit předmět obrázku. Vyhněte se výchozím názvům jako "IMG_722019".
4. Napište Alt Text vhodný pro SEO
Značky Alt popisují obsah obrázku a zlepšují jeho přístupnost. Pomáhají také vyhledávačům pochopit kontext obrázku, což napomáhá lepšímu hodnocení.
Příklad:
<img src="chocolate-1.jpg" alt="hořká čokoláda s příchutí kávy"/>
5. Optimalizujte název a popis stránky
Zahrňte do názvu a popisu stránky relevantní klíčová slova, abyste zlepšili pozice při vyhledávání obrázků. Zajistěte optimalizaci všech faktorů SEO na stránce.
6. Definujte své rozměry
Zahrňte atributy šířky a výšky pro každý obrázek, abyste předešli problémům s kumulativním posunem rozložení (CLS) a zlepšili hodnocení Core Web Vitals.
7. Udělejte své obrázky vhodné pro mobilní zařízení
Pro responzivní obrázky, které se škálují podle zařízení uživatele, použijte atributy srcset
a sizes
.
Příklad:
<picture> <source type="image/webp" srcset="image-300w.webp 300w, image-600w.webp 600w, image-1200w.webp 1200w" sizes="(max-width: 600px) 300px, (max-width: 900px) 600px, 1200px"> <img src="image-300w.jpg" srcset="image-300w.jpg 300w, image-600w.jpg 600w, image-1200w.jpg 1200w" sizes="(max-width: 600px) 300px, (max-width: 900px) 600px, 1200px" alt="Popis obrázku"> </picture>
8. Líné načítání a přednačítání
Použijte líné načítání pro obrázky, které se nenachází na obrazovce, a zlepšete tak výkon stránky. Pro obrázky nad záhybem použijte preload nebo fetchpriority="high
".
Příklad:
<img src="image.jpg" loading="lazy" srcset="image-300w.jpg 300w, image-600w.jpg 600w" alt="Popis">
9. Přidání obrázků do mapy stránek
Zahrnutí obrázků do mapy webu zvyšuje šanci, že je vyhledávače budou procházet a indexovat. Použijte pluginy jako Yoast nebo RankMath pro WordPress nebo nástroje jako Screaming Frog.
10. Přidání strukturovaných dat
Vylepšete obrázky pomocí strukturovaných dat, abyste zlepšili viditelnost ve výsledcích vyhledávání. Pomocí značek schémat zahrňte podrobnosti, jako je cena, dostupnost a hodnocení.
Příklad:
{"@context": "http://schema.org","@type": "Article", "headline": "Article Title", "image": ["datePublished": "2024-01-10T08:00:00+08:00", "dateModified": "2024-01-10T09:20:00+08:00", "author": {"@type": "Person", "name": "Jméno autora" } }
11. Použití CDN pro rychlejší doručování obrázků
Síť pro doručování obsahu (CDN) dokáže optimalizovat a zrychlit doručování obrázků tím, že je doručuje z míst, která jsou blíže uživateli. Zvažte použití služeb, jako je Cloudflare, Amazon CloudFront, ImageKit nebo KeyCDN.
12. Pozor na autorská práva
Ujistěte se, že máte právo používat obrázky, abyste se vyhnuli nákladným soudním sporům. Používejte licencované obrázky od poskytovatelů, jako jsou Getty, Shutterstock nebo DepositFiles.
Klíčové poznatky z optimalizace obrázků
-
Zvolte správný formát a velikost souboru pro rychlejší načítání.
-
Zajistěte optimalizaci prvků SEO na stránce.
-
Vytvoření obrázkové mapy webu pro lepší procházení.
Dodržováním těchto tipů můžete zlepšit SEO optimalizaci obrázků svých webových stránek a celkovou viditelnost ve vyhledávání. Šťastnou optimalizaci!