4 Learnings from making our website more accessible

* update 24/03/2022

Suppose you are organizing a conference,
but not everyone can access the webpage with the program,
or buy a ticket,
reach the venue, 
or participate in the workshops you organize.  

Suppose the topic of the conference is inclusion….   

In recent years, UXinsight as an organization has taken steps towards making our conferences more inclusive. For example, by:

• Aiming for diversity in conference speakers
• Adding captions to the talks
• Differentiating ticket prices for countries with different economic situations, people with lower income (e.g., students, people without a job)

We still have a long way to go to provide a truly inclusive experience. Preparing for our conference about inclusive UX research has been a journey for us. It has pushed us to learn more about inclusion and critically assess our efforts.

In the last months, we have focused on evaluating and making our website more accessible. We’d like to share with you what we’ve learned throughout this journey. While this is not a complete list, maybe it can inspire you to take the first step towards accessibility at your organization.

#1 Incorporate accessibility from the start

At UXinsight, we don’t have our own design and development resources. We worked with an external party to build our website and, back then, did not set any requirements for accessibility. The result is that accessibility was not prioritized, and our website has many accessibility issues. Even basic things like our corporate identity colors have insufficient contrast for people with low vision. Fixing all these issues now is more costly both from a financial and brand perspective.

Perhaps you work within a large organization with many design and development resources. Even then, it is much easier if every designer and developer takes accessibility requirements into account rather than have another team ‘fix’ this afterwards. However, first, you may need to convince your organization to invest in accessibility.

#2 Evaluate accessibility before running research with people with disabilities

As a UX researcher, your first instinct could be to organize usability tests with people with disabilities. While that is certainly an important step and a ‘true’ evaluation of accessibility, there are many things you can do to remove first major accessibility barriers.

With the help of accessibility evaluation tools and experts, we learned, for example, that many elements on our website had insufficient color contrast, which we know is bad for usability. Or, that some icons on our website didn’t have a label. All of these can be discovered and fixed prior to doing research.

Arrange an accessibility audit

We asked Accessibility.nl to run a quick scan to uncover accessibility issues. They evaluated our web experience against the Web Content Accessibility Guidelines (WCAG 2.1) and gave us recommendations for making our website more accessible. Expert Lotte Bijl evaluated, based on 4 principles, if our web experience is:

• Perceivable – Information and user interface components must be presentable to users in ways they can perceive.
• Operable – User interface components and navigation must be operable.
• Understandable – Information and the operation of user interface must be understandable.
• Robust – Content must be robust enough that it can be interpreted reliably by a wide variety of user agents, including assistive technologies.

Use accessibility evaluation tools

Such tools can help you identify accessibility errors automatically.

• We used free tools like WAVE to evaluate UXinsight conference page. Simply enter your web address and get the results. Check this introduction to WAVE to learn how to use it.

• Consider tools like WebAIM or Contrast Finder to assess if your color contrast meets the accessibility guidelines.
• UPDATE: check the free full website accessibility checker by Experte for checking all website pages in one go.

Navigate your website using keyboard & a screen reader

Not all users will be able to navigate your website with their eyes and using a mouse, some rely on assistive technology. While you should ultimately invest in doing usability testing with people using such technology, navigating the web using keyboard and a screen reader yourself can be a starting point.

• Start with the keyboard. Use the Tab key to go through your website. Can you navigate to all interactive elements? Does the flow follow a logical order?

• Try to use a screen reader. For Mac users, go to VoiceOver. For Windows users, launch Narrator (you can also press the Windows logo key + Ctrl + Enter buttons). Or, download for free NVDA – one the most commonly used screen readers. Do you understand the information on your site? Is it clear what the structure is, and what you are expected to do?

It may take some time before you become familiar using these tools. But once you do, it can also prepare you for doing research with people with disabilities (check out Fable for this). Most of them are expert users, so, it can help if you are familiar with how the software works and know what to expect.

#3 Raise accessibility concerns with 3rd parties

When organizing a UX research conference we use several third parties. Our website is built on WordPress, we use tools like Hopin to run our conference online, Zoom for workshops and Miro for interacting with attendees. As a small organization, we rely on these suppliers to provide a positive and accessible experience.

While we cannot directly influence their accessibility efforts, the least we can do is to report accessibility issues and ask for improvement. If enough of us do, the accessibility issues will move up on the priority ladder. Check companies’ accessibility statements, see if there’s a dedicated department for reporting issues, or otherwise send your request to customer support.

#4 Celebrate small steps

UXinsight is a small organization with a limited budget. Our website is designed and built by an external company, and we rely on many third parties. We have no in-house expertise when it comes to accessibility. Sometimes these limitations can be paralyzing. We found that it is important to break the work down and reflect on the positive steps you have already taken.

Some of the things we’ve done after the accessibility evaluations:

• Added accessibility requirements for the web design agency
• Reached out to Hopin about not being able to enter the platform without a keyboard. The issue was put on the backlog, and they assigned us an Accessibility Strategist.
• Re-evaluated our color palette and increased color contrast for different website elements
• Added or removed alternative text, when necessary
• Solved some accessibility errors when using assistive technology

While these changes are a good step forward, we need to keep ourselves accountable. We are committed to making our web experience more accessible in the future. See our Accessibility Statement.

And remember, everyone benefits from accessibility

“Wow, I can actually read this page without my glasses” – my friend replied when I asked them to take a look at our re-designed webpage. Your accessibility efforts, for example a stronger color contrast, may benefit not only those with low vision but also people without disabilities and those with temporary or situational limitations (e.g., sunlight shining on the screen). Accessibility improves user experience for all.

Photo by Dee @ Copper and Wild on Unsplash