How to make a website accessible with the right design and content

 
Clarity Web Design Studio founder Steph Sedgwick sitting outside at a table with her laptop.
 

As a marketer, there’s a good chance you’ll be leading at least part of your company’s next website redesign. This is especially true if your team is small. And whether you’re solely responsible for content or you’re heading up the entire project, you need to know how to make a website accessible. Without a focus on accessibility, you could be shutting the digital door on a quarter of your site’s visitors.

In the U.S., 28% of adults identify as having some type of disability. In Canada, the number is similar for people over 15 years of age, at 27%. Yet, companies often don’t design their websites with these figures in mind. Steph Sedgwick is working to change that.

Steph is the founder of Clarity Web Design Studio, a company dedicated to promoting inclusivity in the digital world. Founded in 2015 as Bright Webs Design, this female-led agency is driven by a commitment to balance functionality with aesthetics. Today, Sedgwick and her team lead the charge in revolutionizing web design, advocating for accessibility and diversity while empowering the clients they serve to succeed online.

In this piece on how to make a website accessible, Steph shares her insights on creating a better internet for everyone, including:

  • Defining accessibility online

  • The impact of accessible websites and content

  • 3 best practices for how to make a website accessible

  • Simple changes you can make to improve accessibility

  • Trends and technologies shaping accessibility online

  • Advice for marketers to advocate for accessibility internally

Defining accessibility online

What makes a website accessible? To answer this, we need to understand the barriers preventing accessibility – of which there are so many that summarizing all of them is a challenge. 

The international Web Content Accessibility Guidelines (WCAG) focus on users with disabilities, covering conditions like blindness or low vision, deafness or hearing impairments, mobility issues, speech disabilities, learning disabilities and cognitive differences. 

However, a critical aspect of accessibility is recognizing that many disabilities are invisible. Most of us can't truly understand the daily experiences of people with disabilities unless we have a loved one who faces these challenges, or we face a challenge like this ourselves. 

With web accessibility, Steph thinks of it in the most literal of interpretations: whether someone can literally access the content of a website. This includes both visible and invisible diverse abilities. 

Access is best represented by the four principles of WCAG:

  • Perceivable

  • Operable

  • Understandable

  • Robust 

“Essentially, these guidelines mean that in order to interact with a website, a user needs to be able to find it, operate it, understand it and it needs to work easily with different browsers and devices,” Steph says.

 
Man in light brown suit sitting in front of laptop.
 

The impact of accessible web design and content

When a website isn’t accessible to all users, this can present barriers to access that are absolute – i.e., barriers that prevent someone from using your website at all.

Steph says that absolute barriers are unbelievably common. For example, if a non-visual person tries to visit a website and faces a popup they can't see, which their assistive device can't interpret or dismiss, that website has thrown up a full barrier. The visitor often can’t proceed at all. 

Or, a person might try to visit a website and be overwhelmed or confused by flashy or moving content and auto-playing videos, causing them to leave the site due to the cognitive overload. Sometimes, even completing a purchase on an online store can be impossible if the checkout process isn’t logical or it relies on purely visual cues. 

These barriers can arise from seemingly small design choices. For example, Steph says she used to enjoy using the parallax effect, where the background image stays static while the foreground content moves as you scroll. 

“I used this effect deliberately because I thought it was cool, but it can cause disorientation and cybersickness similar to vertigo,” she says.

In another case, Apple encountered this problem over a decade ago when they introduced a parallax effect on an iPhone lock screen, which made many users extremely uncomfortable. That's not the impression you want to leave with your audience when they're browsing your website. Now, Steph is extremely careful with any projects in which clients want to use effects that can have unintended consequences.

Accessibility is a universal issue that matters in every context. But in the context of B2B, the math alone speaks volumes. Recall that more than 1 out of every 4 Americans and Canadians identifies as having a disability. This means that when you’re marketing and selling to teams, it’s even more likely that accessibility is going to have a direct impact on your ability to communicate with your target audience.

Focusing on user experience 

While it’s critical to avoid any absolute barriers to access on your website, you also need to think about user experience and preferences.

