Whether you’re a designer, product owner, or CTO, you should care about accessibility.
As society continues to move online, services and products need digital representation to compete.
But just like in the “real” world, products and services should be accessible. Your product needs to work for all potential users, especially those that are vision-impaired, hearing-impaired, or physically disabled. By now, most software should have good solutions for those needing accessibility.
Why is accessibility important?
Besides not being a jerk to disabled or impaired folks, the likelihood of web compliance becoming law is high, especially as the internet becomes more and more important to people’s livelihoods.
It can be challenging to figure out how to be accessible, but conducting an accessibility audit is the ideal place to start.
In this post, we’ll show you how to conduct an accessibility audit and provide recommendations to improve the user experience for all of your viewers.
What’s the Standard?
The gold standard in web accessibility is the Web Content Accessibility Guidelines (WCAG), and it’s here where we recommend starting your audit.
There is a lot of information contained on this website, and it can feel overwhelming at first, but the primary things you need to keep in mind are the Four Principles of Accessibility. These maintain that all the content on your website must be
1. Perceivable
2. Operable
3. Understandable
4. Robust
Also important to know is WCAG ratings. There is A, AA, and AAA 2.1, but the ultimate is WCAG 3.0. Getting a 3.0 is extremely difficult for most websites because it requires such stringent accessibility adaptations, often to the detriment of brand colors and creativity.
An example of a 3.0 accessible website is Craigslist. That’s because Craigslist completely prioritizes function over form. And hey, it works! If you’re creating a product where beauty doesn’t matter, go for 3.0 accessibility. If the design of your site does matter to you, you may have to relinquish some accessibility.
At DEPT®, we aim for WCAG AA 2.1 and we recommend most of our partners do the same.
So before you start your audit, ask the question, “How compliant do we actually need to be?” Once you have this answer, you can begin.
Accessibility Audit for Vision
When you evaluate your site for those who are vision impaired, you need to consider various levels of ability. Here are the top things to analyze.
Color Contrast
High color contrast on websites is important for people who are colorblind or vision-impaired. The easiest way to check your current website is to use a browser plugin to run a colorblind test. Here are some good ones. This can help you see if there are any areas where the contrast is not optimal. Once you identify those places, you can work to resolve them.
You can also use Web Aim Contrast Checker to quickly check the level of contrast that different areas of your website have and ensure that you are reaching the minimum. They also have many great resources on why color contrast is important and how to reach higher standards of readability.
Typefaces
Typefaces are another key part of visual accessibility, as certain typefaces are more perceivable than others. You want to ensure that none of your text is
– Too small
– Lacking in contrast
– Overly complicated
Generally speaking, the larger the text, the less contrast required.
Alternative Text
Alt-text for images across the site is important for the visually impaired because it helps screen readers reveal information about what the images contain. To know what images are missing alt text, you have two options.
For large-scale audits, use a crawling tool like Screaming Frog. It will export a document that lists each image and whether it has alt text.
If you’re auditing only a few pages, you can simply right-click an image, inspect the page and then look for an “alt=” attribute. You can also use “control+f” and search for “alt.”
Buttons
Buttons can often be needlessly confusing, so it’s important to indicate what each button does clearly.
There aren’t many tools for this. It’s best for a human to audit each page and ensure that the text before or after the button helps to direct the user.
Accessibility Audit for Hearing
For those who are hearing impaired, you will want to take stock of any sound, audio, or video that lives on your site. For each individual audio and video asset, make sure:
– There are closed captions or text transcriptions
– The audio is clear and uninterrupted by background noise
– Is there any distortion on any audio or video file?
Finally, check if there are any noises that provide auditory cues or affirmations for tasks (more common for apps). List each auditory element and whether they have another type of confirmation (most often visual).
Accessibility Audit for Touch
Touch is a huge part of accessibility and one that is often overlooked. This essentially means that your app or website must be navigational in multiple ways. In other words, at least two of the following
– Touchpads
– Touchscreens
– Mice
– Keyboards
Keyboard Only Navigation
The best way to audit against this is to try navigating through your website using only the keyboard. Ideally, you should be able to scroll using the arrows and jump between sections using the ‘tab’ key.
Check the five most common user flows. Are there are issues completing these? If so, make a note.
Next Steps
We always recommend completing your accessibility audit before you begin any remedies. That way, you can prioritize the most important elements to fix, understand the timeline and expenses, and get the necessary buy-in from stakeholders.
For what to do after you’ve conducted your accessibility audit, check out Devetry’s ADA website compliance tips. They’ll help as you think about redesigning your experience or interface.
Accessibility is an extremely important aspect that each web designer and company should keep in mind. If you need help redesigning your website for accessibility or want to conduct an accessibility audit, DEPT® can help. Reach out today to speak with one of our web UX/UI experts today!
More Insights?
View all Insights
Questions?
Lead product designer