Cross-platform accessibility fundamentalsfor testers

1

BCS SIGIST Winter 2014 conference4 December 2014

Jon Gibbins

© Jon Gibbins

Introduction

• Jon Gibbins– Accessibility consultant at Dig Inclusion– Web developer since 1999– Assistive technologist since 2002– Training since 2012

© Jon Gibbins 2

How?

• Assistive technology– Speech output (screen readers)– Braille output– Voice input– Magnification

3

Demo: VoiceOver on iOS

4

Lots of accessibility testing tools across multiple platforms

5

There’s no replacement for testing with real users

6

Cross-platform accessibility testing?

7

Accessibility principles

• Name, role, state• Text alternatives: images, audio, video• Labeling: form controls, headings, buttons• Structure: headings, lists, landmarks• Keyboard access and focus• Content / focus order• Use of colour/colour contrast• Multimedia• Time• Use native controls where possible• Use web standards for web content

© Jon Gibbins 8

Accessibility principles

Name, role, state: the baseline information that a browser passes on from your website to assistive technologies.

© Jon Gibbins 9

Accessibility theoryAccessibility API fundamentals

• We know what assistive technology is, but how does it work?

• Accessibility APIs– Present user interfaces as information rather than a

purely graphical medium, translating an application’s user interface into information that assistive technology can understand

– Allow an application’s user interface to be changed by the assistive technology

– Provide a common vocabulary we can use when talking about accessibility.

10

Accessibility theoryAccessibility API fundamentals

• Accessible Object Properties– User interface is represented as a hierarchy of accessible

objects– Each object has a variety of properties, such as:

• name: Defines a label. (“Hi, what’s your name?)• role: Defines the behavior. (“So, what do you do?”)• state: Defines the current condition. (“How are you?”)

• Accessible Events– Accessibility APIs notify assistive technologies of changes

by broadcasting events.

11

Accessibility theoryAccessibility API fundamentals

A dialog takes place between an application and assistive technology.

12

Accessibility theoryAccessible Object Properties

• Example: a checkbox in a desktop application

– role: check box– name: Open new windows in a new tab instead– state: checked

13

Accessibility theoryAccessible Object Properties

• Examples in HTML– role:<img alt="Can of soda" src="soda.jpg">

<label for="last">Last name</label><input type="text" id="last" name="last" value="Bloggs">

– name:<img alt="Can of soda" src="soda.jpg">

<label for="last">Last name</label><input type="text" id="last" name="last" value="Bloggs">

14

Accessibility theoryAccessible Object Properties

• Examples in HTML– state:<label for="last">Last name</label><input type="text" id="last" name="last" value="Bloggs" disabled="disabled">

– value:<label for="last">Last name</label><input type="text" id="last" name="last" value="Bloggs">

15

Accessibility theoryAccessible Object Properties

• An accessible name is required and identifies an object. It is short and does not necessarily describe the object.

<label for="date">Event date</label><input type="text" id="date" name="date">

• An accessible description is optional text that provides additional information about an object.

<label for="date">Event date</label><input type="text" id="date" name="date” aria-describedby="instructions"><p id="instructions">Must be in mm/dd/yyyy format.</p>

16

Inspection toolsaViewer on Windows

Inspection tools

Accessibility Inspector in OS X (part of Xcode)

Accessibility testing tools

Web Accessibility Toolbar

Questions?

Thank you!

• I’m Jon Gibbins– @dotjay on Twitter– For more information contact:

jon@diginclusion.com• Slides available at:

http://a11y.cc/sigist2014• Feedback gratefully received!

© Jon Gibbins 21

Copyright

• Copyright 2014 Jon Gibbins/Dig Inclusion– This material may not be shared or distributed

without express permission from Dig Inclusion– For more information contact hello@

diginclusion.co.uk

© Jon Gibbins 22