Accessibility acceptance criteria:
page and user-flow level

Test question:

Is the purpose of each page or step clearly communicated?

Simple steps to test:

• Use the form or complete the action.
• Check for visible success message.
• Use a screen reader to confirm it’s announced.

What determines pass:

The success message is visible on screen and announced by screen readers without extra user interaction.

Test question:

Is the structure and navigation simple and consistent?

Simple steps to test:

Use keyboard or a screen reader to navigate using headings or menu items.

What determines pass:

Structure follows a logical pattern and navigation feels intuitive without needing to backtrack.

Test question:

Are instructions, labels, and feedback easy to understand?

Simple steps to test:

1. Look at every form field and button.
2. Ask: is it obvious what to do and when?

What determines pass:

• Clear instructions are placed before interaction.
• Labels are short, consistent, and jargon-free.

Test question:

Can users recover easily from mistakes?

Simple steps to test:

Try submitting a form with missing or incorrect info (e.g., leave required fields blank).

What determines pass:

Errors are clearly described, focus moves to the problem area, and the user can try again.

Test question:

Are success messages clearly announced after key actions?

Simple steps to test:

1. Perform a key action (e.g. submit a form, save settings).
2. Check if a visible success message appears.
3. Use a screen reader (e.g. NVDA or VoiceOver) to repeat the test.

What determines pass:

• A visible message appears immediately after the action.
• The screen reader announces the message without needing to move focus manually.

Test question:

Are users warned about and given control over any time limits?

Simple steps to test:

1. Stay on a form or session-based page for several minutes without interacting.
2. Check for warning messages before timeout or session expiry.
3. Try to extend the session or adjust the time limit if possible.

What determines pass:

• A warning is shown before timeout.
• The user has a clear way to extend time (e.g. “Stay signed in” button).
• Alternatively, time limits are clearly explained and adjustable in settings.

Test question:

Does all content and interactive elements have sufficient colour contrast?

Simple steps to test:

1. Use a colour contrast analyser tool (e.g. WebAIM Contrast Checker).
2. Sample the foreground (text) and background colours.
3. Choose the font size and weight used.

What determines pass:

• Text smaller than 18pt (or 14pt bold) must have a contrast ratio of at least 4.5:1.
• Large text (18pt+ or 14pt bold+) must have at least 3:1 contrast.
• Interactive components (like buttons, links, icons) must also meet these thresholds.

Test question:

Is important information conveyed using more than just colour?

Simple steps to test:

1. Scan the page for use of colour to convey meaning (e.g. red = error, green = success, coloured charts, selected states).
2. Check whether the same meaning is conveyed in another way (e.g. icon, text label, pattern, underline).

What determines pass:

• No information is conveyed by colour alone.
• Alternative indicators are present (e.g. “Error” text, symbols, or visible label changes).

Test question:

Does all content remain available and usable when zoomed or magnified?

Simple steps to test:

1. In Chrome or Firefox, press Ctrl + + (Windows) or Cmd + + (Mac) to increase zoom up to 400%.
2. Scroll through the page.

What determines pass:

• All content is still visible, readable, and functional.
• No horizontal scrolling is needed except for large images, maps, or data tables.
• Nothing is cut off, overlapped, or missing.

Test question:

Does the page work across screen sizes and orientations?

Simple steps to test:

1. Resize the browser window to smaller widths (e.g. simulate a mobile view).
2. If on mobile, rotate between portrait and landscape.

What determines pass:

• Layout adjusts to fit all screen sizes and orientations.
• No overlapping, disappearing, or cut-off content.
• Key functions and navigation remain usable.

Test question:

Is the page usable in dark mode or high contrast settings?

Simple steps to test:

1. On your device, enable dark mode (system or browser setting).
2. On Windows, toggle high contrast mode (e.g. ALT + LEFT SHIFT + PRINT SCREEN).

What determines pass:

