Alt Text

Definice alt textu

Alt text, zkratka pro alternativní text, je popisný HTML atribut přidaný k tagům obrázků, který vyjadřuje význam, kontext a účel vizuálního obsahu v digitálním prostředí. Podle oficiální dokumentace společnosti Microsoft je alt text popisný text, který vyjadřuje význam a kontext vizuální položky v digitálním prostředí, například v aplikaci nebo na webové stránce. Při správné implementaci umožňuje alt text čtečkám obrazovky – asistenčním technologiím používaným lidmi se zrakovým postižením – číst popisy obrázků nahlas, čímž se vizuální obsah stává přístupným všem uživatelům. Kromě přístupnosti plní alt text také důležitou SEO funkci tím, že pomáhá vyhledávačům porozumět a indexovat obsah obrázků, což zlepšuje jak hodnocení ve vyhledávání obrázků, tak celkovou relevanci stránky. HTML implementace je přímočará: <img src="obrazek.jpg" alt="Popisný text zde">, kde atribut alt obsahuje textový popis. Bez alt textu narážejí uživatelé spoléhající na čtečky obrazovky na prázdná místa nebo obecná oznámení a přicházejí o zásadní informace, které vidící uživatelé považují za samozřejmé.

Klíčová role alt textu v přístupnosti webu

Význam alt textu nelze přeceňovat v kontextu digitální přístupnosti a inkluzivního webového designu. Podle zprávy WebAIM Million 2024 – analýzy nejlepších 1 milionu webových stránek – mělo 21,6 % všech obrázků na domovských stránkách chybějící alt text, přičemž v průměru 12 obrázků na stránku postrádalo popis. Ještě alarmující je, že 14,6 % obrázků s alt textem mělo sporné nebo opakující se popisy, což znamená, že přibližně jedna třetina obrázků na populárních domovských stránkách má chybějící, sporný nebo opakující se alt text. Tento deficit v přístupnosti přímo dopadá na odhadem 2,2 miliardy lidí na celém světě se zrakovým postižením, kteří se při procházení webu spoléhají na asistenční technologie. Když čtečky obrazovky, jako jsou JAWS, NVDA a Microsoft Narrator, narazí na obrázky bez alt textu, buď neoznámí nic, nebo přečtou název souboru, což uživatele mate a znemožňuje jim porozumět důležitému obsahu. Pokyny pro přístupnost webového obsahu (WCAG), mezinárodně uznávaný standard pro webovou přístupnost, výslovně vyžadují textové alternativy pro ne-textový obsah, což činí alt text požadavkem právního souladu podle zákonů, jako je Americans with Disabilities Act (ADA) a European Accessibility Act (EAA). Organizace, které nezavedou správný alt text, riskují právní kroky, poškození pověsti a vyloučení významné části globální populace ze svých digitálních zážitků.

Ready to Monitor Your AI Visibility?

Track how AI chatbots mention your brand across ChatGPT, Perplexity, and other platforms.

Začít Kontakt

Alt text vs. související koncepty: Porozumění rozdílům

Technická implementace a HTML standardy

HTML implementace alt textu sleduje jednoduchou, ale zásadní strukturu. Atribut alt je umístěn uvnitř tagu <img>, což je standardní způsob vkládání obrázků do webových stránek. Správně naformátovaný tag obrázku vypadá takto: <img src="zapad-slunce-hory.jpg" alt="Zlatý západ slunce nad zasněženými vrcholky hor s oranžovou a fialovou oblohou odrážející se v klidném alpském jezeře">. Alt text by měl být umístěn přímo v HTML kódu, což jej činí neviditelným pro vidící uživatele, pokud se obrázek nenačte – v tom případě se alt text zobrazí na místě chybějícího obrázku. Tato záložní funkčnost je obzvláště důležitá pro uživatele s pomalým připojením k internetu nebo ty, kteří narazí na nefunkční odkazy na obrázky. Systémy pro správu obsahu (CMS), jako jsou WordPress, Shopify, Wix a Squarespace, poskytují uživatelsky přívětivá rozhraní pro přidávání alt textu bez nutnosti přímé úpravy HTML. Ve WordPressu mohou uživatelé například přidat alt text prostřednictvím knihovny médií nebo nastavení obrázků v blokovém editoru. Moderní platformy stále častěji nabízejí automatické generování alt textu pomocí umělé inteligence a počítačového vidění. Produkty Microsoft 365, včetně PowerPointu, Wordu a Outlooku, nyní obsahují automatické generátory alt textu, které používají modely pro popis obrázků k vytvoření prvotních popisů. Tyto AI generované popisy by však měl vždy zkontrolovat a upravit člověk, aby byla zajištěna přesnost, relevance a soulad s okolním obsahem. Standard WCAG 2.1 stanovuje, že všechny obrázky musí mít textové alternativy, s konkrétními pokyny pro různé typy obrázků: fotografie, ikony, ilustrace, schémata, grafy a propojené obrázky vyžadují individuální přístupy k tvorbě alt textu.

