Starting Your Accessibility Journey: A Developers Guide
Tags: a11y, webdev
Published: 2021-06-01 21:15:30


## Beginning the Accessibility Journey

When I got my first job as a web developer, it was working on a Fortune 50 company's main web content. I was absolutely thrilled! Web development was my passion and I wanted to make an impact immediately on the public facing content of their site. 

About a year into my career I was tasked with making a google maps integration that included custom pins, search functionality, and a list of the pins on the map below it. When it was completed, I sent it to QA (Quality Assurance) to have it tested. I received a list of over 150 accessibility issues. Yep, you read that correctly, 150 accessibility issues! 

My first thought was, what in the heck is accessibility?! My second thought was, how will I know how to even fix these issues?! It was a rush of different emotions that ran through me. I was overwhelmed and quite frankly a little peeved that this application, that I was quite proud of, had so many accessibility issues. 

However, little did I know, this would be the turning point in my career, and the beginning of my accessibility journey! I was offered to meet with a colleague of mine who was blind and on the accessibility team at my company. He walked me through what accessibility on the web was and some strategies to help me learn how to make accessible content. From that day on, my entire perspective on web development and accessibility had changed forever. 

## Strategies for Developers

Fast forward 5 years and now I am a Developer Consultant for an accessibility company, Deque Systems. I work with many different companies and development teams across the globe. The same question that I once asked, 'Where do you even start if I don't know accessibility?' is now being directed to me but with a twist. The question now is 'Where do you even start if I don't know accessibility, WITHOUT slowing down my day to day development?'.

Over my time both at my previous company and in my current role I have found different strategies in which developers can use to approach accessibility, without slowing down development time. These strategies can help ease developers or even development teams into accessibility so that eventually, day to day, accessibility will be part of your development process!

### Use Automation Daily

The one thing I will always suggest to developers is to use automation where possible. Normally I suggest the use of axe-core. Axe-core is an accessibility rules engine made by Deque Systems, that can catch up to [57.6% of issues by volume] (https://www.deque.com/blog/automated-testing-study-identifies-57-percent-of-digital-accessibility-issues/). For each issue it finds, it also includes free public help URL's that point to Deque University that will tell you what the issue is, why it matters, and how to fix it.

It comes in two different flavors, an extension and a multi-use API. 

The API's are extremely light weight and easy to use and can fit into any testing framework you are using: 

* [WebdriverJS] (https://github.com/dequelabs/axe-core-npm/tree/develop/packages/webdriverjs) 
* [WebdriverIO] (https://github.com/dequelabs/axe-core-npm/tree/develop/packages/webdriverio)
* [Puppeteeer] (https://github.com/dequelabs/axe-core-npm/tree/develop/packages/puppeteer)
* [Cypress] (https://github.com/component-driven/cypress-axe)
* [TestCafe] (https://github.com/helen-dikareva/axe-testcafe)
* [NightWatch] (https://github.com/ahmadnassri/node-nightwatch-accessibility)
* [Java] (https://github.com/dequelabs/axe-core-maven-html)

The extension can be used in Chrome, Firefox, and Edge. It has a great UI that can statically scan your page content in the same ways the API's do, however it requires a full rendered page within a browser to do it. 

### Test With Keyboard

As simple as this sounds, testing your web content with keyboard and no mouse is a large step to ensure your content is accessible for all. 

Most development teams now do not include keyboard testing as part of their acceptance testing. However, most teams have no idea where to start with it. WebAIM has a wonderful list of keyboard tests to use which also includes how each web element should behave by default with a keyboard! If you want to go above and beyond, you can keyboard test with a screen reader as well! 

[WebAIM: Keyboard Accessibility](https://webaim.org/techniques/keyboard/)

### 10 Minutes a Day

Web accessibility can be a lot to take in at first. Especially if it is your first time diving in to what it means to make accessible content. The main strategy given to development teams is to do week long bootcamps, or even taking a whole sprint to dive into online courses. This only adds to the stigma that accessibility is cumbersome and slows down development, and most of the content goes in one ear out the other. 

One piece of advice I have given to development teams is to take literally 10 minutes a day and read or take an online accessibility course. That's it, 10 minutes! Doing just that minimal amount of time a day helps retain information and also help build the knowledge base daily. This will change the approach of how you develop your web content I guarantee it!

Here are my top 3 courses/trainings to take online:

* [W3C Introduction to Web Accessibility] (https://www.w3.org/WAI/fundamentals/accessibility-intro/)
* [WebAIM: Intro to Accessibility] (https://webaim.org/intro/)
* [Deque University] (https://dequeuniversity.com/)


## In Summary

Learning how to make your content accessible doesn't have to slow down your day to day development process. It may seem like a large endeavor for developers, however,  using one of the three strategies above will help increase the accessibility knowledge and skills for yourself or development team!