Automated Accessibility

Shashikant Jagtap Twitter : Shashikant86Blog: http://shashikantjagtap.net

Disclaimer

The opinions expressed here are my own.

Topics Accessibility Testing Manual Accessibility Testing Automated Accessibility Testing Accessibility Toolkit

Accessibility Testing Standards Web Content Accessibility Guidelines

(WCAG) Section 508 Web Content Accessibility Guidelines

2.0 (WCAG)

What To Check ? ARIA Roles : role=main, states, properties Audio/Video: Controls, track HTML: JS/CSS, Tab-Index, Headings, Lang Image: alt, aria role, Focus : Tab-index Color: Color Contrast

Manual Screen Readers NVDA, Voiceover, TalkBack Color Contrast Check Using Online Tools W3C, Wave etc etc

Automation Options Google Accessibility Developer Tool A11y Pa11y- Accessibility Testing pal Axe – The Accessibility Engine Tenon - Simplify Your Accessibility

Google Accessibility Developer Tool

GitHub: https://github.com/GoogleChrome/accessibility-developer-tools Developed at Google It can be used with NPM, Grunt and Ruby. It may have other wrappers as well. NPM = accessibililty-developer-tool

Grunt = A11y Ruby = Access Lint

GADT + A11Y

Pa11y Automated testing pal Developed at 'Nature' Website : http://pa11y.org/ It can be used with NodeJS [npm] $ npm install -g pa11y

Pa11y

Axe : The Accessibility Engine

Website : http://www.deque.com/products/axe/

Developed by 'Deque' It can be used with many test frameworks Cucumber, Rspec, Selenium, PhantomJS,

Qunit, Jasmine, Mocha, karma RubyGem : Axe-Matchers https://rubygems.org/gems/axe-matchers

Tenon.io Tenon : Needs API KEY https://tenon.io/Grunt: $ npm install grunt-tenon-clientRubyGem: Mortise $ gem install mortise

Demo

Links GitHub Repo: https://github.com/Shashikant86/modern-accessibility

Video Demo Youtubehttps://www.youtube.com/watch?v=yv5ortZHVYc

Pa11y

https://www.youtube.com/watch?v=8zgPr9qWkuk

Axe-tenon

https://www.youtube.com/watch?v=KtusAZQfhaw