Stay Updated on AI Visibility Trends

Get the latest insights on AI mentions, brand monitoring, and optimization strategies.

Email address

Subscribe

Osvědčené postupy pro psaní efektivního alt textu

Vytváření efektivního alt textu vyžaduje vyvážení specifičnosti, stručnosti a kontextuální relevance. Zlaté pravidlo zní: pište alt text, jako byste popisovali obrázek někomu, kdo jej nevidí, zaměřte se na to, co je nejdůležitější, nikoli na každý vizuální detail. Výzkum odborníků na přístupnost doporučuje udržovat alt text v rozsahu 1–2 vět, ideálně pod 125 znaků, protože většina čteček obrazovky text delší než tato délka ořezává. Vyhněte se nadbytečným frázím jako „obrázek", „fotografie" nebo „grafika", protože čtečky obrazovky již oznamují, že je obrázek přítomen. Místo toho přejděte rovnou k popisu: místo „Obrázek ženy ve žluté bundě jedoucí na kole" napište „Žena ve žluté bundě jedoucí na kole městským parkem na podzim." Nejdůležitější informace uvádějte na začátek, protože uživatelé čteček obrazovky mohou poslouchání předčasně ukončit nebo přeskočit dopředu. Pro dekorativní obrázky použijte prázdný alt atribut (alt=""), který čtečkám obrazovky řekne, aby je zcela přeskočily, čímž se zabrání zbytečným oznámením. Klíčová slova začleňujte přirozeně, pokud odpovídají obrázku a jeho kontextu, ale nikdy se nevěnujte nadměrnému používání klíčových slov, které škodí uživatelskému zážitku i hodnocení ve vyhledávačích. Pro komplexní obrázky, jako jsou grafy, infografiky nebo schémata, uveďte v alt textu výstižné shrnutí klíčového zjištění a poté doplňte delší textový popis nebo datovou tabulku jinde na stránce. Například místo „Sloupcový graf zobrazující prodejní data" napište „Sloupcový graf ukazující 30% nárůst online prodejů z Q1 na Q2 2024 s vrcholem prodejů v červnu." Zvažte kontext okolního obsahu při psaní alt textu, protože stejný obrázek může vyžadovat různé popisy v závislosti na tom, jak je použit. Fotografie Harvardského pamětního kostela by mohla být v článku o jarních aktivitách popsána jako „Studenti odpočívají na barevných židlích v Harvard Yardu", ale v článku o univerzitní architektuře jako „Hollis Hall sousedí s otevřeným travnatým prostorem Harvard Yardu."

Implementace na konkrétních platformách napříč digitálními ekosystémy

