Accessibility jane zhou

Intro – Target Audience & Objectives
Target Audience
UX Engineers, QA, and PM in Application Groups, Platform/ R&S Departments (no
development insights)
Everyone else who is interested in accessibilty
Objectives
What means accessibility?
Why it is important?
What means Section 508 for applications?
Which tools are provided by Windows, how to use them?
How to design an application with accessibility in mind

Agenda
Accessibility?
§508 – why?
Tools
Excercise: using the screen reader
Excercise: keyboard support
Excercise: using high contrast
Accessible application design
Overview

Accessibility
What
• Providing people with disabilities the possibility to use our products
Why?
1 out of 5 Americans has some type of disability (due to a survey performed by
the U.S. Census Bureau)
Old people: 15% of people older than 65 years have special needs
Selling our products to governmental institutions
Image

Accessibility
Impairment Description Solutions
Visual Ranges from mild (affecting 17
percent of
users) to severe (affecting 9 percent of
users).
Customizable magnification, colors, and
contrast; Braille utilities; screen readers.
Hearing Ranges from mild (affecting 18
percent of
users).
Information redundancy: sound used only as
supplement to text or visual communication.
Dexterity Ranges from mild (affecting 19
percent of
users). This impairment often involves
difficulty performing certain motor skills
with keyboard or mouse.
Input method redundancy: program
features accessed by mouse or keyboard
equivalents.
Cognitive Includes memory impairments and
perceptual differences. Affects 16
percent
of users.
Highly-customizable user interface (UI); use
of progressive disclosure to hide
complexity; use of icons and other visual
aids.
Speech or
language
Includes dyslexia and oral
communication
difficulties.
Spell-check and grammar-check utilities;
speech recognition and text-to-speech
technology.

Accessibility
About 8% of adult males have some form of color confusion...
The primary colors – seen by a user with
normal color vision Deuteranopia
(6% of male population)
Protanopia
Tritanopia

Section 508?
• Workforce Rehabilitation Act (美國復健法案第 508 款)
Section 508 – Why?

Why 508?
In contrast to German or UK laws, Section 508 directly includes detailed rules for
software applications and multi media systems
German/ UK laws only covers intranet and internet applications
Section 508 – Why?

Section 508 – Focus
Basis are the following subparts of Section 508:
Subpart B („Technical Standards“), §1194.21 only („Software Applications and
Operating Systems“)
Subpart C, §1194.31 („Functional Performance Criteria“)
Subpart D, §1194,41 („Information, Documentation, and Support“),

Section 508 – Focus
Following subparts might be interesting for some AGs, but will not be covered in
this presentation:
Subpart B („Technical Standards“), §1194.22 („Web-based intranet and
internet information and applications. 16 rules.“)
Section 508 is covered only partly by WCAG 1.0
Subpart B („Technical Standards“), §1194.24 („Video and multimedia
products“)
E.g. supporting closed captions, supporting secondary audio program
playback, ...

Section 508 – Focus?
The whole thing:
www.section508.gov

If you do only 3 things...
• Complete and compliant keyboard support
• Support high contrast mode
• Support screen reader
... you‘ve already covered most of the accessibility requirements.
Section 508 – Final

Tools
Screen Reader: narrator.exe
“Start”  “Run”  “narrator.exe”
<CTRL> + <SHIFT> + <SPACEBAR>: read the whole active window
Navigate to an interface element: read information about the element

High-Contrast Mode
• XP: Start  Control Center  Accessibility
 Accessibility Tools  Display  Enable
High Contrast
• Vista: Start  Control Panel  Ease of
Access  Optimize Visual Display
 High Contrast
• Or: <alt> + <shift> + <print>
• Different color schemes could be used
by using the “settings” button
Tools

Tools
Nero Burning ROM/ Nero Express in high contrast mode

Agenda
Accessibility?
§508 – why?
§508 in detail
Tools
Excercise: using the screen reader
Excercise: keyboard support
Excercise: using high contrast
Overview

