Interactive WCAG 2.2 Checklist

Level A AODA 1.1.1 Non-text Content

The test is not “is there an alt attribute” but “does it do the same job as the picture”. A chart described as “chart” tells a blind reader nothing. Describe the point the image makes, not the image.

Level A AODA 1.1.1 Non-text Content

An empty alt="" removes the image from the reading order. Leaving the attribute off entirely does not — the screen reader falls back to reading the file name aloud. Decorative SVG needs aria-hidden="true" as well.

Level A AODA 1.1.1 Non-text Content

A magnifying-glass icon is not “magnifying glass”, it is “Search”. Check the accessible name that is actually computed, not just the markup — an aria-label on the wrong element, or an aria-labelledby pointing at an id that does not exist, silently produces nothing.

Level A AODA 1.1.1 Non-text Content

A short alt cannot carry a bar chart. Put the figures in a nearby table, a visible caption or an expandable panel — a description nobody can open is not a description.

Level AA AODA 1.4.5 Images of Text

Text in an image cannot be resized, restyled, selected or translated, and it blurs when magnified. Logos and branding are exempt; posters, banners and quote graphics are not.

Level A AODA 2.1.1 Keyboard

Put the mouse down and Tab through the whole page. Menus, carousels, modals, drag-and-drop, custom dropdowns and anything built from a div with a click handler are where this fails.

Level A AODA 2.1.2 No Keyboard Trap

Embedded players, date pickers and third-party widgets are the usual culprits. A keyboard user who cannot escape a component cannot reach the rest of the page at all — this is one of the most severe failures on the list.

Level A 2.1.4 Character Key Shortcuts

If pressing “s” jumps to search, a speech-recognition user dictating a sentence triggers it by accident. Either let people switch it off, let them remap it, or make it active only while the control has focus.

Level A AODA 2.4.3 Focus Order

A tabindex above zero pulls an element out of sequence and is almost always a mistake. CSS that reorders content visually — flexbox order, grid placement — leaves the tab order behind where the markup is.

Level AA AODA 2.4.7 Focus Visible

Check that nobody has written outline: none without putting something visible back. Test it on every background colour you use — an indicator that disappears against a dark panel fails just as surely as one that was never there.

Level AA New in 2.2 2.4.11 Focus Not Obscured (Minimum)

Tab down a long page with a sticky header in place and watch what happens as focus scrolls under it. Test at 400% zoom too, where sticky bars take up far more of the screen. A focus indicator you cannot see is the same as no focus indicator.

Level A AODA 3.2.1 On Focus

Tabbing onto a select must not submit the form or navigate away. Someone using the keyboard has to be able to move through a page to read it without setting things off.

Level A AODA 1.3.1 Info and Relationships

Screen reader users navigate by jumping heading to heading; it is the single most used way of moving around a page. A styled div or p is invisible to that, no matter how much it looks like a heading.

Level A AODA 1.3.1 Info and Relationships

An h2 followed by an h4 tells a screen reader user that a level is missing and makes them wonder what they skipped. Pick the level by where the section sits in the structure, never by how big you want the text.

Level A AODA 1.3.1 Info and Relationships

The h1 should say what this page is, not what the company is. A site-wide logo marked up as the h1 on every page gives every page the same name.

Level AA AODA 2.4.6 Headings and Labels

“More”, “Section 2” and “Information” fail this. Someone skimming by heading alone should be able to tell whether the content underneath is the bit they want.

Level A AODA 1.3.1 Info and Relationships

An empty heading is announced as a heading with no text, which stops a reader dead. These usually creep in from a CMS or a page builder rather than from a person.

Level A AODA 1.3.1 Info and Relationships

If it looks like a list, a table, a quote or a form, it should be marked up as one. Turn the stylesheet off and read the page — whatever meaning disappears was being carried by CSS alone.

Level A AODA 1.3.2 Meaningful Sequence

CSS can move things anywhere on screen; the reading order and the tab order stay where the markup is. Anything positioned absolutely, floated, or reordered with flex or grid is worth checking against the source.

Level A AODA 1.3.3 Sensory Characteristics

“Click the round button on the right” means nothing to someone who cannot see the layout. Name the thing: “select Continue”. Adding the name costs nothing and helps everyone.