Různé platformy a systémy pro správu obsahu vyžadují odlišné přístupy k implementaci alt textu. WordPress, nejpoužívanější CMS pohánějící přes 43 % webových stránek, umožňuje přidání alt textu prostřednictvím knihovny médií nebo blokového editoru Gutenberg. Uživatelé mohou upravovat stávající obrázky přechodem do Media > Library, kliknutím na obrázek a zadáním alt textu do určeného pole. Shopify, přední e-commerce platforma, umožňuje úpravu alt textu během nahrávání produktových obrázků nebo v editoru produktů kliknutím na ikonu tužky a zadáním textu do pole „Image alt text". WooCommerce, který pohání přibližně 38 % e-commerce webů, je integrován s funkcemi knihovny médií WordPressu. Wix a Squarespace, populární nástroje pro tvorbu webů, poskytují vizuální rozhraní, kde uživatelé mohou kliknout na obrázky a získat přístup k nastavení alt textu prostřednictvím nabídek designu nebo úprav. Platformy sociálních médií stále více upřednostňují přístupnost alt textu. Instagram umožňuje uživatelům přidat alt text prostřednictvím rozšířených nastavení před publikováním příspěvků. Twitter (nyní X) umožňuje přidání alt textu kliknutím na tlačítko „+ALT" u nahraných obrázků s podporou až 1000 znaků. LinkedIn poskytuje možnost „Přidat alt text" při nahrávání obrázků. Facebook automaticky generuje alt text pomocí AI, ale uživatelé mohou popisy před publikováním upravit nebo přizpůsobit. Aplikace Microsoft 365 – včetně PowerPointu, Wordu, Excelu a Outlooku – nyní obsahují automatické generování alt textu poháněné AI pro popis obrázků. Uživatelé mohou schválit, upravit nebo ručně zadat alt text prostřednictvím panelu Alt Text. Tato multi-platformní krajina znamená, že tvůrci obsahu musí rozumět konkrétním pracovním postupům pro každou platformu, kterou používají, i když základní princip zůstává stejný: popisný, výstižný, kontextuálně relevantní text, který vyjadřuje význam obrázku.

Alt text a viditelnost v AI vyhledávání

S tím, jak systémy generativní AI, jako jsou ChatGPT, Perplexity, Google AI Overviews a Claude, stále častěji analyzují a citují webový obsah, se alt text stal strategicky důležitým pro viditelnost v AI a sledování citací. Tyto AI platformy používají technologii Retrieval-Augmented Generation (RAG) – generování rozšířené o vyhledávání –, což znamená, že prohledávají web za účelem nalezení relevantních informací a ve svých odpovědích citují zdroje. Když AI systémy narazí na obrázky s dobře napsaným alt textem, mohou lépe porozumět vizuálnímu obsahu a začlenit jej do svých odpovědí. Alt text pomáhá AI systémům přesně interpretovat a popisovat obrázky, čímž zlepšuje relevanci a přesnost AI generovaného obsahu. Pro organizace používající AmICited nebo podobné platformy pro monitorování AI je sledování toho, jak se obrázky a jejich alt text objevují v odpovědích AI, zásadní pro pochopení viditelnosti značky a atribuce obsahu. Obrázky se špatným nebo chybějícím alt textem mohou být AI systémy chybně interpretovány, což vede k nepřesným popisům nebo promarněným příležitostem k citaci. Naopak dobře optimalizovaný alt text zvyšuje pravděpodobnost, že vaše obrázky budou správně pochopeny, citovány a připisovány v odpovědích generovaných AI napříč různými platformami. Tento nový rozměr důležitosti alt textu odráží širší posun směrem k optimalizaci pro generativní vyhledávače (GEO), kde tvůrci obsahu musí optimalizovat nejen pro tradiční vyhledávače, ale také pro AI systémy, které stále více zprostředkovávají, jak jsou informace objevovány a sdíleny online.

Statistické důkazy a regulační prostředí

Přístupnostní krize týkající se alt textu je dobře zdokumentována prostřednictvím rigorózního výzkumu. Zpráva WebAIM Million 2024, která analyzovala nejlepších 1 milion webových stránek, zjistila, že 54,5 % domovských stránek mělo chybějící alternativní text pro obrázky, což z něj činí druhé nejčastější selhání WCAG po nízce kontrastním textu (81 % stránek). Zpráva také odhalila, že 18,5 % všech obrázků na domovských stránkách mělo chybějící alt text, přičemž v průměru 11 obrázků na stránku postrádalo popis. Statistiky přístupnosti AudioEye 2024 uvádějí, že 60 % obrázků na webu nemělo žádný alternativní text, což naznačuje, že většina obrázků na webových a mobilních zařízeních zůstává nepřístupná. Tyto statistiky podtrhují přetrvávající propast mezi standardy přístupnosti a jejich implementací v praxi. Požadavky právního souladu činí implementaci alt textu pro mnoho organizací nezbytnou. Standard WCAG 2.1 úrovně A výslovně vyžaduje textové alternativy pro veškerý ne-textový obsah a WCAG 2.1 úrovně AA vyžaduje podrobnější popisy pro komplexní obrázky. Organizace podléhající ADA ve Spojených státech, EAA v Evropě nebo podobné legislativě o přístupnosti čelí právní odpovědnosti za nepřístupný obsah. Nedávné soudní spory se stále častěji zaměřují na webové stránky se špatnou přístupností, včetně těch, které postrádají správný alt text. Oddíl 508 zákona o rehabilitaci vyžaduje, aby federální agentury a dodavatelé poskytovali přístupný digitální obsah, včetně obrázků s alt textem. Kromě právních požadavků implementace alt textu odráží organizační hodnoty v oblasti inkluzivity a uživatelského zážitku. Společnosti, které upřednostňují přístupnost, prokazují závazek sloužit všem uživatelům bez ohledu na schopnosti, což posiluje pověst značky a rozšiřuje dosah na trhu.

