Součást 1.1 Textové alternativy
Testujeme automaticky
Toto kritérium testujeme automaticky pomocí následujících pravidel:
- image-alt – Obrázky mají alternativní text
- input-image-alt – Vstupní obrázky mají alternativní text
- object-alt – Object elementy mají alternativní text
- svg-img-alt – SVG obrázky mají přístupný text
- role-img-alt – Elementy s role="img" mají alt text
- area-alt – Image map oblasti mají alt text
Oficiální znění
Veškerý netextový obsah, který je prezentován uživateli, má textovou alternativu sloužící ekvivalentnímu účelu, s výjimkou situací uvedených níže:
- Ovládací prvky, vstup: Pokud je netextový obsah ovládací prvek nebo přijímá vstup od uživatele, má název popisující jeho účel.
- Časově závislá média: Pokud je netextový obsah časově závislé médium, textové alternativy alespoň poskytují popisnou identifikaci netextového obsahu.
- Test: Pokud je netextový obsah testem nebo cvičením, které by bylo neplatné, kdyby bylo prezentováno v textu, textové alternativy alespoň poskytují popisnou identifikaci netextového obsahu.
- Smyslový: Pokud je netextový obsah primárně určen k vytvoření specifického smyslového zážitku, textové alternativy alespoň poskytují popisnou identifikaci netextového obsahu.
- CAPTCHA: Pokud je účelem netextového obsahu potvrzení, že k obsahu přistupuje osoba a nikoli počítač, jsou poskytnuty textové alternativy identifikující a popisující účel netextového obsahu a jsou poskytnuty alternativní formy CAPTCHA využívající výstupní režimy pro různé typy smyslového vnímání.
- Dekorace, formátování, neviditelné: Pokud je netextový obsah čistě dekorativní, používá se pouze k vizuálnímu formátování nebo není prezentován uživatelům, je implementován způsobem, že může být asistivními technologiemi ignorován.
Co to znamená v praxi
Každý obrázek na webu potřebuje textový popis (alt text), který vysvětluje, co je na obrázku. Tento text se zobrazí, když se obrázek nenačte, a čtečky obrazovky ho přečtou nevidomým uživatelům.
Hlavní pravidla:
- Informační obrázky – popisujte, co je důležité. Např. 'Graf ukazující nárůst návštěvnosti o 25%'
- Funkční obrázky (tlačítka, ikony) – popisujte funkci, ne vzhled. 'Hledat' místo 'Lupa'
- Dekorativní obrázky – použijte prázdný alt (alt=''), aby je čtečky přeskočily
- Složité obrázky (grafy, schémata) – poskytněte dlouhý popis v textu stránky
Originální znění
Originální znění W3C: WCAG 2.1 Success Criterion 1.1.1 Non-text Content