TheBomb®
TheBomb® Logo
Start Project
Insight
203k Views
510 Shares

Web Accessibility in Canada: WCAG Compliance Is No Longer Optional

Canadian businesses face growing accessibility requirements. Learn WCAG 2.2 compliance basics, legal risks, and practical fixes for your website.

Cody New
Cody New

TheBomb® Editorial

Abstract inclusive design visualization with connected accessibility icons glowing in purple

Your website might look stunning. It might load in under a second. It might rank on the first page of Google. But if a blind user can’t navigate it with a screen reader, or a person with limited mobility can’t tab through your forms — none of that matters. Web accessibility in Canada isn’t a nice-to-have anymore. It’s a legal requirement that’s tightening fast, and most Canadian businesses are nowhere close to compliant.

At TheBomb®, we’ve audited dozens of sites that looked great but were completely unusable for screen reader users. Buttons with no labels. Forms that trap keyboard focus. Colour contrast so low that anyone with mild vision impairment can’t read the text. These aren’t edge cases — they’re the norm across Canadian small business websites.


Canada has moved beyond voluntary guidelines. Three major pieces of legislation now govern how accessible your digital presence needs to be.

The Accessible Canada Act (ACA), passed in 2019, applies to all federally regulated organizations — banks, telecoms, transportation companies, and federal government agencies. It requires proactive identification and removal of barriers, including digital ones. The full text of the Accessible Canada Act makes clear that digital services fall squarely within its scope, and enforcement is ramping up through Accessibility Standards Canada.

Ontario’s Accessibility for Ontarians with Disabilities Act (AODA) has been in effect since 2005 and requires WCAG 2.0 Level AA compliance for all public-facing websites of organizations with 50+ employees. Fines can reach $100,000 per day for corporations that fail to comply. If you’re doing business in Ontario — even from another province — this applies to you.

British Columbia passed the Accessible British Columbia Act in 2021, establishing a framework for province-wide accessibility standards. While the specific digital standards are still being developed, the direction is unmistakable: BC will follow Ontario’s lead with enforceable web accessibility requirements. Businesses that wait for the final rules to drop will be scrambling to retrofit at the worst possible time.

The bottom line is simple. Whether you’re federally regulated, operating in Ontario, or based right here in BC — web accessibility compliance is coming for your business if it hasn’t already arrived.


What Is WCAG 2.2 and What Changed?

WCAG stands for the Web Content Accessibility Guidelines, published by the World Wide Web Consortium (W3C). These are the global benchmark that Canadian legislation references when it says “accessible.” WCAG 2.2, finalized in October 2023, is the current standard.

WCAG is organized into three conformance levels: A (minimum), AA (the standard most legislation targets), and AAA (the gold standard). Most Canadian legal requirements point to Level AA as the baseline.

WCAG 2.2 introduced nine new success criteria. The ones that matter most for Canadian businesses are:

  • Focus Not Obscured (2.4.11): When a user tabs to an interactive element, it can’t be completely hidden behind sticky headers, cookie banners, or chat widgets. We see this violation constantly — a fixed navigation bar covers the focused element and the user has no idea where they are on the page.
  • Dragging Movements (2.5.7): Any action that requires dragging must also have a simple pointer alternative. Think of those “drag to reorder” interfaces with no fallback — they’re now a compliance failure.
  • Target Size Minimum (2.5.8): Interactive targets must be at least 24x24 CSS pixels, with some exceptions. Tiny mobile buttons and cramped navigation links are the most common offenders.
  • Consistent Help (3.2.6): If your site provides help mechanisms (contact info, chat, FAQ), they must appear in the same relative location across pages.
  • Redundant Entry (3.3.7): Don’t force users to re-enter information they’ve already provided in the same session. Autofill support and persistent form data matter.

These aren’t abstract principles. They’re testable requirements with clear pass/fail criteria.


How Many Canadians Are Affected by Accessibility Barriers?

The numbers are hard to ignore. According to the 2017 Canadian Survey on Disability, 6.2 million Canadians — roughly 22% of the population aged 15 and older — have at least one disability. That figure has only grown since, with an aging population accelerating the trend.

