Surf the Dream A discourse of links and articles from Justin Avery

Accessibility Dashboard – Pa11y Dashboard

Accessability-Dashboard-pa11y

Today I came across a wonderful article by Una Kravitz, a UI Engineer over at Digital Ocean, about how to set up an accessibility dashboard for your site/s in just 15 minutes.

Usually these kinds of articles say “it’s easy! All you need to do is after you set up NPM, Gulp, Grunt, Node, Ruby, Dash, NGINX, blah blah blah.” — but in this case it really was simple thanks for the Droplets that come prepackaged on Digital Ocean.

Within 20 minutes I had it running on a subdomain and had already added a few of my own sites plus a couple of ones from work (see below).

If you want to recreate this then go read Una’s article now.

Pa11y Dash is a way to check if a page is conforming to a particular WCAG set of guidelines. In the example images I’ve shown I have chosen WCAG2 AA compliance.

Things to note about Pa11y Dashboard

A few things to note on this tool is

This is certainly a great start for a dashboard but I feel as though there are a lot more wins that can be accomplished with it moving forwards. Making use of screenshots, allowing an array or URL’s for a particular domain for monitoring are just two potentially beneficial inclusions.

Times to use Pa11y Dashboard

There are some great uses for Pa11y to get going though. Some of them include

  1. Set it up in 20 minutes and amaze your boss, they’ll think you’re star for doing something so amazing and quick.
  2. Run it for the front end dev process. You’re often working on a series of templates that will then go into a CMS so make sure they’re shipshape before you drop them in.
  3. Great for a pitch! If you’re going to see potential clients then just add a couple of their pages on the tool and explain why it’s bad to have so many errors (because you know they will) and how you’re able to help them fix it in the future.

Wrap up

I really like it. A web app that feels uber fast and goes to show how quickly you can set up some existing free tools out there that people have created that can give you an advantage either in the workplace with your team, with your current clients or to help you pitch new clients.


Also published on Medium.

Surf the Dream is a blog that has been running since the mid 2000's when it started on BlogSpot. Over the years it's been rebranded as justinavery.me (now my resume) and JaveryDesign.com (which now redirects back to this site).

I offer consultation services through Simple Things, produce a range of educational pocket notebooks, write about the Universe and run a responsive design and a RWD Weekly Newsletter