Nesprávné použití atributu ALT
(Alternativního textu) u obrázků je stále velmi častou chybou. Zkuste si to sami. Vypněte si na webu obrázky a čtěte. Nebo ještě lépe – nechte si stránku přečíst od někoho jiného. Dává vám smysl?
Jak tedy ALT
u obrázku použít? Vždy záleží na kontextu.
- atribut
ALT
musí vždy existovat ALT
by neměl nikdy obsahovat název souboru- obrázek je čistě dekorativní –
ALT=""
, je tedy prázdný a čtečka bude tento obrázek ignorovat - obrázek (např. ikona) nahrazuje text –
ALT
obsahuje tento text, např.<img src"mail-icon.png" alt="E-mail:"/>
- obrázek má informační hodnotu sám o sobě –
ALT
obsahuje popis toho, co na obrázku je v kontextu článku, ve kterém je použit - pokud je na obrázku odkaz, mohou nastat různé kombinace:
- v odkazu je pouze obrázek a žádný další text – v
ALT
musí být uveden smysluplný text popisující odkaz (ne vlastní URL). V případě, že tag<a>
obsahuje atributTITLE
, může být podle některých zdrojůALT
obrázku prázdný – více informací je např. na webu konsorcia W3C (anglicky). - v odkazu je obrázek i další text –
ALT
může být prázdný, nebo obsahuje popis toho, co na obrázku je. Častým jevem je, že jsou za sebou dva stejné odkazy, jednou na obrázku, podruhé na textu. To vytváří duplicitu, která je v rozporu s kritéri 1.1.1, 2.4.4 a 2.4.9.
- v odkazu je pouze obrázek a žádný další text – v
Pravidla jsou jednoduchá. Tak proč se to dělá špatně? Protože je to spousta práce, která se nedá dost dobře zautomatizovat.
Další informace o použití ALT u obrázků
Článek Accessibility: Images, “Alt” tags, and the “Out Loud” Experience (anglicky) podrobně rozepisuje všechny možnosti včetně toho, jak je interpretují různé hlasové čtečky.
Problematika je velmi dobře popsána také na serveru WebAIM.org (anglicky). V článku je stejný obrázek prezidenta Washingtona zasazen do různého kontextu.
2 komentáře u „Pravidla, jak správně používat alternativní text u obrázků“
Komentáře nejsou povoleny.