• Text and UI remain legible and usable.
• No low-contrast text or invisible elements.
• Focus indicators and highlights are still visible.

Test question:

Do important elements remain visible without horizontal scrolling or clipping when zoomed?

Simple steps to test:

1. Use browser zoom at 100% and 400%.
2. Check for horizontal scrolling or clipped text on standard and small screens.

What determines pass:

• No essential content or controls are hidden, clipped, or force horizontal scrolling.
• Page reflows properly and key actions (like “Submit”) are always reachable.

Test question:

Are headings used to create a clear and logical page outline?

Simple steps to test:

1. Open browser DevTools (Right click → Inspect → use Elements tab).
2. Look for <h1>, <h2>, <h3>, etc. or use a browser extension like HeadingsMap.

What determines pass:

• Headings are used in logical order (e.g. H1 > H2 > H3).
• They represent the page structure, not just visual formatting.
• Skipping levels (e.g. H2 to H4) is avoided.

Test question:

Can users skip over repetitive content (e.g. navigation, repeated banners)?

Simple steps to test:

1. Use the keyboard (TAB key) from the top of the page.
2. Check if a “Skip to main content” link appears.
3. Optionally, inspect the code for ARIA landmarks (like <main>, <nav>).

What determines pass:

• A visible skip link is available and works.
• Or ARIA landmarks allow screen reader users to jump to key areas.
• Navigation doesn’t trap keyboard focus.

Test question:

Can all actions be completed using keyboard only?

Simple steps to test:

1. Put your mouse aside.
2. Use TAB, SHIFT + TAB, ENTER, SPACE, and ARROW keys to navigate and activate all interactive elements.

What determines pass:

• All interactive features (menus, buttons, modals, forms, etc.) are fully usable with only the keyboard.
• Nothing requires a mouse or hover to activate.

Test question:

Is the focus order logical and consistent with user expectations?

Simple steps to test:

1. Press Tab repeatedly to move through the interface.
2. Observe the order in which elements receive focus.

What determines pass:

• Focus moves in a logical order (typically top to bottom, left to right).
• The sequence matches visual layout and expected workflow (e.g. input fields, action buttons).

Test question:

When focus needs to move, is it managed in a purposeful and helpful way?

Simple steps to test:

1. Perform common actions like opening modals, submitting forms, or triggering alerts.
2. Watch where focus moves.

What determines pass:

• After actions, focus moves to a logical new location, such as:
  • The first focusable element in a modal
  • A success message
  • A confirmation button
• Focus is not lost or sent back to the top of the page unexpectedly.

Test question:

Is the visible focus indicator always clearly shown?

Simple steps to test:

1. Use Tab to move through all focusable items.
2. Visually confirm the focus outline or style on each item.

What determines pass:

• A clearly visible outline or style appears on all focused elements.
• The indicator is not hidden or removed by CSS (e.g. outline: none).

Test question:

Are there any elements that trap keyboard focus or block navigation?

Simple steps to test:

1. Use only the keyboard to navigate interactive components (e.g. modals, dropdowns).
2. Try Tab and Shift + Tab to exit and re-enter.

What determines pass:

• Focus can enter and leave interactive areas as expected.
• Modals trap focus only while open, and allow escape with Esc or closing action.
• No elements “trap” you in an infinite loop or block forward/backward movement.

Test question:

Can users pause, stop, or adjust any moving or timed content?

Simple steps to test:

1. Look for carousels, auto-scrolling elements, or time-limited popups.
2. Check for visible controls to pause, stop, or adjust.

What determines pass:

• Controls are available and work as expected.
• Nothing moves or disappears too quickly without a way to adjust or pause it.

Test question:

Are all interactive elements operable by speaking their visible label?

Simple steps to test:

1. Observe the visible text of buttons, links, and controls.
2. Compare this to the accessible name (use browser dev tools or screen reader).

What determines pass:

• The visible label matches what a speech recognition tool would use (e.g. “Click ‘Submit’” works if the button says Submit).
• No hidden names that differ from the visible text.

