Web Development Tools

Guidelines


The World Wide Web Consortium (W3C) via the Web Access Initiative (WAI) has published the Web Content Accessibility Guidelines (WCAG) 2.0 Level of Conformance AA which have been adopted by Iowa State to guide web development that is accessible.  Their Quick Reference Guide is useful in helping developers identify guidelines applicable to their projects.


For Rich Internet Applications, the W3C has put forth standards- the Accessible Rich Internet Applications (WAI-ARIA) Recommendation 1.0 - that help inform behaviors, focus, element definition, and other aspects of rich UIs to make them accessible.


If you adopt any of these code examples or tools, or have any established workflow or tools that inform your accessible development, we would like to hear from you.  The Office of Digital Access is working to identify viable tools and workflows for the various platforms and development workflows on campus.  We will appreciate you provide information and collaborate in this effort.


Demos and Code


The W3C clearly demonstrates that a website can be accessible without a major impact on visual design decisions with its before and after accessibility demo website


Bryan Garaventa, accessibility expert and founder of WhatSock, shares technical documentation and code examples about the the "Accessibility Tree and How ARIA works" for those who want in-depth understanding of the intricacies of the layers involved in the accessibility of rich internet applications.


W3C provides an Accessible UI Components List including previews and code.


Adobe has an accessible mega menu in github.


Deque University shares a library of accessible elements with its respective code.


Checklists


Accessibility checklist for web developers by Luke McGrath, accessibility consultant and writer.


Development Tools


WhatSock offers AccDC API, "a JavaScript based Dynamic Content Management System that automates the rendering of dynamic content to ensure accessibility for screen reader and keyboard only users."  This project also offers extensive training you can read through about "The Accessibility Tree."


Favlets is yet another way to address accessibility throughout development.  SSB Bart Group provides information and resources on how to take advantage of accessibility favlets.


The a11yproject, a github community, has extensive documentation on how to's for web developers. It is also a good way to contribute to accessibility efforts with your developer peers.


Mac developers can resort to XCode's accessibility inspector.  Apple also provides extended information on iOS and Mac developmentaccessibility.


If you have to insert a carrousel in your page, please take time to look at W3C recommendations, rethink if it's possible to convey the message in a more accessible way.  WhatSock provides an example of an accessible carrousel you may use as a guide.


Drupal developers can view this content management system's accessibility features in their documentation.


Vorlon.js is an open source, extensible, platform-agnostic tool for remotely debugging and testing your JavaScript. Powered by node.js and socket.io.


Visual Studio users can resort to the IDE's accessibility checker.


Axe-core, from Deque, offers the possibility of automated testing.


To test code, you may resort to Tenon.io.


A11yfy Library Functions for making jQuery code accessible


There is a list and links to accessibility tools in GitHub.


Android development can be made accessible with their accessibility scanner


GitHub code sniffer


Open Source Automatic Testing with AccessLint CI


Accessibility for Developers wiki


Examples Library by SSB Bart Group