Accessible Design Delivers a Better Experience to Everyone

Why is Accessibility important in Design?

Accessibility in UX design is incredibly important because it helps deliver a much better experience to everyone, with no exceptions. This means that as a designer you need to be inclusive to the needs of all users, including those with visual, speech, auditory, or physical disabilities, so your product can serve as many people as possible.

The main advantage of successfully designing an accessible platform is making your app or website available to all, but there are many other benefits like Inclusion, brand reputation and ease of use.

‍

5 Tips to make your design more accessible:

1. More than colour:

Sufficient color contrast is essential if you want all your users to be able to interact with your digital products but don’t use color as the only visual means of conveying information. Use color to highlight or complement what is already visible but if you rely on color only to communicate crucial system information or alert messaging, people with visual impairment will have difficulty perceiving them as important.

To ensure accessibility for things like error or success messages or system warnings, make sure to incorporate messaging or iconography that clearly states what is happening. You can use tooltips, thick borders, bold text, underlines, italics, etc. The choices are infinite, but the only rule is to use more than color alone.

‍

2. Ensure accessible text & controls:

Make sure your text is large enough for people to read without straining or squinting. According to Smashing Magazine, 16-pixels (or larger) is the size you want your body copy. Secondary or tertiary text can be smaller, but keep your main content large and readable.

Controls are any UI elements that users can interact with, including links, buttons, and checkboxes. If the area for clicking/tapping controls is too small it will be difficult for users who cannot be precise with a pointer to activate them. Same stands for controls that are placed too close together. Even if you provide a label that could be clicked on instead, not all users know they can do so.

‍

3. Provide visual focus indication for keyboard focus:

Medium's Principal Designer, Jesse Hausler explains a problem which is that most websites do not create their own focus styles. These focus indicators, which are fundamental to the success of keyboard users, are largely absent on the web.

As a quick exercise to experience a website that doesn’t always provide visual focus, open a tab and visit the website for the company who makes your mobile phone. Press the Tab key repeatedly to navigate through the page. Do you see a visual focus indicator as you navigate? Maybe you see this for some links on the page but not all? Consider the effect this has on someone who only uses a keyboard to interact with the web.

If you’re on a Mac, you may need to enable Full Keyboard Access under System Preferences > Keyboard > Shortcuts. It’s at the bottom.

‍

4. Make images “readable”:

How do you make images on your website accessible to users who can’t see them and who use a screen reader to understand the content on your website? You need to tell them what the image represents or what information it conveys.

This is why you always need to use alt text for the images to describe the context so the screen reader can explain them. However, if the image is there for purely decorative reasons you can leave out alt text to avoid distracting the screen reader user from important content.

‍

5. Perform usability tests

You can leverage usability testing in the wireframing or prototyping phase to see how your target users (including those with disabilities) move through your website or app. You can also usability tests on existing products to identify any pain points and prioritize any changes that you need to make.

No matter if you’re optimizing your existing website or app design to be more accessible, or designing a new digital product from scratch, there’s a pretty good chance you’re going to miss something. There are many guidelines to follow and some may simply not be applicable to your digital product.

But, if there are some systematic accessibility issues, usability testing is the best way to uncover them. And the earlier in the design process you start, the better!

‍

Click below for the ultimate guide to web accessibility by Hubspot.