Accessibility is one of the most important aspects of modern web development. Accessibility means the greatest number of users can view your content. It means search engines will be able to read your site more completely. Users of all types will have a better experience if you take accessibility concerns into account. And least of all, it is required by law for all federal EIT products to be accessible (with a few minor exceptions).
Accessibility works best when incorporated into an agile production environment. It’s very hard to adequately address accessibility concerns at the end of a project, but if taken into account at the beginning, it’s quite straightforward and cost effective. The best and perhaps only way to ensure this is done, is training and education. Every member of a production team should be aware of what accessibility concerns are and have a basic understanding of how they are addressed.
Here at 18F we follow WCAG2.0 AA as our standard for accessibility. We do this for a couple of reasons. WCAG has long been the gold standard for accessibility on the web. The access board has also been working on a refresh to the correct 508 standards to incorporate WCAG2.0 AA into the standards. This sets us up for a smooth transition when that happens. Finally, under 1194.5 of the section 508 standards allows us to use a set of standards that meet the current standards.
If you have any questions about accessibility, 508, or would like help, please reach out on the GitHub Repo.
Disclaimer: This resource is intended to help 18F develop accessible products and is not a replacement for the standards defined by the Access Board. Please visit the Access Board for information on 508 and their compliance criteria.
- Accessibility Insights - Windows application for automated and guided manual testing for accessibility including WCAG 2.0 and 2.1.
- Colour Contrast Analyser - Mac and Windows application to test for color contrast against WCAG 2.0 and 2.1 guidelines.
- HTML CodeSniffer - use this for a quick audit of any URL
- Pa11y Automated Tool - Open-source
- tanaguru contrast finder - Open-source tool to find better color contrast options.
- Accessible color palette builder - Open-source
- Windows: Inspector - This tool is used by the DHS for their Trusted Tester Program.
- Windows: NVDA Screenreader - Open-source
Browser Testing Tools
- Chrome/Edge: Accessibility Insights - Browser plugin for automated and guided manual testing for accessibility including WCAG 2.0 and 2.1.
- Firefox: WCAG Contrast checker - Fast way to evaluate CSS color contrast.
- Chrome: Color Contrast Analyzer - Great for gradients & images.
- Chrome: Accessibility Developer Tools
- Firefox/Chrome: WAVE Toolbar
- Firefox/Chrome: Web Developer
Government Sites and tutorials
- Section 508
- Accessibility for Teams
- 18F Accessibility Checklist
- GSA’s Section 508 Policies
- CFPB’s building accessible interfaces guide
- Creating Accessible PDFs
- Required fixes for PDFs
- Making Files Accessible PDF, Word, Excel, Powerpoint
World Wide Web Consortium’s Web Accessibility Initiative
- Web Content Accessibility Guidelines (WCAG) 2.0
- How to Meet WCAG (Quick Reference)
- Web Accessibility Tutorials
- Accessible Rich Internet Applications (ARIA) Documentation
- Web Accessibility Evaluation Tools List
Misc Sites and tutorials
- Inclusive Components - A blog about designing inclusive web interfaces, piece by piece.
- WebAIM’s Blog
- The Accessibility Project - Good accessibility blog.
- Knowbility’s Blog - WCAG 2.1 Series
- Simply Accessible - A great blog and resource with articles about modern accessibility.
- WebAIM’s Accessibility Resources
- ARIA practical Examples
- Tips for creating Accessible SVGs
- Udacity Web Accessibility Course - Free web accessibility course by Google
- Viget Interactive WCAG 2.0 - Interactive accessibility guide (W3C/WebAIM)
- Vox Accessibility Guidelines Checklist
- CanIUse.com - useful for HTML5, ARIA & CSS
- New Zealand Web Accessibility Standard 1.1