Klíčové aspekty a přínosy správné implementace alt textu

• Dodržení přístupnosti: Splňuje požadavky WCAG 2.1, ADA, EAA a Section 508, snižuje právní riziko a zajišťuje inkluzivní design
• Kompatibilita se čtečkami obrazovky: Umožňuje asistenčním technologiím jako JAWS, NVDA a VoiceOver sdělovat obsah obrázků uživatelům se zrakovým postižením
• Zlepšení SEO: Zvyšuje hodnocení ve vyhledávání obrázků, zvyšuje organickou návštěvnost a posiluje tematickou relevanci pro vyhledávače
• Záložní funkčnost: Zobrazí se, když se obrázky nenačtou kvůli nefunkčním odkazům, pomalému připojení nebo problémům s prohlížečem, čímž zachovává srozumitelnost obsahu
• Porozumění AI systémům: Pomáhá platformám generativní AI přesně interpretovat a citovat vizuální obsah v odpovědích
• Uživatelský zážitek: Poskytuje kontext všem uživatelům, včetně těch s pomalým připojením nebo používajících textové prohlížeče
• Srozumitelnost obsahu: Zajišťuje, že sdělení a účel obrázků jsou zachovány, i když vizuální prvky nelze zobrazit
• Mobilní přístupnost: Podporuje uživatele na mobilních zařízeních s omezenou šířkou pásma nebo ty, kteří používají textové režimy prohlížení
• Sémantický význam: Posiluje obsah stránky a pomáhá vyhledávačům propojit obrázky s okolním textem pro lepší indexaci
• Konzistence značky: Umožňuje organizacím kontrolovat, jak jsou jejich obrázky popisovány a interpretovány napříč platformami

Běžné chyby v alt textu

Dokonce i týmy, které vědí, že na alt textu záleží, jej pravidelně podkopávají několika opakujícími se chybami. Zahajování popisů slovy „obrázek" nebo „fotografie" plýtvá omezenou pozorností, kterou uživatelé čteček obrazovky věnují jednotlivým prvkům – software již oznamuje, že je obrázek přítomen, takže začínat touto frází pouze oddaluje skutečný obsah. Nadměrné používání klíčových slov pro SEO mění popisný text v nečitelný seznam vyhledávacích výrazů; to porušuje záměrové pokyny WCAG a aktivně škodí uživatelskému zážitku i hodnocení ve vyhledávání, kterému má pomáhat. Ponechání dekorativních obrázků bez prázdného atributu alt="" nutí čtečky obrazovky oznamovat nesmyslnou výplň – oddělovače, okraje a dekorativní prvky pozadí by měly být výslovně označeny k přeskočení, nikoli ponechány prázdné opomenutím nebo vyplněny popisem, který nikdo nepotřebuje. Psaní alt textu, který ignoruje okolní kontext, vytváří technicky přesné, ale nepoužitelné popisy; stejná fotografie potřebuje jiný popis v závislosti na tom, zda stránka pojednává o univerzitním životě nebo architektuře, a obecné popisy selhávají v obou případech. Důvěřovat AI generovanému alt textu bez kontroly je stále běžnější, jak se šíří nástroje jako automatický generátor Microsoft 365, ale tyto popisy často postrádají konkrétní detail nebo účel, který je v kontextu důležitý – jsou výchozím návrhem, nikoli hotovým popisem. Překročení efektivní délky, kterou čtečky obrazovky oznamují (zhruba 125 znaků), nacpáním každého vizuálního detailu pohřbívá jeden nebo dva fakty, které skutečně záleží, zejména u komplexních obrázků, jako jsou grafy, kde by měl být klíčový datový bod uveden přímo, nikoli popisován vizuálně.