A11Y (Accessibility) je praxe vytváření digitálního obsahu, který je přístupný lidem se zrakovým, sluchovým, motorickým nebo kognitivním postižením. Nejde však jen o pomoc lidem se specifickými potřebami; dobrá přístupnost zlepšuje uživatelskou zkušenost (UX) pro všechny (např. čtení webu na přímém slunci nebo ovládání jednou rukou).

Standardy WCAG (Web Content Accessibility Guidelines) definují čtyři základní principy, které musí přístupný web splňovat:

• Perceivable (Vnímatelnost): Uživatelé musí být schopni vnímat informace (např. textové alternativy pro obrázky, titulky u videí).
• Operable (Ovladatelnost): Rozhraní musí být ovladatelné (např. navigace pouze pomocí klávesnice, dostatek času na čtení).
• Understandable (Srozumitelnost): Informace a ovládání musí být pochopitelné (jasný jazyk, předvídatelné chování prvků).
• Robust (Robustnost): Obsah musí být interpretovatelný různými technologiemi, včetně asistivních zařízení (čtečky obrazovky).

—

Používání správných značek místo nekonečných <div> a <span>. Pro čtečky obrazovky je zásadní rozdíl mezi <button> a <div onclick=„…“>.

Pokud sémantické HTML nestačí, používají se ARIA labely (např. aria-label, aria-live), které sdělují asistivním technologiím stav a účel prvků.

Text musí mít dostatečný kontrastní poměr vůči pozadí (standard WCAG AA vyžaduje minimálně 4.5:1). Informace nesmí být předávána pouze barvou (např. červené orámování chyby musí být doplněno ikonou nebo textem).

—

Lidé s postižením používají různé nástroje pro interakci s webem:

• Screen Readery (Čtečky obrazovky): Software, který předčítá obsah (např. NVDA, JAWS, VoiceOver).
• Braillské řádky: Hardwarová zařízení převádějící text do Braillova písma.
• Switch Access: Ovládání počítače pomocí jednoho nebo dvou tlačítek pro lidi s omezenou motorikou.
• Zvětšovací software: Pro uživatele se zbytky zraku.

—

• Legislativa: V EU platí zákon o přístupnosti (European Accessibility Act), který vyžaduje přístupnost pro veřejný sektor i klíčové soukromé služby.
• SEO: Vyhledávače (Google) preferují přístupné weby (např. sémantika, alternativní texty).
• Větší publikum: Až 15 % populace má nějakou formu postižení. Ignorováním A11Y přicházíte o zákazníky.

—

• Automatizované nástroje: Lighthouse, Axe DevTools, WAVE.
• Manuální testování: Navigace webem pouze pomocí klávesy Tab a Enter.
• Uživatelské testování: Zapojení lidí, kteří asistivní technologie reálně používají.

Související články:

• Webové technologie (HTML a CSS)
• UX a UI Design: Principy použitelnosti
• Moderní frontendové frameworky

Tagy: dev a11y accessibility frontend html wcag ux