Nástroje pro testování přístupnosti a WCAG checkery ve srovnání

Dobrých nástrojů pro testování přístupnosti je mnoho a většina z nich je zdarma. Liší se méně tím, co najdou, a více tím, kde běží (rozšíření prohlížeče, příkazová řádka, cloudová služba), jaký engine pravidel používají a kdo výsledek čte: vývojář, QA tým, nebo majitel firmy. Tato stránka srovnává nástroje, které lidé hledají nejčastěji, s fakty z jejich oficiálních stránek, a vysvětluje, kam zapadá Pandus.

Každý nástroj na této stránce je automatický tester. Žádný z nich nemůže potvrdit, že web splňuje WCAG; najdou část problémů. Naše kontroly jsou automatizovanou kontrolou, nikoli úplným auditem, a nejde o právní poradenství.

Srovnávací tabulka

Ceny a funkce se mění; před rozhodnutím si ověřte stránku každého dodavatele.

WAVE

WAVE je sada hodnoticích nástrojů od WebAIM z Utah State University. Na webu zadáte URL, nebo použijete rozšíření pro Chrome, Firefox a Edge. Rozšíření běží celé ve vašem prohlížeči, takže funguje i na stránkách za přihlášením, u místních souborů a dynamických stránek. Výsledky se zobrazí jako ikony na stránce a v postranním panelu s chybami, chybami kontrastu a upozorněními k ruční kontrole. Pro mnoho stránek existuje API v předplatném a samostatný engine. Je oblíbený při výuce, protože ukazuje problémy tam, kde jsou.

Lighthouse

Lighthouse je open-source nástroj Googlu pro kvalitu stránek. Spustíte ho z karty Lighthouse v Chrome DevTools, z příkazové řádky nebo online přes PageSpeed Insights. Jeho skóre přístupnosti je vážený průměr testů typu prošel/neprošel založených na pravidlech axe; ruční kontroly skóre neovlivňují. Jako rychlý signál je to užitečné, ale plné skóre pokrývá jen automatické testy — neznamená, že stránka splňuje WCAG.

axe DevTools a axe-core

axe-core je open-source engine pravidel od Deque Systems, na kterém staví mnoho nástrojů, včetně Pandus. axe DevTools je produktová řada Deque kolem něj: rozšíření prohlížeče s bezplatnou verzí, placené funkce Pro, například řízené testy, linter pro VS Code a integrace pro automatické testy v CI.

Accessibility Insights for Web

Accessibility Insights je open-source sada nástrojů od Microsoftu. Webové rozšíření pro Chrome a Edge nabízí FastPass, který za pár minut najde časté problémy s velkým dopadem, a Assessment, který lidi se znalostí HTML provede kritérii WCAG 2.1 AA včetně ručních kroků. Existují i verze pro aplikace ve Windows.

IBM Equal Access Accessibility Checker

Equal Access toolkit od IBM je open source pod licencí Apache-2.0. Checker se začlení do vývojářských nástrojů Chrome, Firefoxu a Edge a npm balíček accessibility-checker spouští stejná pravidla v CI se Selenium, Puppeteer nebo Playwright. Používá vlastní engine pravidel IBM se sadami pravidel pro WCAG 2.2, 2.1 a 2.0, takže je dobrým druhým názorem vedle nástroje založeného na axe.

Pa11y

Pa11y je rodina bezplatných open-source nástrojů pro příkazovou řádku. Pa11y testuje jednu stránku; Pa11y CI projde seznam URL a je určený pro pipeline. Umí spustit HTML_CodeSniffer, výchozí volbu, nebo axe-core.

BrowserStack Accessibility Testing

BrowserStack Accessibility Testing je komerční služba s vlastním enginem pravidel Spectra, rozšířením prohlížeče pro Chrome a Edge, skenerem webů a integrací do CI. Podle BrowserStacku obsahuje bezplatný tarif neomezené skeny webu na vyžádání, které pokryjí až pět unikátních stránek. Hodí se týmům, které už BrowserStack používají pro testování v různých prohlížečích.

Kam zapadá Pandus

Pandus používá stejný otevřený engine axe-core jako Lighthouse a axe DevTools. Rozdíl je v tom, co se děje kolem testu:

• Každá stránka, každý týden. S tarifem Pandus pravidelně podle rozvrhu projde celý web a ukáže, co je nového, co bylo opraveno a jaký je trend.
• Reporty pro majitele firem. Ke každému nálezu patří srozumitelná karta pravidla: co znamená pro zákazníky a jak ho opravit na Shopify, WooCommerce, PrestaShopu nebo Shoptetu.
• Sedm jazyků. Výsledky a reporty v angličtině, ukrajinštině, němčině, polštině, češtině, rumunštině a ruštině.
• Vazba na EN 301 549. Každé pravidlo odkazuje na své kritérium WCAG a článek normy EN 301 549 V3.2.1 i V4.1.1, evropské normy, o kterou se opírá evropský akt o přístupnosti.
• White-label pro agentury. Reporty pod značkou agentury, viz Pandus pro agentury.
• Bezplatné nástroje. WCAG checker pro jednu stránku, kontrola kontrastu barev, rozšíření prohlížeče pro stránky za přihlášením a plugin pro WordPress.

Pokud jste vývojář a ladíte jednu komponentu, rozšíření pro DevTools je rychlejší volba. Pokud potřebujete každý týden vědět, zda se e-shop klienta nezhoršil, a vysvětlit to někomu, kdo není vývojář, právě na to je Pandus postavený.

Jak nástroje kombinovat

1. Během vývoje: rozšíření nebo linter založený na axe, k tomu druhý engine (WAVE nebo IBM) pro nejasné případy.
2. V CI: Pa11y CI, npm balíček IBM nebo axe-core ve vašich end-to-end testech.
3. Po spuštění: týdenní monitoring celého webu a reporty pro majitele.
4. Vždy: ruční testy klávesnicí, přiblížením a čtečkou obrazovky — viz jak testovat WCAG. Pro prohlášení o shodě si objednejte audit přístupnosti.

Časté otázky

Jaký je nejlepší WCAG checker?

Záleží na úkolu. Rozšíření prohlížeče jako WAVE, axe DevTools, Accessibility Insights nebo IBM Equal Access se hodí vývojářům, kteří kontrolují jednu stránku; Lighthouse dá rychlé skóre; Pa11y a npm balíček IBM se hodí do CI; monitorovací služby jako Pandus kontrolují celé weby každý týden a reportují majitelům.

Které nástroje pro testování přístupnosti jsou zdarma?

WAVE online a jeho rozšíření, Lighthouse, bezplatné rozšíření axe DevTools, axe-core, Accessibility Insights, IBM Equal Access Accessibility Checker a Pa11y lze používat bez placení. BrowserStack má bezplatný tarif s omezeními; Pandus zkontroluje jednu stránku zdarma.

Dávají WAVE, Lighthouse a axe DevTools stejné výsledky?

Ne úplně. Lighthouse, axe DevTools a Accessibility Insights používají engine axe-core, takže se jejich automatické výsledky překrývají; WAVE, IBM Equal Access a Pa11y ve výchozím nastavení používají vlastní pravidla. Dva různé enginy mohou zachytit o několik problémů víc.

Může nějaký nástroj potvrdit soulad s WCAG?

Ne. Každý automatický nástroj testuje jen část kritérií úspěšnosti WCAG. Čistý výsledek je dobré znamení, ne potvrzení; testy klávesnicí, přiblížením a čtečkou obrazovky v podání člověka jsou stále potřeba.

Kam zapadá Pandus?

Pandus každý týden spouští axe-core na každé stránce webu, přiřazuje nálezy k WCAG a EN 301 549 a mění je v reporty pro majitele firem v sedmi jazycích, pro agentury i pod vlastní značkou. Jde o automatizovanou kontrolu, nikoli úplný audit.

Zdroje

• WebAIM, WAVE: https://wave.webaim.org/ a https://wave.webaim.org/extension/
• Chrome for Developers, Lighthouse overview: https://developer.chrome.com/docs/lighthouse/overview
• Chrome for Developers, Lighthouse accessibility scoring: https://developer.chrome.com/docs/lighthouse/accessibility/scoring
• Deque, axe DevTools: https://www.deque.com/axe/devtools/
• Microsoft, Accessibility Insights: https://accessibilityinsights.io/ a https://github.com/microsoft/accessibility-insights-web
• IBM, Equal Access toolkit: https://github.com/IBMa/equal-access
• Pa11y: https://pa11y.org/ a https://github.com/pa11y/pa11y
• BrowserStack, Accessibility Testing: https://www.browserstack.com/accessibility-testing a https://www.browserstack.com/accessibility-testing/free-accessibility-testing-tools