[Jak ho správně psát] ALT pro obrázky v SEO. Co je alternativní text?

Alternativní text je známý jako ALT atribut se používá v HTML kódu pro vysvětlení významu obrázku textovou formou. Například pro obrázek rajčete použijte ALT=“rajče“. V jednoduchosti lze říci, že alternativním textem popisujeme to, co na obrázku je, aby tomu porozuměl vyhledávač nebo nevidomí lidé, kterým to čte nějaké zařízení.

Roboti vyhledávačů (Google, Seznam.cz, Bing, Yandex), tak dokáží pochopit význam obrázku na stránce. Podle toho pak mohou svým uživatelům nabídnou lepší výsledky ve vyhledávání.

Stránky mohou navštěvovat i nevidomí lidé, kterým obsah stránek předčítá počítač. Proto je důležité vystihnout alternativní popisek obrázku co nejlépe, aby opravdu tak nějak popsal skutečný obsah obrázku.

Co je ALT text?

ALT text, známý také jako alternativní text nebo ALT popisek, je krátký textový popis obrázků na webových stránkách. Jeho primárním účelem je popsat obsah a funkci obrázku uživatelům, kteří obrázek nemohou vidět. To zahrnuje uživatele se zrakovým postižením, kteří používají čtečky obrazovky, a situace, kdy obrázky na webu nemohou být z různých důvodů načteny.

Využití ALT textu je rovněž důležité pro SEO základy 2024, neboť vyhledávače, jako je Google, tento text používají k lepšímu porozumění obsahu obrázků na vašich stránkách. Přesný a popisný ALT text pomáhá zlepšit vaše hodnocení ve vyhledávání, zvláště v obrázkovém vyhledávání, a tím podporuje organický provoz na vašem webu.

Jak používat ALT text na stránkách

Pokud se věnujete blogování nebo vlastníte eshop, tak jste se určitě s  atributem ALT (alternativním textem) v kódu při vkládání obrázku setkali. Jméno i ALT text fotografie by měl mít přesný název toho, co na fotografii je. Pro příklad sem vložím fotografii klávesnice s detailem na klávesu.

Při psaní ALT textu je klíčové zaměřit se na jasnost a stručnost. Text by měl přesně popisovat obrázek, ale zároveň být dostatečně stručný, aby byl snadno čitelný. Je důležité zahrnout relevantní klíčová slova, ale vyvarovat se jejich nadměrnému a nepřirozenému používání, což by mohlo působit rušivě a negativně ovlivnit uživatelský zážitek.

Pro weby, které se zaměřují na přístupnost, je ALT text nezbytný. Nejenže podporuje zrakově postižené uživatele, ale zároveň zvyšuje celkovou kvalitu a hodnotu vašeho webu. Efektivní využívání ALT textu je tedy klíčovou součástí jakékoli úspěšné SEO strategie a webového designu, který si klade za cíl být inkluzivní a přístupný pro všechny uživatele.

Ukázka HTML kódu alternativního textu

Tahle vypadá HTML kód pro vložení obrázku na stránky s vyplněným ALT – textem .

<img src="https://pajskr.cz/wp-content/uploads/2019/05/klavesa-alt.jpg" alt="Klávesa ALT na klávesnici">

Takto vypadá výsledný HTML kód, který si mohou přečíst roboti vyhledávačů. Čím výstižnější text, tím lépe mohou vyhledávače obrázek pochopit a zaindexovat do svých výsledků.

Příklad použití ALT textu

Nesnažte se při vyplňování alternativního textu švindlovat a  ovlivňovat tím výsledky vyhledávání. Pamatujte, že ALT text by měl pasovat do celkového kontextu webové stránky a informací, které se na ní píší. To přispívá k celkovému pochopení stránky vyhledávačem. A nakonec i člověkem, který ocení pravdivé informace na stránce.

Příklady, jak psát ALT text

<img src="oblozeny-toast.jpg" alt="Obložený toast">

Stručný a pravdivý alternativní text k obrázku. Jde to i lépe.

<img src="anglicka-snidane.jpg" alt="Obložený toast s klobásou, opečenou slaninou a rajčaty">

Toto je lepší ALT, protože lépe a detailněji vystihuje obsah obrázku. Není tam jen toast, ale také klobása, slanina i rajčata.

Nedoporučuji

Někdy se tvůrci stránek nechávají strhnout k ovlivňování výsledků  vyhledávání. Dělají to tak, že se snaží do alternativního popisku vměstnat co největší počet klíčových slov. Výsledek pak vypadá nějak takhle.

<img src="anglicka-snidane.jpg" alt="Anglická snídaně recept, toast, obložený toast, klobása, toast, opečená slanina, snídaně recept ">

Popisek vám o fotografii nic neřekne. Vyhledávač ho většinou pochopí špatně, nebo vůbec. Nakonec takový obrázek prostě ignoruje. Toto je odstrašující příklad práce SEO šamana. Zkušený SEO konzultant by se něčeho podobného nikdy nedopustil a web copywriter jakbysmet.

Proč je alternativní text obrázku důležitý

Přístupný obsah

I nevidomý uživatelé mohou používat webové stránky a ALT text jim pomáhá stránky pochopit. Programy pro čtení obrazovky nemají rozum a tak čtou text, který jim je předložený.

ALT tag v SEO

Obrázky s dokonalým ALT popiskem dokáží na stránky přivádět přesně zacílené návštěvníky. Alternativním textem pomůžete vyhledávači pochopit obsah obrázku. Vyhledávač si dokáže spojit kontext textových informací na stránce s ALT popiskem a vyhodnotit jeho relevanci a přínos pro uživatele. Pokud splníte i ostatní důležité SEO prvky (více Základy SEO) jako je kvalita obsahu, přínos uživatelů atd., tak máte téměř vyhráno a  můžete se ucházet o první příčky ve vyhledávacích žebříčcích.

Pravidla pro psaní ALT textu

1. Popište obrázek co nejpřesněji a nejpravdivěji.
2. Snažte se nepsat popisek delší než 125 znaků. Včetně mezer.
3. Používejte v popisku klíčová slova.
4. Nesnažte se obrázky se špatným alternativním textem ovlivňovat výsledky vyhledávání.
5. Do ALT textu nepište slova jako „obrázek nebo fotografie“. Je to zbytečné.

Závěr

ALT atribut se vyplňuje proto, aby pomohl vyhledávačům a uživatelům pochopit obrázek a zpříjemnit uživatelský dojem z webových stránek.

Nesnažte se obrázky ovlivňovat výsledky vyhledávání. Krátkodobě vám to může zvýšit návštěvnost, ale z dlouhodobého měřítka na tom budete tratit, protože brzy zjistí, že se na vašich stránkách nenachází to, co je tam přivedlo. To uživatele přiměje kliknout na tlačítko zpět v  prohlížeči. Google toto gesto dokáže vyhodnotit a podle toho bude web klesat ve výsledcích vyhledávání. Nakonec ho nikdo nedohledá. A to přeci nechcete.