Alt popisky obrázků: k čemu jsou a jak je psát

Alt popisek je text uvnitř značky <img>, který slovy popisuje, co je na obrázku vidět. Přečte ho čtečka obrazovky nevidomému návštěvníkovi, zobrazí se v místě obrázku, když se soubor nenačte, a vyhledávače podle něj poznají, co snímek zachycuje. Píše se jako věcný popis do zhruba 125 znaků, bez slova „obrázek” a bez řetězení klíčových slov.

Kdo alt popisky doopravdy čte?

Tři skupiny, a jen jedna z nich je vyhledávač.

• Čtečky obrazovky. NVDA, JAWS, VoiceOver na iPhonu. Nevidomý člověk projíždí stránku po prvcích a u obrázku uslyší přesně to, co jste napsali do altu. Když atribut chybí, čtečka často přečte název souboru. Zkuste si představit, jak zní „I M G podtržítko 4 7 2 1 tečka J P G” uprostřed popisu produktu.
• Vyhledávání obrázků. Google i Seznam se snaží pochopit obsah snímku strojově, ale alt popisek, okolní text a název souboru jim to výrazně usnadňují. Bez nich máte fotku, o které nikdo neví, co je na ní.
• Náhrada, když se obrázek nenačte. Špatná cesta po migraci, smazaný soubor, pomalé mobilní připojení, blokovaná doména CDN. Návštěvník vidí místo fotky rámeček s textem. S dobrým altem aspoň ví, o co přišel.

Přibývá i čtvrtá skupina: nástroje, které web čtou kvůli odpovědím v chatovacích asistentech. Ty pracují hlavně s textem, takže obrázek bez popisu pro ně prakticky neexistuje. Kolik z toho reálně plyne návštěv, dnes nikdo pořádně neví, ale obsah připravený pro AI vyhledávání se s dobrými alty potkává.

Jak napsat alt, který někomu pomůže

Nejjednodušší návod: představte si, že popisujete fotku po telefonu člověku, který ji nevidí. Řekli byste „obrázek modré kabelky”? Ne. Řekli byste „modrá kožená kabelka přes rameno se zlatou přezkou”. Přesně to napište.

• Popisujte obsah, ne existenci obrázku. Slova „obrázek”, „fotka”, „ilustrace” na začátku vynechte. Čtečka sama ohlásí, že jde o grafiku.
• Držte se zhruba 125 znaků. Není to norma, je to konvence: starší verze JAWS text nad touto hranicí dělily nebo ořezávaly. Delší popis nikdo nezakazuje, ale poslouchat souvětí na tři řádky je utrpení.
• Klíčové slovo maximálně jednou, a jen když tam přirozeně patří. Alt typu „kabelka dámská kabelka levně kabelka kožená eshop” nikomu nepomůže a vypadá přesně na to, co to je.
• U obrázku, který je odkazem nebo tlačítkem, popisujte cíl. Alt loga v hlavičce, které vede na úvodní stránku, má být „Název firmy, úvodní stránka”, ne „logo”.
• U grafů a infografik dejte podstatné číslo přímo do textu stránky. Do altu se rozumný popis grafu nevejde a stejně by ho měl vidět i člověk, který graf vidí.
• Nepište do altu text, který je na obrázku vypsaný. Respektive napište, ale doslova. Když je na banneru „Doprava zdarma nad 1 500 Kč”, patří do altu přesně tahle věta.

Situace	Doporučená hodnota	Poznámka
Běžná fotka v textu	zhruba 80 až 125 znaků	Kratší je lepší než uměle nafouknuté
Oficiální limit ve WCAG	žádný	Číslo 125 je zvyk, ne pravidlo
Výskyt klíčového slova	nejvýše 1×	Jen pokud popisuje, co je vidět
Čistě dekorativní prvek	alt=""	Prázdný, ale přítomný
Obrázek jako odkaz	popis cíle odkazu	Ne popis grafiky

Špatně: <img src="IMG_4721.jpg" alt="obrázek">

Lépe: <img src="damska-kozena-kabelka-hneda.jpg" alt="Hnědá kožená kabelka přes rameno se zlatou přezkou">

Kdy má být alt prázdný a proč to není totéž jako alt vynechat

Rozdíl mezi alt="" a chybějícím atributem je zásadní, i když v prohlížeči vypadá stejně. Prázdný alt je pokyn: tenhle obrázek nenese žádnou informaci, přeskoč ho. Čtečka ho tiše mine a uživatel nic neztratí. Chybějící alt je díra: čtečka neví, co s tím, a typicky začne předčítat název souboru nebo celou adresu obrázku.

Prázdný alt patří k ozdobným oddělovačům, vlnovkám, pozadím vloženým jako <img>, ikonám vedle popisku, který už totéž říká slovy. Šipka vedle textu „Pokračovat do košíku” nepotřebuje alt „šipka doprava”. Zdvojený obsah čtečku jenom zpomaluje.

