UX Dizajnzačiatočník

Čo je Alt text (Alternatívny text)?

Alt text je textový popis obrázka v HTML atribúte alt, ktorý sa zobrazí, keď sa obrázok nenačíta, a ktorý čítačky obrazovky prečítajú nevidiacim používateľom. Je dôležitý pre prístupnosť aj SEO.

Definícia Alt text

Čo je alt text

Alt text (alternatívny text) je textový popis priradený k obrázku pomocou HTML atribútu alt. Podľa WCAG je povinný pre všetky informatívne obrázky. Slúži trom hlavným účelom: sprístupňuje obsah obrázkov nevidiacim používateľom, zobrazuje sa pri chybe načítania obrázka a pomáha vyhľadávačom pochopiť obsah stránky.

Kvalitný alt text by mal byť stručný (zvyčajne do 125 znakov), výstižný a popisovať obsah a funkciu obrázka, nie jeho vizuálny vzhľad. Dekoratívne obrázky majú mať prázdny alt atribút (alt=""), aby ich screen reader preskočil.

Pravidlá pre kvalitný alt text

  • Opisujte obsah — „Graf rastu návštevnosti o 45 % za Q3 2025" namiesto „graf"
  • Nezačínajte slovami „obrázok" — screen reader už oznamuje, že ide o obrázok
  • Zohľadnite kontext — ten istý obrázok môže mať rôzny alt text podľa kontextu stránky
  • Dekoratívne obrázky — použite alt="" pre pozadia, dekorácie a vizuálne oddeľovače

Alt text a SEO

Vyhľadávače ako Google používajú alt text na pochopenie obsahu obrázkov. Kvalitný alt text zlepšuje pozíciu obrázkov vo vyhľadávaní Google Images a prispieva k celkovej relevancii stránky pre dané kľúčové slová.

Praktický príklad

Príklad: Produktová stránka e-shopu s fotografiou čiernych kožených topánok.

Zlý alt text: alt="obrázok" alebo alt="foto-produkt-123.jpg" — nedáva žiadnu informáciu.

Dobrý alt text: alt="Čierne kožené členkové topánky značky XY, veľkosti 36-44" — popisuje produkt a je užitočný pre vyhľadávače aj nevidiacich používateľov.

Často kladené otázky

Čo je alt text?

Alt text je textový popis obrázka v HTML atribúte alt. Čítačky obrazovky ho prečítajú nevidiacim používateľom a zobrazí sa, keď sa obrázok nenačíta. Je dôležitý pre prístupnosť aj SEO.

Ako napísať dobrý alt text?

Dobrý alt text je stručný (do 125 znakov), popisuje obsah a funkciu obrázka, nezačína slovami „obrázok" a zohľadňuje kontext stránky. Dekoratívne obrázky majú mať prázdny alt="".

Musí mať každý obrázok alt text?

Každý obrázok v HTML musí mať atribút alt. Informatívne obrázky majú mať popisný text, dekoratívne obrázky majú mať prázdny alt="" (nie vynechaný atribút).

Ovplyvňuje alt text SEO?

Áno, vyhľadávače používajú alt text na pochopenie obsahu obrázkov. Kvalitný alt text zlepšuje pozíciu vo vyhľadávaní Google Images a celkovú relevanciu stránky.

Súvisiace pojmy

Potrebujete pomôcť s webom?

Napíšte mi a poradím vám s vaším projektom. Prvá konzultácia je zadarmo a nezáväzná.