Product
August 25, 2022
10 minutes

How We Make Websites More Accessible - Top Tips

Having your product or service be accessible by everyone within your intended market is a crucial piece in the puzzle of success. It’s the reason your local bank installed a wheelchair ramp, or why most shops feature wide, automatic doors. 

It’s why we consider things like large print signage, braille, accessible parking spaces, and multiple ways of contacting particular service providers. Because we want everyone to be able to enjoy what we have to offer, without excluding someone based on their particular circumstances or limitations. 

According to the Canadian Survey on Disability Reports released in November 2018, 22 per cent of the Canadian population 15 years and older reported having one or more disabilities in 2017. That’s around 6.2 million individuals. 

On the high street, retailers and services do what they can to make small changes to the way they operate, so that they can make a huge impact to the way someone with a disability interacts with their business. But as the digital evolution snowballs many businesses are falling short of inclusivity. 

A 2022 analysis by webaim concluded that “significant work remains to be done to make the web accessible to everyone”. With millions of users still struggling to use the web and interact with digital businesses, this article aims to outline the importance of web accessibility, how it could impact your business, and what steps you can take to improve things going forward.

Crowdlinker designers discussing web accessibility needs for a client

Why is it important?

Following the global impact of the Covid pandemic, many patrons and service users have been forced to substitute in-person dealings for web based interactions. Everything from shopping, banking, and even healthcare is now primarily conducted online. Now more than ever, web accessibility is a priority for every business and organization operating within the digital space. 

Why is it important?

The Accessible Canada Act, which was passed in 2019, outlines the goal to make Canada barrier-free by January 1, 2040. The Canadian legislation was implemented to help combat accessibility issues faced by web users with disabilities. It outlines that provincially regulated private-sector and not-for-profit organizations with more than 50 employees must ensure their sites are accessible for people with vision, hearing or other disabilities.

The new legislation contains some of the initial obligations that will apply to federally regulated employers to demonstrate compliance with The Accessible Canada Act. These include preparations for accessibility plans, feedback processes and progress reports.  

Additionally, organizations found to be in violation of the act could face hefty financial penalties.  [Accessible Canada Regulations Mean New Obligations for Federally Regulated Employers | Knowledge | Fasken]

For Ontarians specifically, under the Accessibility for Ontarians with Disabilities Act, or AODA (2005), organizations that aren’t AODA compliant can face large financial penalties up to and including a fine of CA$100,000 per day, with personnel in key leadership positions receiving fines of up to $50,000 per day.

[How to Protect Your Organization from Website Accessibility Litigation (natlawreview.com)]

As many users become increasingly frustrated with usability issues online, organizations found to be in breach of accessibility requirements are now enduring those repercussions. The updates to legislation, along with the way the digital evolution is now governing the ways in which service users interact with businesses, has seen a significant surge in accessibility lawsuits. Including huge companies such as Netflix, Nike, Amazon, and many more. But positive change for those with disabilities is on the horizon as the conversation about web accessibility gains increasing traction.

What is web accessibility?

Currently, the World Wide Web Consortium, or W3C, are responsible for laying out international web standards. These are referred to as the W3C Recommendations.

The Web Content Accessibility Guidelines (WCAG), are principles with the intent of creating  a single set of standards that will allow web content to be accessible by everyone, including those with disabilities. 

What is web accessibility?

These guidelines have multiple iterations, with the current standard for W3C being layed out in WCAG 2. However these guidelines are being developed further, as a draft for WCAG 3 is currently underway. This newest edition will apply to web content, apps, tools, publishing, and emerging technologies on the web, and is expected to set the W3C standard for web accessibility in the coming years once the draft is complete.

