Specialised · Beyond Manual Testing

Accessibility Testing

One in four New Zealanders has a disability. Accessibility testing ensures your software works for everyone — and keeps you on the right side of the law.

Specialised WCAG 2.1 AA — NZ Human Rights Act ~15 min read

1 The Hook

Sarah is a chartered accountant in Wellington. She has been blind since birth and uses a screen reader (NVDA) to do her job. Last month, her firm switched to a new cloud-based tax filing system. On her first attempt, she got stuck on the login page for 20 minutes.

The problem? The "Sign In" button was a <div> with a click handler, not a real <button>. Her screen reader could not find it. The error messages appeared as red text with no ARIA live regions, so she never knew her password was wrong. The CAPTCHA had no audio alternative.

Sarah complained to her firm's IT director. The IT director escalated to the vendor. The vendor faced a complaint under the NZ Human Rights Act. And the development team spent three weeks remediating a problem that would have taken 30 minutes to catch during development.

Accessibility is not a feature. It is a fundamental quality of software.

In NZ, approximately 1.1 million people have some form of disability. That is nearly a quarter of the population. Vision impairment, motor disabilities, cognitive differences, and hearing loss all affect how people interact with technology. Accessibility testing is how we verify that our products do not exclude them.

2 The Rule

Accessibility testing verifies that people with disabilities can perceive, understand, navigate, and interact with software using the assistive technologies and adaptive strategies they rely on.

It is not about adding a "special version" for disabled users. It is about building one product that works for everyone: keyboard users, screen reader users, voice control users, people with tremors, people with colour blindness, and people with cognitive disabilities.

3 The Analogy

Analogy

Building a ramp instead of just stairs.

A building with only stairs says: "If you cannot climb, you do not belong here." A ramp says: "Everyone is welcome." But accessibility is more than ramps. It is also wide doorways for wheelchairs, tactile paving for blind pedestrians, hearing loops for hearing aid users, and clear signage for people with cognitive differences. In software, the equivalent is keyboard navigation, screen reader labels, colour contrast, readable fonts, and predictable layouts. Accessibility testing is the building inspector who verifies all of these before occupancy.

4 WCAG 2.1: The Four Principles

The Web Content Accessibility Guidelines (WCAG) are the international standard. They are organised around four principles, memorised as POUR:

PrincipleWhat it meansExample failures
Perceivable Information must be presentable in ways users can perceive Images without alt text, videos without captions, colour-only indicators
Operable Interface components must be operable by all users Mouse-only interactions, no keyboard shortcuts, auto-playing content with no pause
Understandable Information and operation must be understandable Jargon-filled error messages, unpredictable navigation, no input validation feedback
Robust Content must work with current and future assistive technologies Invalid HTML, missing ARIA labels, JavaScript that breaks screen readers

Conformance levels: WCAG defines three levels — A (minimum), AA (standard), and AAA (enhanced). Most organisations, including NZ government, target WCAG 2.1 AA as their baseline.

5 Testing Techniques

Keyboard Navigation Testing

Unplug your mouse. Can you use every feature with only Tab, Enter, Space, Arrow keys, and Escape?

  • Tab order follows the visual reading order (left to right, top to bottom)
  • Focus indicator is always visible (never hidden by CSS outline: none without replacement)
  • Trap-free navigation (Tab never gets stuck in a modal or widget)
  • Skip links exist to bypass repeated navigation
  • Custom controls (dropdowns, tabs, carousels) are fully keyboard-operable

Screen Reader Testing

Download NVDA (free, Windows) or use VoiceOver (built into macOS and iOS). Close your eyes and try to complete a core task.

  • All images have meaningful alt text (or are marked decorative with alt="")
  • Form fields have associated labels, not just placeholder text
  • Headings create a logical document outline (h1 → h2 → h3)
  • Dynamic content updates are announced (ARIA live regions)
  • Tables have proper headers (<th>) and scope attributes
  • Links make sense out of context ("Read more" is bad; "Read more about KiwiSaver" is good)

Colour Contrast & Visual Testing

Approximately 1 in 12 NZ men and 1 in 200 women have some form of colour blindness.

  • Text contrast ratio is at least 4.5:1 for normal text, 3:1 for large text
  • Information is never conveyed by colour alone (add icons, labels, or patterns)
  • Text remains readable at 200% browser zoom
  • Content reflows without horizontal scrolling at 400% zoom
  • Flashing content is absent or below the threshold that triggers seizures

Cognitive Accessibility

  • Error messages explain what went wrong and how to fix it
  • Form validation happens inline, not only on submit
  • Consistent navigation and layout across pages
  • Adequate time limits with ability to extend
  • Plain language; avoid unnecessary jargon

