# A11y tools

### **Development**

* DevTools
* [storybook-addon-a11y](https://www.npmjs.com/package/@storybook/addon-a11y)
* [eslint-plugin-jsx-a11y](https://www.npmjs.com/package/eslint-plugin-jsx-a11y)

### **Extensions**

* [tota11y](https://khan.github.io/tota11y/) - An accessibility visualization toolkit by Khan Academy
* [WAVE Web Accessibility Evaluation Tool](https://wave.webaim.org/) - very solid output, but with very legacy UI
* Our favorite [Accessibility Insights for Web](https://accessibilityinsights.io/docs/en/web/overview)

### **Automated tools**

* <https://pa11y.org/> with impressive dashboard
* <https://github.com/dequelabs/axe-core> with possible [cypress-axe](https://github.com/component-driven/cypress-axe) integration
* <https://tenon.io/> paid, but great

### **Cross-browser testing tools**

* All of the tools falls under [Responsive Web Design](https://strv.gitbook.io/frontend/a11y-0.0.1/project-guidelines/great-ux-ui/responsive-web-design#cross-browser-testing-tools)

### **Audit tools**

* Lighthouse
* [https://ace.accessibe.com/](https://ace.accessibe.com/?website=https://calculator.strv.com/)

### **3rd party tools**

* <https://userway.org/>
* <https://accessibe.com/>

### **Dependencies**

Whenever you are adding a new dependency to your project, double check what a11y implications it can bring. Naturally you sould look for well a11y complient solutions.

* Review dev dependencies from a11y point of view
* 3rd party services
  * [Intercom WCAG compliance](https://www.intercom.com/help/en/articles/2530813-is-the-intercom-messenger-accessible)
  * [Plausible.io](http://plausible.io) privacy
