Komu principy přístupného designu pomáhají
Lidé se zrakovým postižením: Lidé, kteří se na webu nemohou spolehnout na zrak, budou mít smysluplný přístup k obsahu a budou s ním moci pracovat, takže získají plnohodnotný zážitek.
Lidé se sluchovým postižením: Lidé se sluchovým postižením budou moci využívat audio a video obsah a nepřijdou o důležité informace ani zážitky.
Lidé s pohybovým postižením: Lidé s omezenou obratností nebo pohyblivostí se snáz zorientují na webu a dokončí úkoly bez běžné myši.
Lidé s kognitivním postižením: Lidé s kognitivními obtížemi, třeba s poruchami učení nebo pozornosti, ocení jednoduchou a přehlednou navigaci a jasné pokyny na celém webu.
Starší lidé: S věkem mohou přijít potíže se zrakem, sluchem nebo pohybem. Funkce přístupnosti pomáhají starším lidem používat web pohodlně a efektivně.
Kroky k přístupnému webu
Jednotné rozvržení a struktura
Při plánování webu zajistěte, aby byly všechny stránky jednotné. Jednotná struktura zahrnuje stejné sekce, menu a další prvky, aby se lidé snadno orientovali.
Dobře uspořádané rozvržení je klíčové pro lidi s kognitivním postižením, protože jim pomáhá soustředit se na důležitý obsah a úkoly bez zahlcení.
Lidé s pohybovým postižením se orientují snáz, když je rozvržení předvídatelné. Ubude frustrace a snáz dokončí úkoly.
Sémantické HTML značky (jako <header>, <nav>, <footer>) umožní čtečkám obrazovky obsah efektivně přečíst a uspořádat.
Měnitelná velikost textu
Tato funkce umožní lidem zvětšit nebo zmenšit písmo na webu. Je zásadní pro lidi se zrakovým postižením, hlavně se slabým zrakem nebo zhoršeným zrakem kvůli věku. Mohou si text nastavit na velikost, která se jim pohodlně čte, aniž by se rozbilo rozvržení nebo web přestal být použitelný.
Hodně lidí se slabým zrakem má s malým písmem potíže. Když jim umožníte měnit velikost textu, dáte jim kontrolu nad tím, jak obsah čtou, a zlepšíte čitelnost i pohodlí.
Měnitelná velikost textu je důležitá nejen na počítači, ale i na mobilu, aby web zůstal přívětivý na všech zařízeních.
Alternativní text obrázků
Alternativní text (alt text) je psaný popis obrázků na webu. Čtečky obrazovky ho používají k popisu obrázků lidem, kteří je nevidí. Stačí přidat textový popis do HTML kódu obrázku.
Nevidomí nebo lidé s těžkým zrakovým postižením spoléhají na čtečky obrazovky, které jim obrázky popíšou. Bez alt textu přijdou o důležité informace.
I když člověk obrázek vidí, alt text zajistí, že se správně předá jeho kontext a význam.
Vysoký kontrast barev
Vysoký kontrast znamená tmavý text na světlém pozadí nebo naopak. Vzniká jasný vizuální rozdíl, který usnadňuje čtení lidem se slabým zrakem. S vysokým kontrastem lidé obsah webu jasně vidí.
Hodně lidí se slabým zrakem nebo barvoslepostí má potíže číst text, který se od pozadí výrazně neodlišuje.
Pro lidi s barvoslepostí může být vysoký kontrast zásadní, aby rozlišili text od pozadí a poznali důležité prvky rozhraní.
Titulky a přepisy k videím
Mluvené slovo ve videích mohou zachytit titulky. Přepisy obsahují celý text veškerého zvuku ve videu, včetně dialogů a zvukových efektů.
Někomu se může lépe sledovat přepis než video, nebo prostě raději čte, než se dívá.
Neslyšící a nedoslýchaví lidé potřebují titulky, aby mohli video sledovat. Bez titulků přijdou o důležité informace, které mohou být pro účel webu zásadní.
Přístupnost na mobilu
Přístupnost na mobilu znamená, že web správně funguje na mobilních zařízeních: rozvržení a obsah se přizpůsobí menším obrazovkám a lidé s webem snadno pracují dotykem.
Hodně lidí, včetně lidí s pohybovým postižením, používá dotykové obrazovky. Přístupnost na mobilu zajistí, že se web snadno ovládá prsty nebo asistenčními dotykovými nástroji.
Web přizpůsobený mobilům se přizpůsobí různým velikostem obrazovek a zlepší zážitek všem, včetně lidí se zrakovým nebo pohybovým postižením.
Dodržování těchto standardů přístupnosti nejen zajistí rovný přístup lidem s postižením, ale usnadní život všem. Výhody pro SEO jsou skutečné, protože vyhledávače upřednostňují weby s čistou strukturou, alt texty a rychlým výkonem. Když web uděláte inkluzivnější, vytvoříte prostředí, ve kterém se všichni bez ohledu na své schopnosti snadno orientují a zapojí. Více o správné stavbě webu se dočtete v našem článku o tom, jak postavit úvodní stránku. Můžete se podívat také na náš SEO plán pro začátečníky. Celý obrázek najdete v našem hlavním průvodci co je web a proč ho potřebujete.
Často kladené otázky
Co jsou principy přístupného designu?
Principy přístupného designu jsou zásady, díky kterým web mohou používat všichni, včetně lidí se zrakovým, sluchovým, pohybovým nebo kognitivním postižením. Patří k nim jasná navigace, alt text u obrázků, vysoký kontrast barev, měnitelná velikost textu, ovládání klávesnicí a titulky k videím. Díky nim je web použitelnější pro všechny návštěvníky.
Pomáhá přístupnost webu SEO?
Ano. Přístupnost a SEO se z velké části překrývají. Alt text pomáhá vyhledávačům pochopit obrázky. Čistá struktura nadpisů pomáhá robotům číst obsah. Rychlé načítání a zobrazení na mobilu zlepšují přístupnost i pozice. Přístupný web se vyhledávačům přirozeně snáz čte a indexuje.
Je přístupnost webu povinná ze zákona?
V mnoha regionech ano. Evropský akt o přístupnosti v EU, americký zákon ADA a podobné zákony v dalších zemích vyžadují, aby weby splňovaly určité standardy přístupnosti. I tam, kde se pravidla tolik nevymáhají, přibývá žalob kvůli nepřístupným webům. Přístupnost od začátku chrání vaši firmu právně i eticky.
Jak otestuji, jestli je můj web přístupný?
Použijte bezplatné online nástroje, které web prověří na běžné problémy, jako je chybějící alt text, nízký kontrast nebo chybějící popisky. Vyzkoušejte web jen s klávesnicí, bez myši. Zkuste čtečku obrazovky a poslechněte si, jak obsah zní. Tyto jednoduché testy odhalí největší problémy dřív, než na ně narazí návštěvníci.
Jaká je nejčastější chyba v přístupnosti webů?
Chybějící alt text u obrázků. Čtečky obrazovky bez něj obrázky nepopíšou, takže nevidomí a slabozrací lidé přijdou o důležité informace. Oprava je jednoduchá. Ke každému obrázku přidejte krátký popis, který vystihne jeho účel. Dekorativní obrázky mohou mít prázdný alt text, aby je čtečky přeskočily.
Podporuje WEMASY přístupný design webu?
Ano. Tvůrce webů od WEMASY vytváří stránky s čistou HTML strukturou, rozvržením pro mobily a rychlým načítáním už ve výchozím stavu. Ke každému obrázku přidáte alt text, upravíte kontrast a obsah uspořádáte správnými nadpisy. Platforma vám dá základ pro principy přístupného designu bez potřeby vývojáře.
