Accessibility Testing By Audience Need

1
Accessibility Testing By Audience Need

• Elizabeth J. Pyatt, Ph.D. (ejp10_at_psu.edu)
• Christian Vinten-Johansen(cjohansen_at_psu.edu)
  Information Technology Services

2
Why Audience?

• Different types of disabilities
• Visual Impairments, Hearing Impairments, Motion
  Impairments, Cognitive/Learning Disabilities
• But needs remain the same across tech
• A video is a video no matter the extension and
  will need caption
• Everyone will be temporarily disabled

3
Severe Visual Impairment

• Requires a screen reader to read Web content
  aloud
• Multimedia, images need to be describedNot 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

4
What the ALT Tag does
Text describes piston position
Piston diagram images
5
ALT Tagger in ANGEL
Enter information Alternative Text field when
uploading images
6
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 informationSee
  WAI-ARIA for how to code. JavaScript CAN be
  accessible.

7
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?

8
At 300 Zoom
Which part of content is an image? Equation
9
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?
10
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 v
• Hidden Audience
• People with a black and white printer

ANGEL Quiz Scores X v
11
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
12
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
• Cant find one of 5 volume controls
• Poor audio quality (even for normal hearing)
• 50 students used captions in online class

13
Captions Reveal Information
Caption shows how to spell Cole Campleses name.
14
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

15
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)
• Dont hide information too quickly
• Let user start/stop animation audio

16
Hidden Audience

• Everyone appreciates usability
• Learners often have simpler mental models than
  experts
• Includes instructors learning new tech!

What are these icons?
Icons labels
17
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

18
General Tips 2

• HTML is still the most accessible tech
• Use Flash for multimedia, but not navigation
• Use PDF only for files which CANT 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 reader)

19
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)

20
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 (pzb4_at_psu.edu)

21
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 (pzb4_at_psu.edu)

22
Key Resources

• Web Publishing System (CMS)
• Encoded accessibility rules
• Roles
• Multiple authors designer, faculty SME
• Gatekeeper
• Workflow
• Protected templates and styles

23
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