Barriers can sometimes be a series of small things that result in a poor user experience overall. In reality, everyone has unique needs and preferences that go far beyond the presentation of a disability, Steph says. 

Some of us prefer to not use a mouse and we rely on a keyboard. Some of us navigate with our browsers zoomed in to 200% or higher. Some of us do everything with our device in dark mode, and some websites don’t adjust the display properly so that we can still read the content in that mode. 

“And don’t get me started on Recaptcha verification codes you can’t get through, or websites that take too long to load,” Steph adds.

Improving search rankings

Clarity Web Design tracks clients’ website statistics both before and after the company does a website rejuvenation or rebuild. Because making a website accessible means clean, logical code as well as organized content, the team sees clear improvements in organic search results for their clients.

“One of my favourite stories is of a small business in a niche market for art appraisals,” Steph says. “Before we rebuilt her website, her organic search results were 2 per month. After our relaunch, those same results were averaging 17 per month. They’re still small numbers, but in fact it’s a 1,600% increase.”

 
A person's hand sketching out a website wireframe on a whiteboard.
 

3 best practices for how to make a website accessible

Learn about accessibility

The bottom line is to learn about website accessibility, Steph says. This is because there’s no better way to understand the impact of accessibility, and how to improve it on your website, than by witnessing it yourself.

It’s difficult to duplicate the experience of every potential individual with diverse abilities, particularly since like any other group of users, people with disabilities have a range of experience and technical knowledge. However, there are a few ways you can educate yourself.

One of the best ways to run a website accessibility test is to try navigating it with only your keyboard. Using the tab and enter keys, try exploring your website on your browser.  Ideally, you’ll: 

a) be able to move around on the site without the mouse and 

b) not lose track of where you are on the page. 

If you have a contact or sign-up form on your homepage, see if you can fill it out and submit it just using your keyboard.

Design for diverse contexts

At its core, accessibility is about your user’s context and subcontext. You will have no idea what your customers’ backstories or struggles are when they land on your website. So, make it as easy as possible for them to find what they’re looking for. 

Don’t bury information behind confusing visual clutter, long-winded and jargon-filled discourse, or broken links. And don’t design your site to suit your own preferences only.

Test frequently

At the most basic level, run website accessibility tests frequently and use a variety of browsers and devices. Test your website in dark mode, test it with high zoom (200% or higher) and make sure all of your content still makes sense. 

Better yet, run simulation tests with website accessibility tools like screen reader software to find the traps and confusing areas on your website. Never assume that everything is okay just because it looks “right” on your desktop monitor.

Simple changes to improve your site’s accessibility

Let’s say you’ve run Steph’s keyboard test or used the website accessibility checker Equalize Digital to evaluate your website, and you learn that there’s room for improvement. What’s next? Here are a few tips from Steph on how to improve your accessibility.

  • Visual contrast: Check the visual contrast of your text against the background colour of your website, and make sure that it meets criteria. There are a variety of website accessibility tools you can use to check your colour palette, including the Contrast Checker from WebAIM.

  • Default language: Some websites don’t have their default language set, which makes it difficult for translation software to work. So, make sure your website language is set to English, or whatever your primary language is. 

  • Responsive design: If nothing else, make sure your website is responsive. That means that the design and layout will change to fit the size of the screen. It will work just as well on a laptop as it does on a mobile. Although responsive web design has been the norm for almost 10 years, Steph still sees new websites that are not fully responsive.

  • Automatically playing media: Turn this off or remove it. That includes background videos, animated GIFs and audio files. Don’t force your users to watch or listen to content that they can’t control, or that causes overwhelm or distraction for them. If you want to have videos on your website, move them to a dedicated area like a video library or your About page, and make sure there are player controls included so your user can choose when and where to watch. 

Search engine optimization (SEO) and accessibility

Optimizing your content for search engines can also help improve website accessibility. After all, web accessibility means your content is organized, displayed, and coded in a logical and consistent way. 

“Guess who else likes logic and consistency? Search engines!,” Steph says. 

If your website is designed for accessibility, it will be easier for everyone to understand, and that includes search engines and assistive technology like screen readers. Even better, making your site accessible makes it easier for everyone to use, which makes for a better user experience –  one of the top factors search engines consider.

 
Woman with red hair sitting at a desktop computer.
 

