Web Accessibility / A11Y

After completing a full-stack development Bootcamp I knew that user interfaces are where all the fun is to me! I truly love the mix of design and logic. In order to learn more about JavaScript I participated in a [30 Day JavaScript Challenge](https://love.devchat.tv/you-dont-know-js-yet-challenge40653095) last year. It was like a book club and included regular Q&A meetings with the author of the "You don't know JS" book series Kyle Simpson. Each week all the participants hopped on a Zoom call and had the chance to get some clarification to our questions. At the first meeting, we had a short introduction round to get to know each other. We all had pretty similar intentions as to why we joined. A bunch of juniorish dudes trying to make JavaScript a bit less blurry. However, one participant had a very special story that impressed me a lot. He shared his bad experiences with us. He went into the great detail about how frustrating it is to be excluded from using a product, getting the information from a website or making a purchase. He suffered vision loss a few years ago and has relied on assistive technology to browsing the web ever since. He had a crystal clear goal to become a frontend developer and remove the hurdles he has been facing.

This encounter got me thinking about web accessibility. Just the idea that somebody would not be able to use a site or app that I built really bumps me out. I started to do my research and came to the conclusion that a lot of sites that exist today have mayor accessibility issues that prevent some people from using it. Learning web development is pretty challenging with all the different computer sience concepts, frameworks and things like that. But accessibility is a lot easier from a technical standpoint. I think it is just the education and awareness that is lacking. I'm still learning and trying to follow good practices so this little blog post is like a reminder or for me and I'm more then happy if anyone else benefits from it, too.

What is Web Accessibility?

Web accessibility is the idea that the web must be equally accessible for people with and without disabilities. Depending on the kind of disability people use different types of assistive technology. This can result in various sorts of barriers which need to be removed.

Disabilities and Assistive Technology

Who are we targeting when we make our applications accessible? The range of disabilities is pretty wide and there are four general categories of disabilities: Visual-, Auditory-, Motor- and Cognitive Disabilities. Fortunately smart people have figured out ways to navigate the web for each of these categories. This diversity in browsing the web is a beautiful thing and should be supported.

Visual Disabilities

Someone with an visual disability has vision problems. It can reach from color blindness over low vision to blindness. There are very well developed screen readers that help these users to navigate through a website. People who rely on screen readers are keyboard-only users as they cannot see where the mouse is pointing. The screen reader will tell the user where he/she is on the page and reads out the content.

Motor Disabilities

There are many different types of motor disabilities: Paralyzed limbs, decreased muscle control, progressive degeneration of the muscles, Multiple Sclerosis (MS), Arthritis and Parkinson's disease are some of them. Users that suffer from these types of disabilities may not be able to use the mouse and therefore have to use other technologies and devices like mouth sticks, head wands, voice recognition, etc.

Auditory Disabilities

Users with hearing impairment are hard-of-hearing or deaf and therefore use captions and transcripts to consume multimedia content. It's important to provide these captions and transcripts for an inclusive experience.

Cognitive Disabilities

Cognitive disability describes the persistant state of intellectual limitations. People with profound cognitive disabilities often have greater difficulty learning and performing basic daily tasks.

Why we should care

There are many reasons for why we should make the web accessible. It's not only users with disabilities but everyone benefits from accessible websites because they are more usable. So also your regular users have a better experience. As a company with a website that has accessibility issues, you are excluding potential customers from buying your product. Expressed in numbers this corresponds to like 15% of the world's population. Another really important point is that the web by its very nature is already accessible. So it's us as developers - we're kind of the problem here and it's good to realize that we're the ones who put the extra work to make it inaccessible.

Principles of Web Accessibility

There is a standard for Web Accessibility provided by the Web Content Accessibility Guidelines (WCAG) which is part of the W3C. That's the entire spec where one can find the requirements and different criteria for good accessible websites. The WCAG provides three conformance levels: A (lowest), AA (mid-range), and AAA (highest). Each of the levels gets progressively harder to meet. The lowest level (A) ensures very basic accessibility and means that you are not actively excluding most disabled people. In order to achieve level A, your website needs to pass 25 criteria. To meet level AA criteria your app or website needs to pass all of the level A criteria and then 13 criteria of the level AA in addition. Level AAA adds a further 23 criteria bringing it to a grand total of 61 criteria. Like with other specs the WCAG is very wordy and sometimes can be not so easy to parse. Luckily there is this organization called WebAIM. It's a community that exists since 1999 with the goal to help make the web more accessible. They provide a really nice and user-friendly checklist with their recommendation.

Conclusion

Accessibility is a very important topic. If you are working in tech then you have a part to play in removing barriers. You might have a great product that solves a certain problem very well. But it's all for nothing if people can't actually use it. We have to pay attention to the WCAG and to be honest I don't think it requires that much empathy to put yourself in the shoes of a person with a disability to test the feature you are implementing. For many people, the web is an essential part of daily life and we should be aware of the impact that we could have.