Accessibility at Vets.gov
![](https://media.slid.es/uploads/761615/images/4159833/usds-logo-onwhite.png)
Accessibility at Vets.gov
![](https://media.slid.es/uploads/761556/images/4178130/Screen_Shot_2017-09-30_at_9.58.05_PM.png)
What is Accessibilty?
Web accessibility is the inclusive practice of removing barriers that prevent interaction with, or access to websites by people with disabilities. When sites are correctly designed, developed and edited, all users have equal access to information and functionality.
![](https://media.slid.es/uploads/761615/images/4159833/usds-logo-onwhite.png)
Impairments to Consider
-
Visual
-
Motor/Mobility
-
Auditory
-
Seizures
-
Cognitive/Intellectual
![](https://media.slid.es/uploads/761615/images/4159833/usds-logo-onwhite.png)
Our Goal - Accessibility for All
-
We work closely with 508 Office to define accessibility requirements
-
We continuously test to ensure new product updates are compliant with accessibility requirements
![](https://media.slid.es/uploads/761615/images/4159833/usds-logo-onwhite.png)
How we test for Accessibility
-
Manual Testing → Keyboard navigation, screen reader compatibility
-
Automated Testing → aXe
-
Linting → eslint-plugin-jsx-a11y
![](https://media.slid.es/uploads/761615/images/4159833/usds-logo-onwhite.png)
Automated Testing Example
![](https://media.slid.es/uploads/761615/images/4159833/usds-logo-onwhite.png)
- e2e tests
- aXe
- linting
aXe
- browser plugin
- axe-core and axe-webdriverjs
- axe cli
![](https://media.slid.es/uploads/761556/images/4177834/Screen_Shot_2017-09-30_at_3.34.40_PM.png)
axeCheck.js
example usage
![](https://media.slid.es/uploads/761556/images/4177792/Screen_Shot_2017-09-30_at_2.58.26_PM.png)
![](https://media.slid.es/uploads/761556/images/4177800/github.com-department-of-veterans-affairs-vets-website-blob-e4644273bb3db76cac542d5d2306577ff4193d04-test-util-nightwatch-commands-axeCheck.js_iPhone_6_.png)
axeCheck.js
example usage
![](https://media.slid.es/uploads/761556/images/4177800/github.com-department-of-veterans-affairs-vets-website-blob-e4644273bb3db76cac542d5d2306577ff4193d04-test-util-nightwatch-commands-axeCheck.js_iPhone_6_.png)
![](https://media.slid.es/uploads/761556/images/4177823/github.com-department-of-veterans-affairs-vets-website-blob-0d8b592f954dda22ca9bfa8157ff7018bdd6c8b4-test-e2e-sitemap-helpers.js_iPhone_6_.png)
jsx-a11y
![](https://media.slid.es/uploads/761556/images/4177788/Screen_Shot_2017-09-30_at_2.51.24_PM.png)
Manual Testing Example
- General
- Cross-browser test matrix
- Sauce Labs
- Accessibility
- aXe (for debugging)
- Keyboard navigation (behaves as expected)
- Screenreader compatibility
- Web Rotor
- Usual VO commands
![](https://media.slid.es/uploads/761615/images/4159833/usds-logo-onwhite.png)
Cross browser test matrix
![](https://media.slid.es/uploads/761556/images/4177673/Screen_Shot_2017-09-30_at_12.58.32_PM.png)
Keyboard navigation
![](https://media.slid.es/uploads/761556/images/4177678/Screen_Shot_2017-09-30_at_1.03.26_PM.png)
Screenreader compatibility
![](https://media.slid.es/uploads/761556/images/4177680/Screen_Shot_2017-09-30_at_1.06.35_PM.png)
Q&A
![](https://media.slid.es/uploads/761615/images/4159833/usds-logo-onwhite.png)
Accessibility at Vets.gov
automated a11y
By Robbie Holmes
automated a11y
- 1,341