The future of accessible websites

We’ve covered how to make a website accessible and why it’s so important. Now, let’s look to the future.

Steph expects that website accessibility will become a more regulated field as more governments implement legislation to protect the rights of disabled users. For example, in the U.S., organizations that do not offer accessible websites are subject to legislation and can find themselves in court or settlements to avoid it. 

“I don’t know that Canada will go that route, but in my own province of Nova Scotia, the Accessibility Act aims to make Nova Scotia inclusive and barrier-free by 2030,” Steph says. “Most of Canada will follow suit if they haven’t already, and I think by 2030, digital spaces will be equally important as physical spaces for accessibility.”  

Search engines will also continue to push for accessibility, Steph says. The fact is that over the last 10 years, search engines have placed more and more emphasis on user experience. 

“I think this fortunately echoes the trend that many of us feel as consumers – craving a more genuine and authentic relationship with others. As more women enter the world of entrepreneurship, I think the focus will shift naturally to greater inclusion, which has to incorporate web accessibility.

AI and voice search are also worth paying attention to, having had some of the biggest impacts on website owners in the last five years. As AI continues to evolve, the importance of a website being accessible – literally so that the algorithm can understand your website – will be crucial.

Implementing and advocating for accessibility

If you’re just beginning to focus on accessibility, Steph’s biggest piece of advice is to practice empathy. None of us can know what our user’s context is, so we have to remove some of our natural assumptions. 

“It’s like a muscle, and with practice you not only get better at it, but it also comes more easily. If nothing else, understand that you have no genuine control over how your user interacts with your online content – meaning that what you think it looks like or how you think it engages, is probably not what they see or think,” she says.

Also know that accessibility is an ongoing strategy. Technology constantly evolves, and new content, like blog posts or podcast episodes, must be regularly evaluated to ensure that content meets guidelines. Additionally, you need to assess this content for relevance and performance to keep your website effective and accessible.

If you want to advocate for accessibility within your B2B company, Steph has some advice for you as well.

“The internet right now is like the Wild West and it’s literally full of garbage,” she says. “In studies of over 1 million websites, only 3% of the tested sites are considered to be accessible or accessible-friendly.”

And as we know, more than a quarter of Americans and Canadians identify as having a disability.

“Chances are really good that in your or your coworkers’ families, there’s at least one person with some type of disability. And we all will develop disabilities as we age. Showing your commitment to an equal experience for everyone is one of the best ways to prompt accessibility. Therefore, if you want to stand out from all that other online noise, making your site accessible is a fantastic option,” Steph says.

Resources and tools

Final words from our guest expert

Steph has a message for all marketers: the days of publishing whatever we want online need to end. 

“We can’t just sit back and wait for someone else to improve the space we inhabit. We have some agency over our own small physical spaces and relationships, but if we have a website, we have agency over that digital space as well. It's our responsibility to make a safe and accessible space,” she says.

The internet was initially envisioned to be the great equalizer, Steph adds. Instead, it’s anything but. As major search engines like Google prioritize good user experience, incorporating digital accessibility from the start will become the norm and eventually even the expectation. 

“I think the industry is perfectly positioned to experience a massive shift,” she says. “Website owners who prioritize empathy and inclusivity will be the first to benefit from this shift.”

Enjoyed these insights? Join our email list for more, where you’ll hear from us once or twice a month, maximum (we know your inbox space is precious).

Afton Brazzoni

Afton Brazzoni is the founder of Scribe National, a content marketing strategy and writing studio that partners with B2B companies to help them build trust and drive growth through content. Afton's firm has had the pleasure of working with more than 80 clients in the past 5 years — the majority being repeat customers — including tech unicorns like Pipe, Retool and Wealthsimple, and others among Canada’s 50 fastest growing companies like TouchBistro. Storytelling isn’t just Afton's day job — it’s a craft she's been honing professionally for 15 years. As a former news reporter, Afton has built Scribe National with a journalistic approach that delivers original, expert-level, content for meaningful results.

Previous
Previous

Which type of marketing contractor should you hire?

Next
Next

Make your case for these 8 benefits of content marketing