Exercise: Using the screen reader
Info
Read the whole window: <ctrl> + <shift> + <space>
Read a single control: navigate to the control (e.g. via <tab>/ <shift> +
<tab>
XP: Narrator reads from top to bottom
If more than one element are placed on the same y-position, narator
reads the corresponding line from left to right
Vista: Narrator seems to read according to the tab order
 Optimize for XP – Vista should work automatically (if keyboard support is
implemented well additionally), but test on both systems

Exercise: Using the screen reader
How to
• Turn of video projector
• Start Narrator.exe
• Start example application/ Dialog: „Narrator Support (wrong)“
• Listen to the dialog
• Close the application/ narrator.exe
• Attendencies draw the dialog on the whiteboard

Exercise: keyboard support
Info
• Navigate via <tab> (forward) and <shift>+<tab> (backward)
• Use controls correct (e.g. <space> for checking a radio button, <up> and
<down> for navigation within a group)
• Test shortcuts (<ctrl> + something) and access keys (<alt> + <alphanumeric
key (underlined)>)

Exercise: keyboard support
How to
• Start example application/ Dialog: „Keyboard Support (wrong)“
• Step through the dialog via <tab> and <shift> + <tab>
• Use access keys(<alt> + the underlined letter)

Exercise: Using high contrast mode
How to
Start example application/ Dialog: „High Contrast (wrong)“
Close example application
Change Windows Theme
Task: Find the problems!
Turn on high contrast mode „High Contrast Black (large)“ (default)

How to
Turn on high contrast mode „High Contrast White (large)“
Exercise: Using high contrast mode

Use standard controls and dialogs
Learn the standard controls/ dialogs and their behaviour, e.g.
Check box, radio buttons
Command button/ Command links
Drop down list/ combo boxes
List boxes/ list view
Progress bar
Progressive disclosure controls
Toolbars, ribbons,...
Dialogs: Open/ Save File, Print (preview), color selection...
Try to get as many things covered with standard controls as possible

Accessible application design starts with the wording...
Use these terms Instead of
Has limited dexterity, has motion disabilities Crippled, lame
Without disabilities Normal, able-bodied, healthy
One-handed, people who type with one hand Single-handed
People with disabilities The disabled, disabled people, people with
handicaps, the
handicapped
Cognitive disabilities, developmental
disabilities
Slow learner, retarded, mentally handicapped
Use system colors, fonts, and common controls whenever possible

Do screen reader friendly layouts
E.g. placing descriptions for edit boxes/ combo boxes... above (left aligned),
corresponding controls below
No layout with more than one column
Define shortcuts and access keys, default button, tab order, high contrast
behaviour...
Do not forget colons where colons belong!

Limit animations
Use progressive disclosure to hide complexity
Use auto-complete functionality for editable text

Most important
Test the application for accessibility (test plans...)
Train developers/ QA for taking care about accessibility

Overview
What How
Keyboard support  Tab order
 Shortcuts
 Use max. 3, better only 2 keys at the same time
 Access keys
 Focus
Screen reader  Read single elements
 Read whole window
 Identity, operation, state
 Use „:“ at the end of descriptive labels
 Tab order
High contrast  Detect high contrast
 Adapt to OS wide display settings
 at least after application restart
 Remove (background) pictures
Addtional  Turn off animations on request
 No blinking/ flashing elements (between 2Hz and 55Hz)
 No information coding via color only
 Provide textual information where it is not available (e.g. pictures, animations)
Documentation & Support  Provide documentation for „accessibility features“
Process related  Test, test, test! (Test plan creation, turn off your monitor, remove your mouse...)
 Trigger Section 508 certification through TL-UX – when your own tests succeeds

Accessibility jane zhou

Recommended

Recommended

More Related Content

What's hot

What's hot (7)

Similar to Accessibility jane zhou

Similar to Accessibility jane zhou (20)

More from 碳酸饮料会

More from 碳酸饮料会 (20)

Recently uploaded

Recently uploaded (20)

Accessibility jane zhou