Pragmatický sprievodca alternatívnym textom obrázkov v roku 2026

Prečo na alternatívnom texte stále záleží

Alternatívny text je súčasťou špecifikácie HTML od roku 1995. O tridsať rokov neskôr väčšina obrázkov na webe stále buď nemá atribút alt, alebo má alternatívny text, ktorý znie, akoby ho napísal niekto, kto nikdy nepoužil čítačku obrazovky.

Problémom už nie je povedomie. Väčšina systémov na správu obsahu dnes robí pole alt povinným. Problém je v tom, že alternatívny text sa stal kontrolnou položkou súladu namiesto komunikačného nástroja. Ľudia píšu „obrázok usmievajúcej sa osoby“, hoci skutočný kontext je „CEO oznamuje výsledky za Q4“.

Alternatívny text existuje z jedného dôvodu: má sprostredkovať účel obrázka niekomu, kto ho nevidí. Tento účel sa mení podľa kontextu. Fotografia šálky kávy na domovskej stránke kaviarne plní inú funkciu než tá istá fotografia v blogovom článku o technikách glazovania keramiky.

V roku 2026 máme aj nástroje AI, ktoré dokážu generovať alternatívny text automaticky. Tieto nástroje sa zlepšujú, no stále nerozumejú kontextu. Opisujú, čo vidia, nie prečo sa obrázok na stránke nachádza.

Rozhodovací strom: Potrebuje tento obrázok alternatívny text?

Nie každý obrázok potrebuje opisný alternatívny text. Niektoré obrázky sú dekoratívne. Niektoré sú redundantné. Niektorým lepšie poslúži popisok alebo okolitý text.

Tu je rozhodovací postup:

Sprostredkúva obrázok informáciu, ktorá nie je dostupná v okolitom texte? Ak áno, potrebuje alternatívny text. Ak nie, pravdepodobne je dekoratívny.

Chýbalo by nevidiacemu používateľovi niečo dôležité, keby tento obrázok zmizol? Ak áno, napíšte alternatívny text. Ak nie, použite prázdny atribút alt (alt=""), aby ste čítačkám obrazovky povedali, že ho majú preskočiť.

Je obrázok odkaz alebo tlačidlo? Alternatívny text sa stáva textom odkazu. Opíšte cieľ, nie obrázok. „Zobraziť cenové plány“ je lepšie než „ikona šípky“.

Je obrázok komplexný — graf, diagram alebo infografika? Alternatívny text má praktické limity dĺžky (približne 125 znakov je pohodlných pre väčšinu čítačiek obrazovky). Komplexné obrázky potrebujú dlhšie opisy, buď v popisku, v texte stránky, alebo cez aria-describedby.

Ako v skutočnosti znie dobrý alternatívny text

Dobrý alternatívny text je konkrétny, stručný a vníma kontext. Odpovedá na otázku: Prečo je tento obrázok tu?

Zlé: „Obrázok grafu“

Lepšie: „Čiarový graf ukazujúci 23 % nárast mobilnej návštevnosti od januára do marca 2026“

Zlé: „Osoba používajúca notebook“

Lepšie: „Dizajnér kontroluje návrhy webu vo Figma“

Zlé: „Kliknite sem“

Lepšie: „Stiahnuť úplný kontrolný zoznam auditu prístupnosti (PDF)“

Všimnite si, že dobrý alternatívny text často obsahuje čísla, akcie alebo výsledky. Neopisuje každý vizuálny detail. Opisuje to, na čom záleží.

Pri dekoratívnych obrázkoch — textúrach pozadia v hero sekciách, ornamentálnych okrajoch, čisto estetických ilustráciách — použite alt="". Nie je to lenivosť. Je to sémantická poctivosť. Čítačky obrazovky obrázok úplne preskočia, čo je presne to, čo chcete.

Bežné chyby, ktoré mrhajú časom všetkých

Začínanie slovami „Obrázok“ alebo „Fotografia“: Čítačky obrazovky už oznamujú, že ide o obrázok. Prejdite rovno k opisu.

Prepchávanie kľúčovými slovami pre SEO: Alternatívny text nie je miesto, kam natlačiť „najlepšie organické kávové zrná Brooklyn remeselne pražené“. Google vyhľadávanie obrázkov to už roky vie dobre odhaľovať. Píšte pre ľudí.

Opisovanie názvu súboru: „IMG_3847.jpg“ nepomôže nikomu. Rovnako ani „hero-banner-final-v3“.

Písanie románu: Ak je váš alternatívny text dlhší než dve vety, informácia pravdepodobne patrí skôr do popisku alebo do textu stránky.

Opakovanie susedného textu: Ak nadpis hovorí „Ako upiecť kváskový chlieb“ a obrázok ukazuje niekoho, kto tvaruje cesto, alternatívny text nemusí nadpis opakovať. Opíšte to, čo je vizuálne odlišné: „Ruky skladajú kváskové cesto na pomúčenej ploche.“

Nástroje a pracovné postupy, ktoré skutočne pomáhajú

Väčšina moderných CMS už má polia pre alternatívny text zabudované. WordPress, Webflow, Contentful a Sanity všetky viditeľne zobrazujú atribút alt počas nahrávania. To, že je pole viditeľné, neznamená, že je vyplnené dobre.

