Accessibility Matters
Why designing for accessibility might be easier than you think.
When you think about Accessible Design, what is the first thing that comes to mind? It is very likely that the picture in your head is… let me guess, a government site? Or maybe even a product that looks stale and overly diluted? As designers, we pride ourselves in keeping empathy at the core of our work; however, depending on the company and the industry you are in, accessibility is not usually a topic that is broadly talked about.
The truth is, there are many misconceptions about Accessible Design and while I am not here to debunk them all, I am here to share with you how working towards a more accessible website or product can be easier than you think!
Why design for accessibility?
As of January of 2018, the World Health Organization estimated that over a billion people were living with some form of disability (source). This means that about 15% of the world’s population is affected by one or more types of disabilities including visual, motor, auditory, cognitive, to mention a few. People with disabilities constitute one of the largest minorities in the world, which made it vital for our design team at Classy to start talking about it and change the way we design.
At the core of our company, you will find that the whole reason we are here is to give all non-profits (and the heroes that run them) the best tools possible to thrive in the world of giving. When we decided to create our design system, we wanted to do so in a way that spoke to the causes that are so near and dear to us and the non-profits we work with. Our goal is to create a system that allows us to deliver experiences that can be used by people of all abilities.
“Our goal is to create a system that allows us to deliver experiences that can be used by people of all abilities.”
Accessibility can be overwhelming. Where do I start?
For full disclosure, we are by no means Accessible Design experts, but as we continue to dive deeper in our journey towards building an accessible product, we would like to share some of the things we are currently doing to start creating change within our product and company.
Here are a few things to keep in mind when getting started with accessibility design:
Know your resources 📖
One of the values we live by here at Classy is to always be learning. Lucky for us, when it comes to web accessibility, there is a lot to learn! There are several guidelines that offer requirements for multiple disability types, as well as several layers of compliance. Here are two resources you will want to take a look at right away:
- WCAG — The Web Content Accessibility Guidelines 2.1 (WCAG 2.1, for short), is one of the most comprehensive set of standards we have to date for building web accommodations for disabilities such as: blindness and low vision, deafness and hearing loss, limited movement, and cognitive impairment.
- ARIA — For Engineers, Accessible Rich Internet Applications (ARIA) provides a set specifications that supplement HTML, JavaScript and Ajax to translate functionality to Assistive Technologies, making web content and web application more accessible for users who rely on screen readers or who cannot use a mouse as a means of navigation. For Designers, ARIA can provide best practices on how hand-off assets like images and icons in a way that is optimized for screen readers.
Start with an audit 🕵🏻♀️
One of the first steps we took towards addressing accessibility was to audit our entire product and marketing site to get a better sense of the areas that needed attention. We documented every component from buttons, to form fields and everything in between. Hundreds of screenshots, lots of customer feedback and even more cups of coffee later we had a very good understanding of the areas we needed to pay attention to first. When conducting an audit, always remember to audit any components that might be different across different breakpoints of your experience, if you use different notification styles for mobile vs desktop, be sure to document those differences.
Identify quick wins with high impact ⚡
It is in the nature of each designer to want to solve the most complex problems first, but after taking a hard look at our product audit, one of the most obvious places for us to start was to address text contrast (which I will write about very soon!). Paying attention to things like text contrast ratios, designing focus states, using labels and other design elements rather than color to indicate intent, can help get you started with minimal effort.
Phone a friend 📞
Reach out to others in your company and ask if there is anyone with experience implementing accessible practices for web experiences, more likely than not, you will find someone who is experienced in one or more areas of accessibility. Finding partners from different disciplines can help ensure you are taking a holistic approach to accessibility. Another way to start thinking about accessibility is through different lenses. For example, you can think about accessibility through the lens of motion, where you can pay close attention to fast flashing animations, which can cause dizziness and in some cases, seizures. I have left some resources below for more references on other accessibility lenses.
“Finding partners from different disciplines can help ensure you are taking a holistic approach to accessibility.”
Design ♥️ Accessibility
In the world of design, empathy is a word that is often overused and underdelivered. We are proud of ourselves when we talk about empathy in our design process, but when the needs of 1 billion people with disabilities worldwide are neglected, the argument for empathy just falls flat. As designers, we have the important responsibility to start debunking the misconception of designing for accessibility being a highly complex and low in priority. Every time you talk about how you apply empathy in design, ask yourself: “Does my work truly reflect this? Am I really designing for everyone?” In order to create true change within our design community, we must start loving accessible practices as much as we love every other design principle. Web accessibility will not diminish your skills as a designer, it will not dilute your brand’s personality or make things boring, on the contrary, it will give your product or website a different level of maturity.
Start a movement 🚀
No matter if you are a designer, engineer, product manager or marketer, just like user experience, accessibility should be on everyone’s radar and it should be everyone’s responsibility, because the bottom line is, everyone contributes to the ultimate journey of a user. When teams and entire companies start to understand and embrace the importance of addressing the needs of EVERY user, implementing quick wins will get you hardly any pushback. Accessibility requires a company mind-shift, but it all starts by making everyone aware of it first! Start a movement within your team and then a movement within your company, educate others on your findings and empower everyone to become an advocate for accessibility.
Where do we go from here?
The road ahead for our design team is long, but we will continue to take steps towards delivering our promise of building a more accessible product. There are lots of exciting product updates coming up this year where we will be taking every opportunity to address a new area of accessibility.
Check back soon as we take deep dives into different aspects of our accessibility journey. In the meantime, check out some of the resources that are guiding us along the way and be sure to share with us how you are starting the conversation of accessibility at your company!
Resources
Guidelines
Tools
- Axe — Chrome extension to perform accessibility audits
- tota11y — Helps visualize how your site performs with assistive technologies
- Contrast — MacOS app to check for WCAG contrast ratios
- Stark — Sketch plugin with a build in color blindness simulator and a contrast ratio checker
- WebAIM Color Contrast Checker — Enter your link color, body text color and background color to get exact contrast ratios
Articles
- Elderly And Disabled Assistive Technology Market To Surpass $26 Billion By 2024
- Designing for accessibility is not that hard
- 7 Things Every Designer Needs to Know about Accessibility
- Designing For Accessibility And Inclusion
- Accessibility Medium Topic
Podcasts
Certifications
Sources
[1]: World Health Organization. (January 16 2018). Disability and Health
https://www.who.int/news-room/fact-sheets/detail/disability-and-health