Pozor na jednu věc, kterou vidím u klientů pořád: produktová fotka v e-shopu není dekorace. Nikdy. Ani ta osmá v galerii. Když se rozhodujete, jestli je obrázek dekorativní, zeptejte se, jestli by při jeho odstranění stránka přišla o informaci. Pokud ano, alt tam patří.

Nepříjemné je, že automatické kontroly rozdíl mezi „záměrně prázdné” a „zapomenuté” nepoznají. Prázdný alt projde jako v pořádku. Rozhodnutí, který obrázek je opravdu dekorativní, za vás nikdo neudělá.

Alt, title, popisek a název souboru nejsou totéž

Ve WordPressu jsou v knihovně médií čtyři políčka a většina lidí vyplní to špatné.

Prvek	Kdo ho vnímá	K čemu slouží
Alt (alternativní text)	Čtečky obrazovky, vyhledávače, prohlížeč při nenačtení	Textová náhrada obrázku
Title (atribut title)	Bublina po najetí myší, na mobilu nikdo	Prakticky nic užitečného, klidně vynechte
Popisek (figcaption)	Všichni návštěvníci, viditelně pod obrázkem	Doplňující text, autor fotky, kontext
Název souboru	Vyhledávače, adresa obrázku	Slabší signál o obsahu, ale zdarma

Title u obrázků je zbytečnost, kterou přesto skoro každý redakční systém nabízí. Čtečky ho podle nastavení buď ignorují, nebo přečtou navíc k altu, takže z „kabelka” udělají „kabelka kabelka”. Na dotykovém displeji se bublina nezobrazí vůbec. Nechte políčko prázdné a věnujte tu minutu altu.

Název souboru pište malými písmeny, bez diakritiky, se spojovníky mezi slovy. Tedy damska-kozena-kabelka-hneda.jpg, ne Dámská kabelka (kopie) 2.jpg. Podtržítka fungují hůř než spojovníky, mezery se v adrese změní na %20 a háčky s čárkami dokážou rozbít přenos mezi hostingy. Novější WordPress si s diakritikou většinou poradí sám, ale ověřený postup je přejmenovat soubor ještě na disku, před nahráním. Po nahrání už to nedělejte, rozbijete odkazy na dříve vložené obrázky. Stejná logika platí i pro strukturu URL adres na celém webu.

Vyplatí se u e-shopu vyhledávání obrázků?

Podle oboru. U věcí, které si lidé vybírají očima, tedy oblečení, nábytek, bytové doplňky, dlažba, tapety, květiny, chodí z obrázkového vyhledávání měřitelný provoz. U náhradních dílů podle katalogového čísla nebo u softwarových licencí prakticky nulový. Průměry, které kolují po internetu, vám nepomůžou. Změřte si to.

V Google Search Console otevřete přehled Výkon, nahoře přepněte typ vyhledávání z „Web” na „Obrázek” a podívejte se na počet prokliků za posledních dvanáct měsíců. Trvá to dvacet sekund a řekne vám to víc než jakýkoliv článek. U Seznamu je to horší, obrázkové výsledky se z dat ve Webmasteru vytáhnout tak snadno nedají, takže se řídíte hlavně tím, co vidíte v samotném vyhledávání. Ostatní zvláštnosti českého vyhledávače rozebírám v textu o SEO pro Seznam.cz.

Aby obrázky do výsledků vůbec mohly, musí být načitatelné. Zkontrolujte, že adresář s médii neblokujete v souboru robots.txt, a že obrázky nejsou schované za skriptem, který je dotáhne až po scrollování bez normálního atributu src. K tomu se hodí mít je rozumně velké a ve formátu WebP nebo AVIF, což řeším zvlášť v článku o rychlosti webu a obrázcích.

Co po vás chce zákon o přístupnosti od června 2025

Od 28. června 2025 platí zákon č. 424/2023 Sb., o požadavcích na přístupnost některých výrobků a služeb. Je to česká podoba evropské směrnice 2019/882, které se běžně říká European Accessibility Act. Netýká se všech webů, ale mimo jiné dopadá na elektronické obchodování, tedy na e-shopy, dále na bankovní služby pro spotřebitele, elektronické komunikace, dopravu a elektronické knihy.

Konkrétní čísla, která si stojí za to zapamatovat:

• 28. 6. 2025 je den, od kterého se povinnosti vztahují na nově poskytované služby.
• 28. 6. 2030 je konec přechodného období pro služby poskytované na základě smluv uzavřených před účinností zákona.
• Mikropodniky, tedy poskytovatelé služeb s méně než 10 zaměstnanci a ročním obratem do 2 milionů eur, mají z povinností výjimku.
• Dozor nad podnikateli vykonává podle oblasti hlavně Česká obchodní inspekce.

