Transcript AccessOIF0409Final

Accessibility Testing By
Audience Need
Elizabeth J. Pyatt, Ph.D.
([email protected])
Christian Vinten-Johansen
([email protected])
Information Technology Services
Why Audience?
• Different types of disabilities
 Visual
Impairments, Hearing Impairments,
Motion Impairments, Cognitive/Learning
Disabilities
• But needs remain the same across tech
 Aandvideo
is a video no matter the extension
will need caption
• Everyone will be temporarily disabled
Severe Visual Impairment
• Requires a screen reader to read Web
content aloud
 Multimedia,
images need to be described
Not all descriptions need to be hidden
 Program
elements need to identify
themselves
• Hidden Audience
 Text-based
mobile device, missing
plugin, images disabled, or broken image
link
What the “ALT Tag” does
Text describes piston position
Piston diagram images
ALT Tagger in ANGEL
Enter information “Alternative Text” field when uploading images
New Apps Gotcha
• Not all apps and plugins include
information for screen reader
 Old
iTunes: MP3 music files were
accessbile, but navigation in iTunes was


not
Some users encounter difficulty creating a
login! (esp Flash based interface)
Web Forms – Need to signal new
information
See WAI-ARIA for how to code.
JavaScript CAN be accessible.
Low Vision Users
• May zoom browser 200% or more
 Good color contrast (light vs dark)
 Fonts should be extra legible on Web
 Text zooms better than images
 Extra legible fonts
• Hidden Audience
 iPhone users
 Older users
• Will Kindle make a difference?
At 300% Zoom
Which part of content
is an image?
Equation
A Little Hard on the Eyes
Light gray field labels
Tiny Text (7/8 pt)
Can you see the text?
An entire page in a cursive font?
Color Deficient users
• Primarily Red/Green (10% men)
 Design
so information viewable in black
and white (or grayscale)
 Underline your text links
 Supplement color coding with shape
• Red X and Green √
• Hidden Audience
ANGEL Quiz Scores X & √
 People with a black and white printer
Different Colored World
Color coded text
Color deficient:
Shades of brown and blue
Color coded currency exchange.
Green = up, red = down
Deuteranopia view (Photoshop Proof)
Up/down arrows still informative
Hearing Impaired
• You cannot hear content
 Captions, captions, captions (or transcript)
 Some users more fluent in sign language
• Hidden Users
 Forgot headphone in lab
 Audio cuts out
 Can’t find one of 5 volume controls
 Poor audio quality (even for normal hearing)
 50% students used captions in online class
Captions Reveal Information
Caption shows how to spell Cole Camplese’s name.
Motion Impaired
• Keyboard always easier than mouse
 Enable keyboard tabbing on forms
 Develop
text-based alternative (esp. drop
down menus)
 Keyboard shortcuts
 BIG
click targets & avoid disappearing
controls
• Hidden Audience
 Carpal
tunnel, broken wrist, essential
tremor,
 New to mouse, iPhone, track pad…
Cognitive Disabilities
• Interface should be simple and
consistent
 Use same language throughout site/tool
 Use language audience will understand
 Restrict
icons to the basics (e.g. arrow
icon)
 Provide
“Global View” (all options at
once)
 Don’t hide information too quickly
 Let user start/stop animation & audio
Hidden Audience
• Everyone appreciates usability
• Learners often have “simpler” mental
models than experts
 Includes instructors learning new tech!
What are these icons?
Icons + labels
General Tips
• Learn easy fixes for tool
 Most
fixes are easy fixes (e.g. fill in the
ALT tag field in ANGEL image upload)
• Think alternate tech
 Can
an MP3 file be delivered by blog as
well as iTunes?
 Can a blog be delivered by e-mail?
• Captions
 Write
script or recruit “cheap transcription
labor”
General Tips 2
• HTML is still the most accessible tech
 Use
Flash for multimedia, but not
navigation
 Use
PDF only for files which CAN’T be
delivered any other way
• Asynhchronous (e-mail, discussion board)
can be more accessible than synchronous
(e.g. chat, Connect)
Text chat may be more accessible than
audio
(if student hearing impaired)
Or maybe use the phone (if on screen


Key Resources
• Penn State
 http://accessibility.psu.edu/ (Penn State Hub)
• iCITA (Illinois)
 http://fae.cita.uiuc.edu (FAE Evaluator)
 http://firefox.cita.uiuc.edu (Firefox Plugin)
• WebAIM
 http://www.webaim.org (WebAIM)
 http://wave.webaim.org (Visual Evaluator)
Key Resources
• Accessible Web Publishing Wizard
 http://www.virtual508.com/
•
•
Microsoft® Word to HTML
Microsoft® Powerpoint to HTML
• Parity
 Practical video captioning
 Contact Pat Besong ([email protected])
Key Resources
• Accessible Web Publishing Wizard
 http://www.virtual508.com/
•
•
Microsoft® Word to HTML
Microsoft® Powerpoint to HTML
• Parity
 Practical video captioning
 Contact Pat Besong ([email protected])
Key Resources
• Web Publishing System (CMS)
 Encoded accessibility rules
 Roles
• Multiple authors: designer, faculty SME
• Gatekeeper
 Workflow
 Protected templates and styles
At the end of the day...
• Human judgement over automated
tools
• Work roles and responsibilities:
 Train faculty and instructional designers

in accessibility
- and “Gatekeeper”: accessibility / editorial
specialist in the workflow