Among those 6.2 million people, the most common disability types are pain-related (15%), flexibility (10%), mobility (10%), and mental health-related (7%). Visual disabilities affect roughly 5.4% of Canadians with disabilities, and hearing disabilities affect about 4.5%. Every one of these groups can be impacted by poor web design — whether it’s small text with insufficient contrast, videos without captions, or interfaces that demand precise mouse movements.

Here’s what that means commercially: one in five of your potential customers may be unable to use your website. That’s not a niche market segment. That’s a massive revenue gap. If your checkout flow breaks for screen reader users, you’re actively turning away paying customers. If your restaurant menu is an image-only PDF with no text alternative, wheelchair users with low vision can’t order from you.

The disability community in Canada has significant purchasing power — estimated at over $55 billion annually when you include the spending influence of friends and family. Accessible design isn’t charity. It’s smart business.


What Are the Most Common Web Accessibility Failures?

After running accessibility audits on hundreds of Canadian business websites, we see the same problems over and over. The WebAIM Million study — which tests the top one million home pages annually — confirms this pattern globally. In their 2024 analysis, 96.3% of home pages had detectable WCAG failures. The average page had 56.8 errors.

Here are the top offenders:

Low colour contrast is the single most common failure, appearing on 81% of pages tested. Grey text on a white background might look sleek to a designer, but it’s unreadable for millions of people. WCAG requires a minimum contrast ratio of 4.5:1 for normal text and 3:1 for large text. Many “modern” colour palettes fail this outright.

Missing alternative text on images affects 54.5% of pages. Every meaningful image needs descriptive alt text. Decorative images need an empty alt="" attribute so screen readers skip them. An image of your team with alt="IMG_4823.jpg" is worse than no alt text at all.

Empty links and buttons — interactive elements with no accessible name — appear on 48.6% of pages. That hamburger menu icon with no label? A screen reader announces it as “button” with zero context. The user has no idea what it does.

Missing form labels affect 45.9% of pages. When a form input has a placeholder but no associated <label> element, screen readers can’t tell the user what information to enter. Placeholder text disappears on focus, leaving sighted users with cognitive disabilities stranded too.

Keyboard navigation failures are harder to detect automatically but devastate usability. If a user can’t tab through your entire site — including menus, modals, and forms — without a mouse, your site fails WCAG. We’ve seen modal dialogs that trap focus with no escape, dropdown menus that only respond to hover, and carousels with no keyboard controls whatsoever.


How Do You Audit Your Website for Accessibility?

You don’t need to hire a consultant to get started — though a professional audit will catch things automated tools miss. Here’s a practical approach you can run through this afternoon.

Step 1: Run automated scans. Three free tools cover the basics. The WAVE browser extension from WebAIM gives you a visual overlay of errors directly on your page. Google Lighthouse (built into Chrome DevTools) includes an accessibility score with specific failure details. The axe DevTools extension from Deque provides the most thorough automated testing with clear remediation guidance.

Step 2: Test with your keyboard. Put your mouse away and try to navigate your entire site using only Tab, Shift+Tab, Enter, Escape, and arrow keys. Can you reach every link, button, and form field? Can you see where focus is at all times? Can you open and close menus and modals? Can you escape from every overlay? If the answer to any of these is no, you have a WCAG failure.

Step 3: Test with a screen reader. On Mac, turn on VoiceOver (Cmd+F5). On Windows, download NVDA for free. Navigate your site and listen. Do headings make sense in order? Do images have meaningful descriptions? Do form fields announce their purpose? This is the single most eye-opening test you can run — it reveals problems no automated tool catches.

Step 4: Check your colour contrast. Use the free WebAIM Contrast Checker to verify that every text/background combination meets the 4.5:1 ratio for normal text. Pay special attention to light grey text, white text on coloured backgrounds, and text over images.

Automated tools catch roughly 30-40% of accessibility issues. The rest require manual testing, which is why a professional accessibility audit still matters. But starting with these four steps will surface the most critical failures.


The SEO Benefits of Accessible Web Design

Here’s something many business owners don’t realize: accessible websites rank better. The overlap between accessibility best practices and SEO best practices is enormous — and it’s not a coincidence. Search engines and assistive technologies consume web content in remarkably similar ways.

