Accessibility Checklist UI Design


A man is viewing his phone a table. On top of the image is a large logo indicating accessibility

Description:

This is a big passion project of mine. There are a lot of tools out there that test your site for speed, mobile-friendliness, or security… but there are not as many open source tools that test how well your site conforms to accessibility requirements. Furthermore, there seems to be an ideological divide in the industry between beautiful design and inclusive design - so one of my goals for this project was to build a beautiful interface to show that the two don’t have to be mutually exclusive.

View the Accessibility Checklist UI

Progress:

This project stems from an earlier project I worked on that was a simple checklist. I created a site that had all the current WCAG standards in a list/card format where designers could use it as an online checklist. But, to me, designing the tool in that way added to the paradigm of accessibility as “another thing designers have to worry about” and that is the last thing I wanted to communicate.

I thought instead it would be more helpful to build a tool that checks a user’s site automatically, and then gives them the resources to take the matter into their own hands. The methodology draws inspiration from the AXE plugin for Google Chrome, which is an extremely helpful tool for doing Accessibility audits.

This is a preview of the interface I am developing as I continue to make decisions about the stack I want to develop it on. I’ll be open sourcing it ASAP to get contributions, which will be exciting to see if a community of designers and developers can rally behind yet another new tool.