Level A AODA 1.3.1 Info and Relationships

Screen readers offer a landmark menu to jump straight to the main content. Use <main>, <nav>, <header> and <footer>; where there is more than one nav, give each a name so they can be told apart.

Level A AODA 1.3.1 Info and Relationships

A screen reader announces “list, 6 items” and lets the user move item by item. A run of paragraphs starting with a dash gives none of that. A dash-paragraph that should be a list is one of the few faults no automated tool can find.

Level A AODA 1.3.1 Info and Relationships

Without th, every cell is read as a bare value with no idea which column or row it belongs to. A table of figures read out with no column names is unusable, and this is very common in reports and financial pages.

Level A AODA 1.3.1 Info and Relationships

Someone jumping between tables needs to know which one they have landed in. A <caption> is announced with the table and is the most reliable way to do it.

Level A AODA 1.3.1 Info and Relationships

A layout table gets announced as a table, with row and column counts that mean nothing. If the table is only there for positioning, use CSS instead, or at minimum role="presentation".

Level A AODA 2.4.4 Link Purpose (In Context)

Screen reader users can pull up a list of every link on the page, out of context. A list of nine links all reading “Read more” is a list of nine identical choices. Name the destination in the link itself.

Level A AODA 1.4.1 Use of Color

Colour alone is not enough — underline them, or give them another visible difference. This is the single most common way sites fail 1.4.1, and it affects far more people than it looks like it should.

Level A 2.5.3 Label in Name

Someone using speech recognition says “click Send message”. If the button reads “Send message” but its aria-label says “Submit”, the command does not work. An aria-label that replaces the visible text instead of including it breaks voice control.

Level A AODA 2.4.4 Link Purpose (In Context)

An unexpected new window disorients screen reader and magnifier users, and Back stops working. Put it in the link text or the accessible name, with the file type and size for downloads.

Level AA AODA 2.4.5 Multiple Ways

A menu plus a search box, or a sitemap, or breadcrumbs — any two count. Pages reached only as a step in a process are exempt.

Level AA AODA 1.4.3 Contrast (Minimum)

Large means 18pt, or 14pt bold, and above. Watch text over photographs and gradients — automated tools return “cannot determine” there rather than a result, so someone has to measure the worst point by hand.

Level AA 1.4.11 Non-text Contrast

This covers the things you have to see to use: input borders, focus indicators, toggle states, icon buttons, and the parts of a chart that carry meaning. Pale grey form outlines on white are the classic failure.

Level A AODA 1.4.1 Use of Color

Red for errors and green for success need a word or an icon too. Check charts in particular: a legend that only distinguishes lines by colour excludes roughly one man in twelve.

Level AA 1.4.11 Non-text Contrast 2.4.7 Focus Visible

A default browser outline is often invisible on a dark or coloured background. Test it against every surface a control can sit on, not just the white ones.

Level AA AODA 1.4.4 Resize Text

Use the browser's own zoom and text-size settings. Fixed-height containers with hidden overflow are where text gets clipped, and it is usually a navigation bar or a card.

Level AA 1.4.12 Text Spacing

People with dyslexia often apply their own spacing. Fixed heights and overflow: hidden cause text to disappear. There are bookmarklets that apply the required values in one click.

Level AA 1.4.13 Content on Hover or Focus

A tooltip must not vanish when you move the pointer towards it, must go away with Escape, and must stay visible while it is being read. Magnifier users in particular cannot chase a tooltip that disappears.

Level A AODA 3.1.1 Language of Page

Not a conformance requirement at AA, but it is the thing that most affects whether people can actually use the page. Expand abbreviations on first use and prefer the shorter word.

Level AA 1.4.10 Reflow

Test at 1280px wide and 400% zoom, which is the same as a 320px window. Sideways scrolling is not just awkward — it pushes the focused control off screen, so a keyboard user can Tab to something they cannot see. Data tables and code blocks may scroll; the page must not.

Level AA 1.3.4 Orientation

Someone whose device is fixed to a wheelchair cannot turn it. Do not lock the orientation unless the task genuinely requires it, such as a piano keyboard.

Level AA New in 2.2 2.5.8 Target Size (Minimum)

