Accessibility & UX: The key to designing for everyone, everywhere

Originally published Jan 2019, updated Jan 8 2024 for clear language and updated links

Accessibility & UX: The Key to Designing for Everyone, Everywhere

Design isn’t just about making something look good; it’s about making it work for everyone who uses it, no matter where they are or who they are. Sometimes, we think accessibility is only about helping people with disabilities, but it’s more about making sure everyone can easily access and use what we create. If UX is all about how users experience things, then making it accessible means more users can have a great time on your website. And that’s a win-win – a better digital experience for them and a positive connection with your brand.

The great thing is, there are rules we can follow to make sure our designs are accessible. And guess what? They’re not complicated. If we start thinking about these rules right from the beginning of the design process, they become easy to put into action. Take text, for instance. Some people might not see well and can’t read what’s on your website. But if we set up our text properly, they can use special software that reads it aloud for them.

Let’s talk about how users interact with the stuff on your site. What if important things are hidden in buttons or images? That’s a problem for someone who can’t see them. How will they know where to click or what’s there?

Designing with accessibility in mind means planning ahead. When you’re sketching out your ideas, think about how everyone will use your website. It’s easy to get caught up in the excitement of creating and forget about this crucial aspect. But if you keep it in mind and regularly check how your designs are working, you’ll ensure everyone can enjoy what you’ve made.

We’re all unique, with different ways of seeing, hearing, moving, and understanding things. When it comes to designing a website that everyone can use, there are various user needs to consider.

Language

Even if your website is in English, not everyone visiting it speaks English as their first language. When you translate your site, does everything still work well? If you’re using pre-built designs, make sure they’re ready for translation. For WordPress sites, there are plugins that can help with translations. Don’t forget to add language options so visitors can easily switch to their preferred language.

Visual

Some people might have trouble seeing or distinguishing colors. To help, make sure there’s enough contrast between text and background colors. Also, don’t rely solely on color changes to convey important information. Use symbols or text styles like bold or underline to highlight links or errors. And when you use images, write descriptions (alt text) for screen readers to read aloud.

Note about alt text:

There are two ways that you can present alternative text:

  1. Within the <img alt=”text“> attribute of the image element.
  2. Within context or surroundings of the image itself. 

This needs to be done even if the image is purely decorative or if it creates redundancy because the surrounding context already explains the content. Having an empty <img alt=”text“> attribute will make screen readers skip it. If you don’t write any alt text, some screen readers will read the file name to the individual. That’s the worst experience you can provide.

Motor/Mobility

Think about people who might have trouble using a mouse or have physical limitations. Ensure your website can be navigated using only a keyboard. Check that forms and interactive elements work well without requiring a mouse. Test your website’s navigation using only the Tab key on your keyboard.

Auditory

If your website has videos, adding captions is crucial for people who are deaf or hard of hearing. It’s also helpful for those browsing in noisy environments where sound might be a problem. There are also many users who prefer to speed up playback and read your captions.

Learning

Some people might find it hard to understand complex language. Make sure your content is clear and easy to grasp. While technical language might be necessary sometimes, simplifying your message can make it more accessible to a broader audience.

And don’t forget to consider a range of learning styles, such as with the auditory and video recommendations above.

Multitasking

Consider situations where users are multitasking or need quick access to information. Design your site to be user-friendly even in distracting or busy environments, like when someone is on their phone while handling other tasks.

Summary

As designers, we hold incredible influence in shaping inclusive experiences for everyone, irrespective of their abilities, circumstances, or surroundings. And here’s the beauty of it: creating accessibility in our work doesn’t just benefit a select few; it elevates the experience for all.

There’s a common misconception that ensuring website accessibility is a complex and costly endeavor. But that’s not necessarily true. Building an accessible product doesn’t mean adding extra bells and whistles. It’s about designing with inclusivity in mind from the start, which doesn’t necessarily demand more resources or effort.

Let’s face it: an accessible website isn’t just a win for people with disabilities; it’s a win for everyone. It boosts SEO, making your site more visible and attractive to search engines. Plus, it often results in faster load times, benefiting not only those with slower internet connections but also improving the overall browsing experience for everyone.

Creating an accessible website is not just a matter of compliance; it’s an opportunity to enhance usability, reach, and efficiency for every visitor. It’s not just a checkbox; it’s a game-changer that can make your website more welcoming, easier to navigate, and more efficient for everyone who stops by.

Design responsibly. Make the online world better, for everyone.

Geek out some more with some of our other Guides on web accessibility here. And if you’re ready to make the shift with your own website, get in touch with us today!

Scroll to Top

Grab our WordPress Workbook

Download your copy now.