Proc automaticka kontrola odhali vic, nez cekate
Vetsi cast majitelu e-shopu predpoklada, ze jejich web je pristupny. Opak byva pravdou. Automaticka kontrola typicky odhali desitky az stovky nalezu i na zdanlive normalnim e-shopu.
Automatizace pokryva priblizne 30-50 % pravidel WCAG 2.1 AA. Co jsou nejcastejsi problemy?
Chybejici alt texty
Nejrozsirenejsi nalez. Obrazky bez textoveho popisu (atribut alt) jsou pro uzivatele s cteckou obrazovky zcela nedostupne.
Jak opravit:
- Funkcni obrazky (produkty, ilustrace, loga): smysluplny popis, co obrazek zobrazuje nebo co tlacitko dela
- Dekorativni obrazky (pozadi, ozdoby): prazdny atribut alt, ctecka je preskoci spravne
- Obrazky s textem: text musi byt v alt atributu
Nizky barevny kontrast
Druhy nejcastejsi problem. WCAG 2.1 AA vyzaduje minimalni pomer kontrastu 4,5:1 pro normalni text a 3:1 pro velky text (18pt nebo 14pt tucny). Slaby kontrast trapi lidi se slabym zrakem.
Typicke problematicke prvky: svetle tlacitko Pridat do kosiku na bilem pozadi, sedy popisny text, chybove hlasky v blade barve, text na obrazkovych bannerech.
Jak opravit: nastroje jako Colour Contrast Analyser nebo automaticky sken vam okamzite ukazou, ktera mista nesplnuji standard.
Nepristupne formulare
Formulare jsou kritickem mistem e-shopu. Nejcastejsi problemy:
- Chybejici label (popisek) u pole: pole Email bez programaticky prirazzeneho popisku nepozana ctecka
- Chybove hlasky neoznamene pres ARIA: uzivatel s cteckou nevidi, ze nastala chyba
- Povinna pole bez oznaceni: hvezdicka (*) bez textoveho vysvetleni nestaci
- Tlacitka bez smysluplneho textu: Potvrdit je lepsi nez jen ikonka bez popisu
Problemy s ovladanim klavesnici
Zakon vyzaduje, aby byl cely e-shop ovladatelny bez mysi. Nejcastejsi problemy:
- Chybejici viditelny focus ring: kdyz uzivatel Tab-uje pres stranku, musi vzdycky videt, kde se nachazi
- Keyboard trap: uzivatel se uvizne v modalnim okne nebo menu a nemuze se klavesnici dostat ven
- Spatne poradi focusu: Tab skace neprirozene po strance
Nepristupne interaktivni prvky
Tlacitka a odkazy musi mit pristupny nazev, aby je asistivni technologie spravne oznamovaly. Problematicke vzory:
- Tlacitko jen s ikonkou bez textu nebo aria-label
- Odkaz Kliknete zde nebo Vice bez kontextu
- Interaktivni div nebo span bez role button a klavesnicove podpory
Jak zacit opravovat
Doporuceny postup:
- Spuste automaticky sken - odhalite nejpusobivejsi problemy rychle a zdarma
- Prioritizujte dle zavaznosti: kriticke (critical) a zavazne (serious) nalezy resite jako prvni
- Opravte technicke chyby: alt texty, kontrast, popisky formularu jsou relativne snadne opravy
- Zadejte manualni audit: zbytek pravidel (srozumitelnost, chovani na cteckach) vyzaduje lidske posouzeni
Pamatujte: automaticka kontrola odhali priblizne 30-50 % pravidel WCAG. Opravit automaticky nalezene chyby je nezbytny, ne dostacujici krok pro splneni zakona c. 424/2023 Sb.
Další články průvodce
Časté dotazy
- Kolik chyb je normalni?
- Vetsi cast e-shopu ma desitky az stovky automaticky detekovatelnych nalezu. Dulezitejsi nez pocet je zavaznost - kriticke a zavazne chyby resite jako prvni.
- Jak poznam, co opravit jako prvni?
- Zamertte se na nalezy oznacene jako kriticke (critical) a zavazne (serious) - ty maji nejvetsi dopad na uzivatele se zdravotnim postizenim.
- Staci opravit automaticky nalezene chyby?
- Ne. Automatizace odhali priblizne 30-50 % pravidel WCAG 2.1 AA. Pro uplny prehled - a pro splneni zakona c. 424/2023 Sb. - je nutny manualni audit.
Chcete otestovat přístupnost vašeho webu hned?
Spustit kontrolu přístupnosti