Small close buttons, icon-only toolbars and adjacent pagination numbers are the usual failures. Inline links in a sentence are exempt, and so is a target that has an equivalent elsewhere on the page.

Level AA 1.4.10 Reflow

A single wide element — an image, a table, a long unbroken string — can push the whole page sideways. Check the narrowest width you support, not just the one the design was drawn at.

Level A AODA 3.3.2 Labels or Instructions 1.3.1 Info and Relationships

A <label for> matching the field's id, or a wrapping label. Placeholder text is not a label — it disappears the moment someone types, and it usually fails contrast. Radio and checkbox groups also need a group name, which is what <fieldset> and <legend> are for.

Level A AODA 3.3.2 Labels or Instructions

If a date must be typed a certain way or a password needs particular characters, say so up front. An asterisk with no key is not an explanation.

Level AA 1.3.5 Identify Input Purpose

autocomplete="email", "tel", "given-name" and the rest let browsers and assistive tools fill fields in, and let symbol-based tools show the right icon. It only applies to the person's own information.

Level A AODA 3.2.2 On Input

A select that navigates as soon as you change it is the classic failure — a keyboard user arrowing through the options is thrown off the page at the first one. Put a Go button next to it.

Level A New in 2.2 3.3.7 Redundant Entry

In a multi-step process, carry the answer forward or offer it for selection, rather than making someone remember and retype it. Exempt where re-entry is essential, such as confirming a new password.

Level AA New in 2.2 3.3.8 Accessible Authentication (Minimum)

A cognitive function test — a puzzle, a memory task, transcribing a code — must have an alternative. Allowing paste into the password field, and supporting password managers, is usually enough. Blocking paste is a direct failure.

Level AA AODA 3.3.4 Error Prevention (Legal, Financial, Data)

Orders, payments, bookings, applications and anything that deletes data. One of the three is enough: reversible, checked for errors with a chance to fix them, or a confirmation step.

Level A AODA 3.3.1 Error Identification

The message has to name which field is wrong and what is wrong with it. A red border alone tells a blind user nothing, and a colour-blind user may not see it either.

Level AA AODA 3.3.3 Error Suggestion

“Invalid input” is not a suggestion. “Enter the date as DD/MM/YYYY” is. Do not suggest anything that would give away security information.

Level A AODA 3.3.1 Error Identification

Use aria-describedby pointing at the message, and mark the field aria-invalid="true". A summary at the top of the form is helpful too, but it is not a substitute for the per-field link.

Level AA 4.1.3 Status Messages

“3 results found”, “Saved”, “Item added to basket”. Use role="status" or a live region — and put the region in the page from the start, because injecting the container and its text together often announces nothing.

Level A AODA 3.3.1 Error Identification

Send focus to the error summary or the first field at fault. Leaving focus on the submit button while an error appears far above it means a screen reader user may never learn the submission failed.

Level A AODA 4.1.2 Name, Role, Value

A div with a click handler has no role, no name and no state. Use the real element where one exists — button, input, select — because you get keyboard behaviour, focus and announcements for free.

Level A AODA 4.1.2 Name, Role, Value

aria-expanded on anything that opens and closes, aria-current for the page you are on. And it has to be kept up to date — a value set once at page load and never changed is worse than none.

Level A AODA 4.1.2 Name, Role, Value

Wrong ARIA is worse than no ARIA: role="button" on a link removes the link behaviour a screen reader would have announced. If you find yourself adding a role to recreate something HTML already has, use the HTML.

Level A AODA 4.1.2 Name, Role, Value 1.3.1 Info and Relationships

aria-hidden="true" on an element containing a focusable control creates a control that can be reached but not announced. Off-screen menus that are visually hidden but still in the tab order are the same problem in reverse.

Level A AODA 2.1.1 Keyboard

Tabs, menus, trees and grids have established arrow-key behaviour set out in the ARIA Authoring Practices. Inventing your own means every user has to learn your page specifically.

Level A AODA 2.4.1 Bypass Blocks

Usually a skip link that is hidden until it receives focus. Test it by pressing Tab as the very first action on the page — a skip link that never becomes visible, or that does not move focus when followed, does not count.

Level A AODA 2.4.2 Page Titled

It is the first thing announced and it is what shows in the browser tab and in search results. Put the unique part first: the page, then the site.

