How to Use This Checklist

This checklist covers the most impactful WCAG 2.1 AA requirements for Canadian websites. It's organized by category so you can work through it systematically. For each item, check whether your website currently meets the requirement. Items marked AODA are specifically required under Ontario's AODA legislation for organizations with 50+ employees.

1. Page Structure and Navigation

  • Skip link — A "Skip to main content" link is the first focusable element on every page AODA
  • Page title — Every page has a unique, descriptive <title> that identifies the page and site AODA
  • Heading hierarchy — Headings (h1—h6) are used in logical order; no heading levels are skipped
  • Single h1 — Each page has exactly one h1 that describes the page's main topic
  • Consistent navigation — Navigation appears in the same location and order across all pages AODA
  • Landmark regions — Page uses semantic HTML landmarks: <header>, <nav>, <main>, <footer>
  • Language declaration — The lang attribute on <html> correctly identifies the page language AODA
  • Breadcrumbs — Multi-level pages include breadcrumb navigation with aria-label="Breadcrumb"

2. Images and Media

  • Alt text for meaningful images — All images that convey information have descriptive alt text AODA
  • Empty alt for decorative images — Decorative images have alt="" so screen readers skip them
  • Icon labels — Icon-only buttons and links have accessible labels (aria-label or visually hidden text)
  • Video captions — All videos have accurate captions AODA
  • Audio transcripts — Audio-only content has a text transcript
  • No auto-play — Audio and video do not auto-play, or can be paused/stopped easily

3. Colour and Visual Design

  • Text contrast (normal) — Normal text has a contrast ratio of at least 4.5:1 against its background AODA
  • Text contrast (large) — Large text (18pt or 14pt bold) has a contrast ratio of at least 3:1
  • UI component contrast — Interactive elements (buttons, form borders) have at least 3:1 contrast against adjacent colours
  • Not colour alone — Information is not conveyed by colour alone (e.g., error states use text + colour)
  • Text resize — Text can be resized to 200% without loss of content or functionality
  • No flashing content — No content flashes more than 3 times per second

4. Keyboard and Focus

  • Keyboard accessible — All functionality is available via keyboard (Tab, Enter, Space, arrow keys) AODA
  • No keyboard trap — Keyboard focus is never trapped in a component (except intentional modal dialogs)
  • Focus visible — A visible focus indicator is shown on all interactive elements when focused AODA
  • Logical focus order — Tab order follows a logical reading sequence
  • Dropdown menus — Navigation dropdowns are keyboard-operable and close with Escape

5. Forms

  • Input labels — Every form input has a visible, associated <label> element AODA
  • Required fields — Required fields are clearly indicated (not just by colour)
  • Error identification — Errors are identified in text and describe what went wrong AODA
  • Error suggestions — Error messages suggest how to fix the problem where possible
  • No placeholder-only labels — Placeholder text is not used as the only label for inputs
  • Autocomplete — Common personal data fields use appropriate autocomplete attributes

6. Links and Buttons

  • Descriptive link text — Link text describes the destination or purpose (not "click here" or "read more") AODA
  • External link indicators — Links that open in a new tab/window warn users (via text or aria-label)
  • Button purpose — Buttons have descriptive text or aria-label that explains their action
  • Link vs button — Links navigate to pages; buttons perform actions. These are not interchangeable.

7. Mobile and Responsive

  • Responsive layout — Content reflows correctly at all screen sizes without horizontal scrolling
  • Touch target size — Interactive elements are at least 44–44 CSS pixels for touch targets
  • Viewport meta — The viewport meta tag does not disable user scaling (user-scalable=no is not used)
  • Orientation — Content is not restricted to a single orientation (portrait or landscape)

8. Canadian-Specific Considerations

  • Bilingual lang attribute — If bilingual, the lang attribute updates when language switches (e.g., lang="fr-CA")
  • Language switcher accessibility — Language toggle is keyboard-accessible and labelled in both languages
  • AODA compliance (Ontario) — If Ontario organization with 50+ employees, WCAG 2.0 AA compliance is legally required
  • Trust Centre reference — Privacy and accessibility policies are clearly linked and accessible
Need help with your accessibility review? This checklist covers the most common issues, but a thorough accessibility audit requires manual testing with assistive technologies. Contact us to discuss an accessibility review for your website.

How We Build Accessible Websites

Every website we build at MyWaypoint Digital includes the following accessibility foundations from day one:

Skip to main content link
Semantic HTML5 structure
ARIA labels on interactive elements
Keyboard-navigable navigation
Focus-visible styles
Sufficient colour contrast
Alt text on all meaningful images
Labelled form inputs
Correct lang attribute
Logical heading hierarchy
Descriptive link text
Mobile-responsive layout

Our showcase sites demonstrate these practices in action. See the Showcase for live examples, and visit our Trust Centre for our full accessibility commitment.