Jak řešit web a aplikace pro handicapované? To je článek, který pro náš blog před časem sepsal můj kolega Mirek Jungwirth a tehdy se zaměřil spíše na legislativní rámec a obecnou stránku této problematiky. Já na něj dnes volně navážu a společně se podíváme na pár konkrétních rad, jak v user interface tyto normy chápat a jak používat metodiku WCAG 2.1. Není to zase taková věda, jak by se mohlo zdát, ale chce to trochu empatie.

 

Přístupnost obsahu nezávisí na zvolené technologii a lze ji tedy řešit jak pro web, tak i pro aplikaci v telefonu nebo v dokumentech, hrách, UI pro smartwatch, vždy samo sebou v rámci možností daného média a technologie.

V ČR žije přibližně 65 tisíc lidí se zrakovým postižením a 500 tisíc sluchově postižených, dále lidé s postižením jemné a hrubé motoriky, s epilepsií, dyslexií, autismem, úzkostí, ale také 18,8 % seniorů nad 65 let. Ano, i těch se přístupnost týká. Tento článek nemá za cíl vysvětlovat každý bod normy WCAG 2.1, ale spíše se reálně zamyslet nad tím, na co nezapomenout, abychom při tvorbě UI plně zohlednili i tyto skupiny.

 

Takže na co se zaměřit, aby váš produkt byl dobře přístupný všem uživatelům:

1) Dostatek času – týká se např. přečtení titulků, zadání obsahu ve formuláři, timeoutu autorizace nebo doby zobrazení chybového pop-up okna s popisem.

 

2) Každý netextový prvek má svou alternativu – např. obrázek má zadán v html i „alternativní“ popis, animace i statickou fotku, javascript i verzi fungující bez této technologie, PDF i verzi HTML, dále pak audio popis jako podcast, titulky ve videu atp. Jde o to, aby uživatel nebyl ochuzen na informovanosti ani bez použití vámi zvolených technologií.

 

3) Dostatek prostoru – tlačítka či odkazy dostatečně daleko od sebe, prvky formuláře jasně členěné pod sebou a s dostatečným rozestupem, aby je uživatelé mohli jednoduše zaměřit a použít.

 

4) Jednoduchá a vždy jasná navigace – znamená pohybovat se strukturou např. jen pomocí klávesnice (tabulátor, šipky) bez myši či touchpadu, nebo jen pomocí hlasových příkazů. Je vhodné použít rozbalovací menu a obsah bez nutnosti ovládání složitými pohyby myší (např. vysouvací dvouúrovňová menu, ubíhající obsah pod kurzorem).

 

5) Dobrý kontrast a čitelnost – dobré kontrastní poměry pro zvolené barvy textu a podkladu (lze ověřit např. na https://contrast-ratio.com/) s dostatečně velkými znaky a dobrým prokladem řádků s max. 80 až 160 znaky. Vyhněte se vyjádření stavu pouze barvou prvku. Dostatečně oddělte obsah od pozadí (platí i pro podkresovou hudbu a zvuky).

 

6) Jasný a srozumitelný obsah – lineární čtení obsahu, logické členění, aby související prvky vždy byly u sebe, plně responzivní chování, sémantický kód jasně členěný do titulků, odstavců, seznamů, tabulky s definovanou hlavičkou, vyhněte se komplikovaným či nelogickým strukturám atp. 

 

7) Nedrážděte – vyhněte se vysoce kontrastním barevným schématům, agresivním a lekavým zvukům, textům, které mohou v citlivých osobách vyvolat úzkost. Rovněž je důležité jasně formulovat popis dané akce pro tlačítka a další postup.

 

8) Myslete za uživatele – podpořte psaný obsah vizuálně (např. tlačítko s textem STOP bude červené i s ikonou), přemýšlejte, co se stane, pokud by uživatel udělal chybu ve formátu svého telefonu nebo spletl znak v e-mailu, jak bude vnímat obsah např. bez zvuku nebo s poruchou barvocitu, jak uvidí a bude používat obsah na čtečce nebo při 300% zvětšení, jak obsah uslyší na čtecím zařízení atd.

 

9) Pomáhejte – snažte se vždy nabízet více možných řešení, více cest, jak dospět ke stanovenému cíli (např. návrat na úvodní stránku jako tlačítko zpět, odkazem na logo, odkazem v menu, odkazem na konci článku), také se vcítit do uživatele, který nezná a nemůže znát veškerý obsah a souvislosti stejně jako jeho častý uživatel, nebo dokonce sám autor (jakákoliv stránka webu může být první, kterou navštíví). Pokud i tak zklamete jako autor, snažte se nabídnout pomocnou ruku (např. „Pokud si stále nevíte rady, napište e-mail na…“, případně využijte chatovací okno nebo telefonní linku na podporu).

 

Přehlednost, funkčnost a informační hodnota by měly zůstat zachovány pro všechny. Pamatujte, že i vy jednou možná budete potřebovat brýle či naslouchátko nebo budete mít třes v rukou...