# Accessibility ## Why test for accessibility? 1. Testing for accessibility [Link](https://www.gov.uk/service-manual/helping-people-to-use-your-service/testing-for-accessibility) 2. Testing with assistive technologies [Link](https://www.gov.uk/service-manual/technology/testing-with-assistive-technologies) 3. Read more about accessibility in: - [A web for everyone](https://rosenfeldmedia.com/books/a-web-for-everyone/) - you’ll need to pay for this book but some sections of this book are available free online, including accessibility personas - [Inclusive design patterns: coding accessibility into web design](https://www.smashingmagazine.com/2016/10/inclusive-design-patterns/) - you’ll need to pay for this book 4. [The pros and cons of automated tools](https://accessibility.blog.gov.uk/2017/02/24/what-we-found-when-we-tested-tools-on-the-worlds-least-accessible-webpage/) 5. [Accessibility game](https://userinyerface.com/) ## Accesssibility Tools 1. Use eslint plugins for static analysis eg [eslint-plugin-jsx-a11y](https://github.com/evcohen/eslint-plugin-jsx-a11y) 2. For checking contrast you can use [Usecontrast](https://usecontrast.com/) or chrome pluggin [WCAG contrast checker]( https://chrome.google.com/webstore/detail/wcag-contrast-checker/plnahcmalebffmaghcpcmpaciebdhgdf?hl=en) or [Color Contrast Analyzer](https://chrome.google.com/webstore/detail/color-contrast-analyzer/dagdlcijhfbmgkjokkjicnnfimlebcll?hl=en) 3. [Axe - Web Accessibility Testing]( https://chrome.google.com/webstore/search/accessibility?hl=en) 4. [Accessibility Insights for Web](https://chrome.google.com/webstore/detail/accessibility-insights-fo/pbjjkligggfmakdaogkfomddhfmpjeni?hl=en) - [website](https://accessibilityinsights.io/) 5. [Siteimprove Accessibility Checker](https://chrome.google.com/webstore/detail/siteimprove-accessibility/efcfolpjihicnikpmhnmphjhhpiclljc?hl=en) 6. On Mac's OS, you can enable the accessibility screen reader and browse the features 7. [ChromeVox Classic Extension](https://chrome.google.com/webstore/detail/chromevox-classic-extensi/kgejglhpjiefppelpmljglcjbhoiplfn?hl=en) 8. [WAVE Evaluation Tool](https://chrome.google.com/webstore/detail/wave-evaluation-tool/jbbplnpkjmmeebjpijfedlgcdilocofh?hl=en) 9. [Accessibility Developer Tools](https://chrome.google.com/webstore/detail/accessibility-developer-t/fpkknkljclfencbdbgkenhalefipecmb?hl=en) 10. Check out the built-in Accessibility audits in the Lighthouse Audits panel in Chrome DevTools 11. [Codeception TestTools](https://chrome.google.com/webstore/detail/codeception-testtools/jhaegbojocomemkcnmnpmoobbmnkijik?hl=en) 12. [WCAG Accessibility Audit Developer UI](https://chrome.google.com/webstore/detail/wcag-accessibility-audit/kpfleokokmllclahndmochhenmhncoej?hl=en) 13. [Landmarks](http://matatk.agrip.org.uk/landmarks/) 14. [SortSite](https://www.powermapper.com/products/sortsite/checks/accessibility-checks/) SortSite is a website testing tool available both as a desktop and web application that tests for accessibility, broken links, HTML and CSS standards, search engine optimization, and cross-browser compatibility. The accessibility checker will run against all three WCAG 2 levels (A, AA, AAA), as well as guidelines specific to Section 508. 15. [Pa11y](https://pa11y.org/) Pa11y is a developer-focused accessibility testing resource. They provide several tools for setting up your own suite of accessibility testing, including a command line interface, a dashboard, and a web service for scheduling tests for multiple URLs, they are great tools for monitoring accessibility issues on an ongoing basis. 16. [Tota11y](http://khan.github.io/tota11y/) Tota11y is a tool to help reduce the barrier of entry to understanding accessibility issues by visualizing them on a page. When tota11y is active, a menu will appear in the bottom left corner of your web browser. When open, you have the option to display or hide errors related to headings, contrast, confusing link text, form labels, and images. Tota11y will highlight the errors, revealing them on the page and also give details about what is causing the issue and steps you can take to correct the issue. 17. [HTML5 Accessibility](https://www.html5accessibility.com/) gives an overview of browser support for HTML5 features across browsers. 18. [NVDA](https://www.nvaccess.org/about-nvda/) Screen reader for Windows. 19. [NoCoffee](https://chrome.google.com/webstore/detail/nocoffee/jjeeggmbnhckmgdhmgdckeigabjfbddl) Vision simulator. 20. [Cauldron](https://pattern-library.dequelabs.com/) A “fully accessible” HTML, CSS, and Javascript front-end framework. 21. [A11y](https://color.a11y.com/) is a free color contrast analysis that will display the color contrast issues of a web page per WCAG 2.1 Guidelines. 22. [Funkify](https://www.funkify.org) is a Chrome extension that helps you experience the web and interfaces through the eyes of extreme users with different abilities and disabilities. 23. [Accessibility Insights](https://accessibilityinsights.io/) has tools for browsers, Windows and mobile devices. Also has a guided process for going through 'WCAG 2.1 AA' More tools can be found [here](https://www.w3.org/WAI/ER/tools/) and more information [here](https://github.com/brunopulis/awesome-a11y/blob/master/README.md)