6 Tools in Action

axe DevTools — Browser extension

axe is the industry standard for automated accessibility testing. It integrates into Chrome and Firefox DevTools, catches ~57% of WCAG issues automatically, and has near-zero false positives.

  1. Install axe DevTools from the Chrome Web Store.
  2. Open DevTools (F12) → axe DevTools tab.
  3. Click "Scan all of my page."
  4. Review violations, needs review, and best practices.
  5. Click any violation to see the impacted element, the WCAG rule, and how to fix it.
Lighthouse — Built into Chrome

Chrome DevTools → Lighthouse → Select "Accessibility" → Generate report. Lighthouse scores 0-100 and flags issues with severity. It is a great starting point but misses many issues that require manual testing (keyboard, screen reader).

WAVE — Web Accessibility Evaluation Tool

WAVE (wave.webaim.org) is a free web-based tool that overlays visual indicators directly on your page. Red icons for errors, yellow for alerts, green for good features. Excellent for quick visual scans and sharing with designers.

Important: Automated tools catch only 20-30% of accessibility issues. A tool can tell you an image lacks alt text, but it cannot tell you if the alt text is meaningful. It can detect missing labels, but not whether a keyboard user can operate a custom date picker. Manual testing with a keyboard and screen reader is mandatory for WCAG compliance.

7 NZ Legal Context

Accessibility is not just ethical — in NZ, it is increasingly a legal requirement.

  • Human Rights Act 1993: It is unlawful to discriminate on the basis of disability. This includes providing goods and services through inaccessible digital channels.
  • NZ Government Web Accessibility Standard: All public service departments and Crown entities must meet WCAG 2.1 AA for web content. This standard is legally binding under the State Sector Act.
  • UN Convention on the Rights of Persons with Disabilities: NZ is a signatory. Article 9 requires accessible ICT for people with disabilities.

For testers: If you work on government contracts, accessibility testing is not optional. Document your testing methodology, keep records of WCAG conformance, and include accessibility in your Definition of Done.

8 Common Mistakes

🚫 Relying only on automated tools

I used to think: Running Lighthouse gets me to WCAG AA.
Actually: Automated tools catch ~30% of issues. Keyboard navigation, screen reader usability, logical heading order, and meaningful alt text all require manual testing. Use tools as a first pass, not a finish line.

🚫 Testing accessibility at the end

I used to think: We will add accessibility in the final QA sprint.
Actually: Retrofitting accessibility is 10-100x more expensive than building it in. A missing heading structure may require redesigning entire page templates. Test components as they are built, not after integration.

🚫 Using "click here" and "read more" links

I used to think: Users can see the surrounding context.
Actually: Screen reader users navigate by link list. "Click here" gives them no information. Every link text must make sense in isolation: "Download the accessibility guide (PDF, 2MB)" is infinitely better than "Click here."

🚫 Removing focus indicators for aesthetics

I used to think: The blue outline looks ugly.
Actually: Focus indicators are the only way keyboard users know where they are. If you remove them, keyboard navigation becomes impossible. Style them to match your brand instead: :focus { outline: 2px solid #00d4ff; outline-offset: 2px; }

9 Now You Try

🎯 Practical Exercise

Task: Perform an accessibility audit on any NZ government website (try govt.nz or a department site). Use the following approach:

  1. Run axe DevTools or Lighthouse. Note the number of violations and their severity.
  2. Unplug your mouse and navigate using only Tab, Enter, Space, and Arrow keys. Can you access every feature?
  3. Enable VoiceOver (Mac: Cmd+F5) or NVDA (Windows). Close your eyes and try to understand the page structure from headings alone.
  4. Check one page at 200% and 400% zoom. Does content reflow without horizontal scrolling?
  5. Use a colour blindness simulator (Chrome extension: Colorblindly). Can you still understand charts, forms, and status indicators?

10 Self-Check

Click each question to reveal the answer.

Q1. What does POUR stand for in WCAG?

Perceivable, Operable, Understandable, Robust. These are the four principles that underpin all accessibility guidelines.

Q2. Why is manual testing necessary even when automated tools pass?

Automated tools cannot evaluate meaning. They can detect a missing alt attribute but not whether alt text is meaningful. They cannot test keyboard usability, screen reader flow, or logical content structure.

Q3. What is the minimum contrast ratio for normal text under WCAG AA?

4.5:1. Large text (18pt+ or 14pt+ bold) requires 3:1. UI components and graphical objects also require 3:1 against adjacent colours.

Q4. What makes a link accessible for screen reader users?

Link text must be descriptive and make sense out of context. Avoid "click here" and "read more." Use "Download the annual report" or "Read more about accessibility standards."