Currently, there are 4 principles of accessibility. These state that all online content must be:

  • Perceivable - Users must be able to perceive the information being presented in some way. That includes all information and user interface components, with perception not being limited by a users particular abilities. 
  • Operable - Users must be able to operate the interface. The interface cannot require specific interaction that isn’t possible by any and all users.
  • Understandable - Users must be able to understand the information as well as how to operate the user interface.
  • Robust - Content must be robust enough that it can be interpreted reliably by a wide variety of user agents, including assistive technologies, such as screen readers. As technologies and user agents evolve, the content should remain accessible. 

Under the W3C recommendations for web accessibility, each principle is given a set of guidelines to allow businesses to build more inclusive websites and satisfy these principles.

There is also a list of success criteria, graded A, AA, and AAA. With A being the lowest possible acceptable score for compliance, and AAA being the highest. All of these details can be found on W3Cs website in the link below:

[Web Content Accessibility Guidelines (WCAG) 2.1 (w3.org)

Web accessibility principles

Making positive changes

According to WebAIM: The WebAIM Million - The 2022 report on the accessibility of the top 1,000,000 home pages 96.5% of all errors detected fall into the six categories outlined in the graph below. This has been a consistent outcome for web accessibility issues for the last 4 years. 

96.5% of all errors detected fall into the six categories outlined in the graph below.

Let's look at how we can address some of these top issues, and what changes companies/organizations can make to their web pages to demonstrate better compliance with WCAG.

Text Colour - 

Colour contrast is a very important component of creating a more accessible web for all users. WCAG set out specific criteria for meeting colour contrast standards on their website.

Be mindful that changing the colour of a word or sentence in a body of text will make the text appear like a link. The user is likely to click on this and subsequently think that the link is broken.

For example: Blue text copy is generally always assumed to be a link.

Colour Contrast Success Criteria

How to avoid colour contrast: Text on colour background

How to avoid colour contrast: Text on colour background

How to avoid colour contrast: Text on an image background

How to avoid colour contrast: Text on an image background

Text alternatives

Adding alt text to images, icons, and graphics, as well as data represented on charts, diagrams and illustrations will allow people using screen readers to get a better understanding of what image is being used.

In every web builder or CMS, you will find a field to add alt text within your media library.

Your description should be clear, and informative.

Text alternative examples

Keyboard navigation & Web links - 

Those visiting your website should be able to navigate and access links using only their keyboard. The ‘tab’ key should allow users to skip between links, and the ‘enter’ key should allow users to access the link. 

Be mindful that your links permit keyboard access.

Links to nowhere -

Inaccessible links can be one of the most severe barriers to overall accessibility for your website.

Sometimes when developing drop down menus that feature links, keyboard users are unable to access the link that is responsible for opening the menu, rendering it useless. 

You could ditch the drop down menu altogether, or specify a real link destination that gives the same links listed in the menu.

Organize content with correct headings

Use text styles in the correct order and avoid skipping headings so that screen readers can track content accurately. 

This will prevent impaired users from feelings like they have missed content.

Accessible multimedia player

Consider captions or audio descriptions for those with hearing or visual impairments.

URL descriptions -

Use more descriptive wording to be clear about links and their destinations. Consider context, avoid ambiguity, and aim to place the most distinguishing information first.

Further help

There are a lot of free and paid tools available that can help you boost your websites accessibility status. 

You can visit the Web Accessibility Evaluation Tools List at W3.org, and filter results according to your requirements.

Additionally, you can evaluate accessibility through user testing. By gathering valuable feedback from customers using assistive technologies, or users with limitations, you can test your websites accessibility through real world clients. 

Keeping a log of any accessibility adjustments you make can help you to stay on top of changes, whilst allowing you to demonstrate your compliance should your company ever come under review. 

Lastly, when creating a new website or application, you should be sure that your design and development teams are familiar with accessibility guidelines. Any tools used for engineering your product should support accessibility, whilst all design decisions should be made with accessibility in mind. 

If you’re unsure, look for a partner or product studio you can trust, with a proven track record of developing accessible digital environments. 

Read more
Community posts

GET IN TOUCH
GET IN TOUCH

Want to learn more?

Let’s start collaborating on your most complex business problems, today.