Test question:

Do links and buttons have clear, unique labels to avoid ambiguity?

Simple steps to test:

1. Identify all interactive links and buttons.
2. Check that each has a clear, descriptive label.

What determines pass:

• No repeated or vague labels like “Click here” or “Learn more”.
• Each button or link explains its action (e.g. “Download PDF”, “View product details”).

Test question:

Are interactive elements properly labelled?

Simple steps to test:

1. Use a screen reader (like NVDA or VoiceOver) to navigate to all buttons, links, form fields, and controls.
2. Listen to what’s announced.

What determines pass:

• The role (e.g. “button”), name (e.g. “Submit”), and state (e.g. “checked”) are clear and match what’s shown visually.
• Elements aren’t announced as “unlabelled button” or “clickable item.”

Test question:

Are element states (e.g. expanded, selected) announced clearly?

Simple steps to test:

1. Navigate to expandable menus, tabs, checkboxes, or buttons using a screen reader.
2. Interact with them (e.g. expand/collapse, select/deselect).

What determines pass:

• Changes in state (e.g. “expanded”, “selected”, “checked”, “disabled”) are immediately and clearly announced by the screen reader.
• The user knows what has happened after interacting.

Test question:

Are headings and landmarks used to structure the page?

Simple steps to test:

1. Use a screen reader to open the Headings list and Landmarks list (e.g. NVDA: INS + F7).
2. Review what’s listed.

What determines pass:

• Headings are used logically (e.g. H1 for page title, H2s for major sections).
• Landmarks (e.g. main, nav, footer, banner) are present and used appropriately.
• Lists are not empty, missing, or cluttered with irrelevant content.

Test question:

Are important changes (e.g. errors, success messages) announced by screen readers?

Simple steps to test:

1. Trigger a change (e.g. submit a form, encounter an error, update a field).
2. Listen with a screen reader for any announcements.

What determines pass:

• The screen reader automatically announces new messages.
• The user doesn’t need to manually find the message.
• Use of ARIA live regions (e.g. aria-live="polite") is properly implemented.

Test question:

Is the language of the page and its content correctly defined?

Simple steps to test:

1. View the page’s HTML in dev tools and check the <html lang="...">> attribute.
2. For multilingual content, check that language changes are marked (e.g. <span lang="fr">Bonjour</span>).

What determines pass:

• The default page language is correctly set using the lang attribute.
• Any changes in language (e.g. foreign phrases) are correctly identified.
• Screen readers pronounce content using the correct voice or accent.

Test question:

Are accurate captions provided for audio and video?

Simple steps to test:

1. Play a video and turn captions on.
2. Watch the video and compare captions to what’s spoken.

What determines pass:

• Captions include all spoken content and identify who is speaking.
• Non-speech sounds (e.g. [music], [laughter], [door slams]) are also included.
• No major timing delays or transcription errors.

Test question:

Is a transcript available for all spoken content?

Simple steps to test:

1. Check if a downloadable or linked transcript is provided near the video or audio.
2. Open and review the content.

What determines pass:

• The transcript includes all spoken dialogue, speaker labels, and important non-verbal sounds.
• It’s available in plain text or accessible PDF/HTML format.

Test question:

Is audio description available for key visual information in videos?

Simple steps to test:

1. Watch the video without looking at the screen, or listen using a screen reader.
2. Ask: Can I understand everything important without visuals?

What determines pass:

• Visual-only content (like text on screen, gestures, visual cues) is described in an alternate version or audio track.
• If no visual info is essential, a note can state “no audio description needed.”

Test question:

Can users pause, stop, or adjust audio/video playback?

Simple steps to test:

1. Play any embedded media on the page.
2. Try to pause, stop, or adjust volume/playback speed.

What determines pass:

• Media has clear, accessible controls for pause/stop.
• Volume can be adjusted separately from the system.
• For auto-playing content, controls are visible and easy to use.