Proper heading structure (a single H1, logical H2-H6 hierarchy) helps both screen readers and Google understand your content’s organization. Descriptive alt text on images gives Google image search context while making images accessible to blind users. Semantic HTML — using <nav>, <main>, <article>, <button> instead of generic <div> elements — provides machine-readable structure that benefits crawlers and assistive technology equally.

Transcripts and captions for video content give search engines indexable text while making media accessible to deaf and hard-of-hearing users. Fast load times — which WCAG 2.2 addresses through requirements like reduced motion and timeout extensions — also satisfy Core Web Vitals.

Clean, well-structured, semantic HTML with proper labelling and logical content hierarchy is the foundation of both great SEO and great accessibility. When we build sites at TheBomb®, we treat these as the same discipline — because they are.


Build Accessible from Day One — or Pay to Retrofit Later

The cost difference between building accessibility into a site from the start and retrofitting an existing site is staggering. Industry estimates put the cost of retroactive accessibility remediation at 3 to 10 times the cost of building it correctly the first time.

Why so expensive? Retrofitting means auditing every page, rewriting markup, restructuring navigation patterns, replacing inaccessible components, re-testing across screen readers and browsers, and often redesigning visual elements that can’t meet contrast requirements. For a 50-page business website, a full remediation project can easily run $15,000 to $50,000 depending on complexity.

Building accessible from the start? That adds roughly 10-15% to your initial web design and development budget. You’re choosing between a modest upfront investment and a painful, expensive overhaul later — often under legal pressure with a deadline.

At TheBomb®, we build every site with accessibility baked in from day one. Semantic HTML structure, proper ARIA labels where needed, keyboard-navigable components, sufficient colour contrast, and tested screen reader compatibility are standard — not add-ons. Our portfolio reflects this approach across every project we deliver.


Quick Accessibility Wins You Can Implement Today

You don’t need a full redesign to make meaningful improvements. Here are practical fixes you can ship this week:

  1. Add alt text to every image. Audit your media library and write descriptive alt text for every meaningful image. For decorative images, use alt="".
  2. Fix your colour contrast. Run your brand colours through the WebAIM Contrast Checker. If your body text doesn’t hit 4.5:1, darken it. This is often a one-line CSS change.
  3. Label every form field. Every <input> needs a visible, associated <label>. Don’t rely on placeholder text alone.
  4. Add skip navigation. A “Skip to main content” link at the top of every page lets keyboard users bypass repetitive navigation. It’s a few lines of HTML and CSS.
  5. Ensure visible focus styles. If you’ve set outline: none on interactive elements without a replacement focus indicator, remove that CSS immediately. Users need to see where keyboard focus is.
  6. Add captions to videos. Every video on your site needs accurate captions. YouTube’s auto-generated captions are a starting point but require editing for accuracy.
  7. Test your forms with Tab. Tab through every form on your site. If focus order is illogical or fields are unreachable, fix the HTML source order.

These seven changes won’t make your site fully WCAG 2.2 AA compliant on their own — but they’ll eliminate the most common and most impactful barriers your users face right now.


Ready to Make Your Website Accessible?

Accessibility isn’t just about compliance — though the legal risk is real and growing. It’s about building a website that works for every Canadian who visits it. One in five of your potential customers has a disability. Your site should serve them as well as it serves everyone else.

Whether you need a full accessibility audit of your existing site, a ground-up accessible web build, or a design refresh that meets WCAG 2.2 AA standards — we can help. TheBomb® builds fast, beautiful, accessible websites for Canadian businesses that take their digital presence seriously.

Get in touch and let’s make your site work for everyone.


Key Takeaways

  • Canadian accessibility legislation is enforceable now. The Accessible Canada Act, AODA, and BC’s Accessible British Columbia Act mean web accessibility compliance is a legal obligation — not a suggestion — for a growing number of businesses.
  • 22% of Canadians have a disability. Inaccessible websites exclude one in five potential customers and leave significant revenue on the table.
  • Accessibility and SEO are the same discipline. Semantic HTML, proper headings, alt text, and clean structure benefit search rankings and assistive technology users equally.
  • Building accessible from day one costs 3-10x less than retrofitting. The smartest investment is getting it right the first time with a development team that treats accessibility as standard practice.

Reading Time

12 Minutes

Category

Development