Kontrola prístupnosti webu – WCAG

Kontrola prístupnosti webu podľa WCAG 2.2: kontrast farieb, alt text, nadpisy, poradie fokusu, simulátor farbosleposti.

🔍 Kontrola prístupnosti webu podľa WCAG 2.0, 2.1 a 2.2 Kontrola prístupnosti webu premení ktorúkoľvek kartu prehliadača na audítorské pracovisko. Otvor bočný panel, prehľadaj stránku a čítaj každú chybu zoskupenú podľa pravidla, s nameranou hodnotou vedľa požadovanej hranice, s dôvodom, s opravou a s ukážkou kódu pripravenou na vloženie. Pod kapotou táto kontrola prístupnosti webu spúšťa axe-core 4.13 a navyše vlastnú vrstvu pravidiel pre kritériá WCAG 2.2, ktoré zatiaľ takmer žiadny nástroj nepokrýva: veľkosť cieľa, fokus nie je zakrytý, prístupné overenie, rozostupy textu a preformátovanie. Väčšina ľudí si inštaluje nástroj na kontrolu prístupnosti webu pre jedinú otázku pred vydaním: čo neprejde a presne kde. Odpoveď je tu za dve sekundy, na stránke, ktorú máš aj tak otvorenú, bez kroku zostavenia a bez radu pri cloudovom robotovi. ✅ Čo pokrýva každé skenovanie ➤ Kontrast bežného textu, veľkého textu a netextových prvkov ➤ Alternatívne texty, dekoratívne obrázky a obrázky opísané inde ➤ Štruktúra nadpisov, orientačné body, jazyk stránky a titulok dokumentu ➤ Popisy formulárov, texty odkazov, tabuľky, titulky a video alternatívy ➤ Poradie tabulátora, indikátor fokusu, pasce klávesnice, veľkosť cieľa 📐 Normy, ktoré pozná Výsledok pomôže až vtedy, keď pomenuje pravidlo, podľa ktorého ťa budú hodnotiť, takže každý nález nesie svoje kritérium úspechu, úroveň a verziu. 1. WCAG 2.0, 2.1 a 2.2 na úrovniach A, AA a AAA 2. Zákon o informačných technológiách vo verejnej správe 3. EN 301 549 a European Accessibility Act v Európe 4. Section 508, ADA Title III a AODA v Severnej Amerike 🎨 Kontrast meraný dvoma spôsobmi Naber kvapkadlom dve farby, uprav ich naživo a sleduj pomer WCAG vedľa hodnoty APCA Lc. Kalkulačka kontrastu vynesie verdikt pre bežný text, veľký text aj netextové prvky naraz, takže výsledok WCAG 2.1 AA leží jeden pohľad od prísnejšieho výsledku WCAG AAA. APCA je novšia metóda okolo WCAG 3.0. 🕶 Simulácie zraku na živej stránke 1️⃣ Osem typov farebného videnia, od protanopie po achromatopsiu 2️⃣ Slabozrakosť, sivý a zelený zákal nad skutočným rozložením 3️⃣ Režim ťažkostí s čítaním pre text, ktorý nechce zostať v pokoji Simulátor farbosleposti beží na samotnej stránke, nikdy na snímke obrazovky, takže do prehľadu spadnú aj stavy hover, grafy a náhľady videí. 🧭 Nájdi problém bez čítania DOM - Locate pripne štítok s kritériom priamo na chybný prvok - Mapy nadpisov a orientačných bodov kreslia skutočnú štruktúru - Poradie fokusu sa očísluje pozdĺž reálnej cesty klávesnice - Alternatívny text sa ukáže pri každom obrázku, aj pri dekoratívnom 📄 Výstupy, ktorými audit končí Testovanie je polovica práce. Všetko nižšie vzniká z jedného skenu, takže správa o prístupnosti, ktorú odovzdávaš, sedí na kartu, ktorú si skúšal. 📊 HTML správa vo vlastnom vzhľade, tlačí sa rovno do PDF 🧾 CSV a JSON pre tikety, nástenky a pipeline ✍ Koncept vyhlásenia o prístupnosti vlastného webu 📋 Tabuľka v štýle VPAT pre verejné obstarávanie V pondelok generátor vyhlásenia o prístupnosti, v piatok zdroj správy o zhode. 🌐 Testovanie prístupnosti webu ďalej než jedna stránka Prejdi stránky rovnakého originu v jednom prechode, ulož históriu a porovnaj dva behy, nech vidíš, čo sa pokazilo a čo sa opravilo. Z jednorazovej kontroly sa stane regresné testovanie pred každým vydaním, presne to, čo sa od nástroja na sledovanie čaká. ✦ Prečo zostáva tento panel pripnutý ✦ Každý nález ukazuje nameranú hodnotu, nie hmlisté slovo ✦ Rada vysvetlí opravu, nie iba názov pravidla ✦ Všetko sa exportuje, nikto neskladá správu ručne ✦ Panel prejde vlastným auditom na úrovni WCAG 2.2 AA 🔒 Súkromné už návrhom Obsah stránky, adresy ani výsledky neopustia počítač. Skener bez sieťového volania dosiahne tam, kam sa cloudové skenery nedostanú: staging, intranet a interné zostavenia. Bez účtu, bez registrácie a bez pripojenia. 👥 Postavené pre celý tím Vývojári upratujú pred review, dizajnéri overujú farebné rozhodnutia, QA vedie testovanie prístupnosti webu vnútri šprintu, agentúry tvoria dokumenty pre klienta, redakcia rozhoduje, či stránka pôjde von. Hodí sa každá vykreslená stránka. ⚡ Tri kroky k výstupu → Stlač Alt+Shift+A a nechaj skenovanie prebehnúť → Spracuj zoznam, nájdi prvok, oprav a zopakuj kontrolu → Vyexportuj správu, vyhlásenie alebo tabuľku zhody ⚖ Poctivé k vlastným hraniciam Automatické nástroje dosiahnu zhruba na tretinu kritérií úspechu WCAG a každé skóre aj každý koncept to hovorí priamo. Rýchlo uprac to, čo stroj vidí, a hodiny si nechaj na úsudky, ktoré žiadny automatický nástroj neurobí. Pomoc auditu, nikdy certifikát. ⌨ Pripravené za desať sekúnd Pripni rozšírenie, otvor ľubovoľnú stránku a stlač Alt+Shift+A. Žiadne zostavenie, žiadne zaškolenie, žiadne odpočítavanie skúšobnej verzie. Panel hovorí pätnástimi jazykmi.