Level AA AODA 3.2.3 Consistent Navigation

Items can be added or removed, but the ones that stay should not move about. People who navigate by memory or by counting rely on it.

Level AA AODA 3.2.4 Consistent Identification

If a download icon says “Download” on one page it should not say “Save” on another. This applies to the accessible name, not just the visible text.

Level A New in 2.2 3.2.6 Consistent Help

Contact details, a help link, a chat launcher. You do not have to provide help — but if you do, it must not move around between pages.

Level A 2.5.1 Pointer Gestures

Pinch to zoom, two-finger swipe, tracing a shape. Someone using a head pointer or a single switch cannot do any of them. Provide buttons that do the same thing.

Level AA New in 2.2 2.5.7 Dragging Movements

Reorderable lists, sliders, drag-and-drop uploads, map panning. A pair of move-up and move-down buttons, or a tap-to-place alternative, satisfies it.

Level A 2.5.2 Pointer Cancellation

If something fires the instant a finger lands, a person with a tremor cannot slide off to cancel. Use the up event, which is what a plain click already does.

Level A 2.5.4 Motion Actuation

Shake to undo needs a button too, and the motion trigger should be switchable off. A device mounted to a chair cannot be shaken.

Level A AODA 2.2.1 Timing Adjustable

Session timeouts, booking holds, quizzes. Warn before it expires and let the person ask for more time. Exempt where the limit is essential, such as a live auction.

Level AA AODA 2.2.1 Timing Adjustable 3.3.4 Error Prevention (Legal, Financial, Data)

Someone using a screen reader or switch access may take several times longer to fill a form. Losing it all to a twenty-minute timeout is a hard stop, not an inconvenience.

Level A AODA 2.2.2 Pause, Stop, Hide

Carousels, news tickers, background video, animated adverts. This is about people who cannot read past movement, and about people for whom it triggers symptoms.

Level A AODA 2.2.2 Pause, Stop, Hide

A live feed that reorders itself under the reader moves the thing they were about to select. Give them a way to hold it still.

Level A AODA 2.3.1 Three Flashes or Below Threshold

This one can cause seizures. It applies to video content as much as to the interface, so check any footage you did not shoot yourself.

Level A AODA 2.3.1 Three Flashes or Below Threshold

Not a conformance requirement at AA, but honouring prefers-reduced-motion is cheap and it matters to people with vestibular disorders. Parallax and full-screen transitions are the worst offenders.

Level A AODA 1.4.2 Audio Control

Autoplaying sound competes with a screen reader's own voice, which makes the page unusable rather than merely annoying. Best answer is not to autoplay.

Level A AODA 1.2.2 Captions (Prerecorded)

Automatic captions are a starting point, not a finished job — they need correcting for names, terms and punctuation. Captions must also carry speaker changes and meaningful sound.

Level A AODA 1.2.1 Audio-only and Video-only (Prerecorded)

A podcast needs a transcript. A silent explainer video needs a description of what happens in it.

Level A 1.2.3 Audio Description or Media Alternative (Prerecorded) 1.2.5 Audio Description (Prerecorded)

If the narration says “as you can see here”, something is missing. A full text alternative satisfies the Level A version; Level AA requires the audio description itself. Note Ontario's AODA specifically exempts 1.2.5.

Level AA 1.2.4 Captions (Live)

Webinars, streamed meetings, live events. This is the other criterion AODA exempts — so it is required by WCAG 2.2 AA but not by Ontario's regulation.

Level A AODA 2.1.1 Keyboard 4.1.2 Name, Role, Value

Third-party players are a frequent source of keyboard traps. Tab into the player, operate every control, and Tab back out again.

Level A AODA 3.1.1 Language of Page

<html lang="en">, or fr, and so on. Without it a screen reader reads the page in whatever voice it happens to be set to — English read by a French voice is close to unintelligible.

Level AA AODA 3.1.2 Language of Parts

Wrap the passage and set lang on it so the pronunciation switches. Proper names and words that have entered everyday use are exempt. This matters a great deal on bilingual Canadian sites.

Level A AODA 1.3.2 Meaningful Sequence

Arabic, Hebrew and Urdu passages need dir="rtl" so they are ordered correctly rather than merely displayed in the right order by luck.