Technicky se přístupnost webu prokazuje splněním harmonizované normy EN 301 549, která u webového obsahu odkazuje na WCAG 2.1 v úrovni AA. A úplně první kritérium těchto pravidel, 1.1.1 Netextový obsah, je právě požadavek, aby každý netextový prvek měl textovou alternativu. Alt popisky nejsou celá přístupnost, ale jsou to ta nejlevnější a nejrychleji opravitelná část. Souvislosti mezi přístupností a pozicemi ve vyhledávání rozebírám v článku o přístupnosti a SEO.

Na rovinu: jestli zákon dopadá zrovna na váš web a jak přísně, vám z dálky neřeknu. U e-shopu nad hranicí mikropodniku bych se tím zabýval vážně, u prezentace řemeslníka se dvěma stránkami spíš ne. Alty ale doplňte tak jako tak, jsou práce na jedno odpoledne.

Jak ve WordPressu hromadně najít obrázky bez altu

Nejdřív pozor na past, na které jsem se sám kdysi spálil. WordPress ukládá alt na dvou místech. V knihovně médií u přílohy a zároveň přímo v HTML článku, kam se text zkopíruje ve chvíli vložení obrázku. Když tedy doplníte alt v knihovně médií, u už publikovaných článků se nic nezmění. Musíte projít obsah.

1. Rychlá vizuální kontrola v prohlížeči. Otevřete stránku, stiskněte F12, do konzole vložte document.querySelectorAll('img:not([alt])').forEach(i=>i.style.outline='4px solid red') a obrázky bez atributu se orámují červeně. Na jednu stránku ideální.
2. Screaming Frog SEO Spider. Bezplatná verze projde 500 adres, což na menší web stačí. Po dokončení crawlu jděte do Bulk Export, Images, Images Missing Alt Attribute nebo Images Missing Alt Text. Dostanete tabulku obrázek plus stránka, na které sedí.
3. Naše bezplatná SEO kontrola webu. Projde web bez instalace čehokoliv a vypíše obrázky bez altu spolu s dalšími technickými nálezy. Hodí se, když chcete jen vědět, jak velký problém to je.
4. Dotaz do databáze. V phpMyAdmin nebo Adminer u vašeho hostingu spusťte SELECT p.ID, p.post_title FROM wp_posts p LEFT JOIN wp_postmeta pm ON p.ID = pm.post_id AND pm.meta_key = '_wp_attachment_image_alt' WHERE p.post_type = 'attachment' AND (pm.meta_value IS NULL OR pm.meta_value = ''). Vrátí přílohy bez vyplněného altu. Předpona wp_ se u vás může jmenovat jinak a databázi si předtím zazálohujte.
5. Plugin do knihovny médií. V repozitáři je několik doplňků, které přidají sloupec s altem a filtr „bez popisku”. Jmenovitě žádný nedoporučuji, protože se v téhle kategorii pluginy mění každý rok. Vybírejte podle data poslední aktualizace.

Když najdete tisíc obrázků bez altu, nezačínejte od nejstaršího. Vezměte si z analytiky dvacet nejnavštěvovanějších stránek a produktů, ty spravte ručně a pořádně. Zbytek doplňujte průběžně. Automatické generátory, které do altu nasypou název produktu, jsou lepší než prázdno, ale u galerie s osmi fotkami vyrobí osmkrát stejný text, což nikomu nepomůže. Když už automat, tak s rozlišením pohledu: „zepředu”, „detail materiálu”, „na modelce”.

Časté dotazy

Kolik znaků má mít alt popisek?

Rozumná délka je zhruba 80 až 125 znaků. Žádná norma limit nestanovuje, číslo 125 pochází z chování starších verzí čtečky JAWS, která delší text ořezávala. Delší popis použijte jen tehdy, když bez něj obrázek nedává smysl, například u složitého schématu.

Musí mít alt každý obrázek na webu?

Atribut alt ano, vyplněný text ne. Obrázky, které nesou informaci, potřebují popis. Čistě dekorativní prvky, jako jsou oddělovače nebo ikony vedle textu se stejným významem, mají mít alt="", tedy prázdnou hodnotu. Úplně chybějící atribut je vždycky chyba, protože čtečka pak předčítá název souboru.

Pomůžou alt popisky s pozicemi ve vyhledávání?

Přímý vliv na pozice běžných textových výsledků je malý. Zásadní jsou ale pro vyhledávání obrázků, kde bez popisu a bez smysluplného názvu souboru šanci na zobrazení prakticky nemáte. U e-shopů s vizuálním sortimentem to bývá znát na návštěvnosti, u technických oborů skoro vůbec.