Ak auditujete web z hľadiska chýbajúceho alebo slabého alternatívneho textu, rozšírenia prehliadača ako Accessibility Insights alebo axe DevTools dokážu označiť obrázky bez atribútov alt. Na rýchlu manuálnu kontrolu vypnite obrázky v prehliadači (Firefox aj Chrome to podporujú) a prečítajte si stránku. Ak alternatívny text dáva v kontexte zmysel, ste na dobrej ceste.

Alternatívny text generovaný AI — dostupný v nástrojoch ako Azure Computer Vision, Google Cloud Vision alebo zabudovaný do platforiem ako Cloudflare Images — môže byť rozumným východiskom, najmä pri veľkých knižniciach obrázkov. No berte alternatívny text od AI ako prvý návrh. Presne opíše obsah obrázka, ale nebude vedieť, prečo je obrázok na stránke. Ľudský editor stále musí doplniť kontext.

Ak pracujete na webe s intenzívnym používaním obrázkov a chcete včas zachytiť problémy s výkonom, nástroje ako Wux Webtools' Image Compressor vám môžu pomôcť optimalizovať veľkosti súborov pred nahratím — pretože alternatívny text je užitočný len vtedy, keď sa obrázok skutočne načíta.

Alternatívny text a SEO v roku 2026

Google už roky hovorí, že alternatívny text je hodnotiacim faktorom pre vyhľadávanie obrázkov. Stále to platí. Optimalizácia vyhľadávania obrázkov však nie je to isté ako prístupnosť.

Ak píšete alternatívny text primárne pre SEO, skončíte s nezmyslom prepchatým kľúčovými slovami, ktorý používateľom čítačiek obrazovky sťaží navigáciu po stránke. Ak píšete alternatívny text najprv pre prístupnosť, prínosy pre SEO prídu prirodzene, pretože opisný, kontextový alternatívny text je presne to, čo sa algoritmus Google vyhľadávania obrázkov snaží zvýrazniť.

Jedna nuansa: Google Images dnes využíva okolitý obsah stránky omnoho výraznejšie než kedysi. Ak je váš alternatívny text dobrý, ale všeobecný („čokoládová torta s polevou“), a vaša stránka je o vegánskom pečení, Google kontext pochopí. Nemusíte písať „vegánska čokoládová torta s bezmliečnou polevou“, pokiaľ tento rozdiel nie je na obrázku vizuálne zrejmý.

Kľúčové poznatky

• Alternatívny text existuje na sprostredkovanie účelu obrázka, nie na opis každého vizuálneho detailu
• Dekoratívne obrázky by mali používať alt="", aby ich čítačky obrazovky úplne preskočili
• Dobrý alternatívny text je konkrétny, vníma kontext a odpovedá na otázku „prečo je tento obrázok tu?“
• Alternatívny text generovaný AI je užitočné východisko, no stále potrebuje ľudskú úpravu kontextu
• Píšte najprv pre prístupnosť; prínosy pre SEO prirodzene vyplývajú z jasného, opisného textu

FAQ

Q: Môžem jednoducho použiť AI na vygenerovanie všetkých alternatívnych textov?

A: Nástroje AI dobre opisujú, čo je na obrázku, ale nerozumejú kontextu. Ak pracujete so stovkami produktových obrázkov a potrebujete základnú úroveň, alternatívny text od AI je v poriadku. Pri redakčnom obsahu, marketingových stránkach alebo čomkoľvek, kde záleží na dôvode existencie obrázka, ho musí skontrolovať a upraviť človek.

Q: Aký dlhý má byť alternatívny text?

A: Väčšine čítačiek obrazovky vyhovuje 125 znakov alebo menej. Ak potrebujete viac, informácia pravdepodobne patrí do popisku, do textu stránky alebo do dlhšieho opisu prepojeného cez aria-describedby. Neexistuje pevný technický limit, no dlhší alternatívny text sa stáva nepraktickým na navigáciu.

Q: Potrebujem alternatívny text pre logá?

A: Áno, ale nechajte ho jednoduchý. Ak je vaše logo v hlavičke a odkazuje na domovskú stránku, alternatívny text by mal byť názov vašej spoločnosti: alt="Acme Corp". Nepíšte alt="Acme Corp logo", pokiaľ skutočnosť, že ide o logo, nie je nejakým spôsobom relevantná pre kontext.

Q: Aký je rozdiel medzi alternatívnym textom a popiskom?

A: Alternatívny text je priama náhrada obrázka. Čítačky obrazovky ho prečítajú, keď narazia na obrázok. Popisok je doplnková informácia viditeľná pre všetkých, ktorá pridáva kontext alebo uvedenie zdroja. Ak máte oboje, nemali by sa navzájom opakovať.

Q: Mám pridávať alternatívny text k obrázkom na pozadí v CSS?

A: Nie. Obrázky na pozadí v CSS sú podľa definície dekoratívne a čítačkám obrazovky sa nesprístupňujú. Ak obrázok na pozadí sprostredkúva dôležitú informáciu, mal by byť prvkom <img> v HTML so správnym alternatívnym textom.

Zdroje

• W3C Web Accessibility Initiative: Images Tutorial
• WebAIM: Alternative Text
• Nielsen Norman Group: Alt Text for Images
• Google Search Central: Image SEO Best Practices