Reading Time: 24 mins

ACCESSIBILITY TESTING – CHECKLISTS & TOOLS

Laura Kalbag, author of

Accessibility for everyone, defines
Accessibility as ‘the degree to which a
website is accessible by as many people
as possible.’

It simply means your product/site should be made accessible to persons with disabilities, such as

VISION IMPAIRMENT

HEARING DISABILITIES

OTHER PHYSICAL OR
COGNITIVE CONDITIONS

Accessibility testing is done to ensure your product meets the needs of all types of users, and
stringent laws across the globe have also made accessibility compliance a compulsory process.

This infographics will take you through the number of action items to be
addressed in an accessibility testing. Before we begin with the checklist,
here are some of the Accessibility related statistics to mind.

STATS TO MIND

19.9 MILLION

Americans have a physical impairment that restricts their use of a keyboard or mouse.

8.1 MILLION

Americans have a visual impairment or have a form of color blindness that require them to use screen readers

7.6 MILLION

Americans have a visual impairment or have a form of color blindness that require them to use screen readers.

80 MILLION

people in the European Union are affected by a disability to some degree.

LAWSUITS THAT YIELDED HEFTY FINES FOR
NON-COMPLIANCE TO ACCESSIBILITY

  • Lawsuit filed against Domino’s Pizza over inaccessibility of online ordering system for visually impaired people
  • Netflix and deaf-rights group settle suit over video captions
  • Beyoncé was sued over her website violating the Americans With Disabilities Act (ADA)

The population and income of the persons with disabilities (PWD) are presented in the table below:

GLOBALUSACANADAEU6ASIA6
PWD POPULATION1.131B56.7mm6.2mm91.0mm748.0mm
PWD INCOME6>$1.97T$872.7$113.3B$983.9BNA
PWD DISPOSABLE6>1.2T$645.3B$55.4B$482.1BNA

ACCESSIBILITY, AN UNCHARTED ECONOMY

Given the current state of accessibility, it still remains one of the last things to be considered when it comes to product design and development. The main reason for this treatment boils down to ignorance and fear of additional cost and time involved with accessibility testing.

To provide a flawless experience to all users, let’s understand the different techniques that help users access web content, guidelines to be followed by the companies, and checklists to keep in mind for accessibility testing.

QA CHECKLIST FOR ACCESSIBILITY TESTING

Important and globally recognized accessibility guidelines to be followed are,

Web Content Accessibility Guidelines (WCAG). The current stable and reference-able version of WCAG is 2.0, and WCAG 2.1

  • 4 guiding principles of WCAG are:
    • Perceivable
    • Operable
    • Understandable
    • Robust
  • Three levels of conformances include: A, AA, AAA

BD 8878:2010 outlines the decisions needed to be made when designing or commissioning web-based products released by the UK Govt

Section 508 by the US govt.

All the websites being designed should follow accessibility testing guidelines for one important reason:
the American Disability Act (ADA).

Testing can be performed using,

Desktop/mobile online tools

Keyboard navigation

Screen reader

Color contrast tools

TESTTOOLSPROCESS
ColorsColor contrast toolsHigh contrast: Activate high contrast in Windows, check that all text responds to color changes and that no critical information disappears.
Contrast ratio: Use color contrast analyzer to calculate the contrast ratio per page.

  • Ensure standard text has a color contrast ratio of 4.5:1.
  • Ensure that large text has a color contrast ratio of 3:1 as per WCAG 2.1 AA.

Note

  • Normal Text: Text < 18 point normal or <14 point bold
  • Large Text: Text > 18 point normal or > 14 point bold
FormsKeyboard navigationEnsure that keyboard/keyboard shortcut doesn’t interfere with the web page’s content and functionality and, keyboard focus is always visible.

  • Ensure tab order of the forms are logical and as expected.
  • Ensure all interactive elements (drop-down menus, tab pages, etc.) can be accessed using keyboard alone
  • Ensure that the ARIA 1.1 Authoring Practices are followed for all keyboard interactions.
TabsUse the Tab key to move through all links and form fields. Confirm that tabbing fields are logical and as expected
Dialog box and pop-upsKeyboard navigationEnsure all dialogs and pop-ups can be dismissed using keyboard and focus is retained on the element which activated dialog box/pop-ups.
MultimediaKeyboard navigation & Screen readerEnsure all multimedia, I.e., Audio, Video, Images, Animated carousels, skip navigation links can be tabbed through and controlled using keyboards and screen readers

  • Ensure all images (decorative/meaningful) have alt/descriptive alt text
  • Ensure videos show or have an option to show closed captions. (For any audio recordings, check that there is a text transcript.)
  • Ensure all controls are labelled properly
HeadingsScreen readerEnsure users should be able to navigate pages using headings. Ensure headings are logical, structured and it provides the significance of the content on the page Ensure there’s only one H1 tag on page
DESKTOP/MOBILETOOLSCOMPATIBILITY
DesktopColor Contrast AnalyzerAll browser types
WAVE (Web accessibility evaluation tool)Chrome and Firefox (Browser extension)
Deque tools: AXE PluginAll browser types and extension available in Chrome and Firefox
WAT (Web accessibility toolbar)IE and Opera browser (Browser extension)
FireEyes PluginFirefox
Screen recorderJAWSIE
NVDAFirefox
VoiceoverSafari
TalkbackChrome
MobileMobile Web Accessibility CheckerMobile web- iOS only
Accessibility ScannerAndroid
Accessibility InspectoriOS
Download my copy