1. Accessibility IS 403: User Interface Design Shaun Kane 1

2. Admin Today: Catch up on accessibility 2

3. Today What is accessibility? Who needs accessibility? Designing for accessibility Verifying accessibility 3

4. Accessibility Web accessibility means that people with disabilities can use the Web. More specifically, Web accessibility means that people with disabilities can perceive, understand, navigate, and interact with the Web, and that they can contribute to the Web. 4 http://www.w3.org/WAI/intro/accessibility.php

5. Why make websites accessible? Good for business –Reach a large audience Support social inclusion –Participation from a diverse group is good Follow the law –Access to information is a basic human right 5

6. Legal support for accessibility 1990: Americans with Disabilities Act (ADA) 1998: Rehabilitation Act (section 508) 2006: Individuals with Disabilities Education Act (IDEA) http://webaim.org/articles/laws/usa/ 6

7. Legal Cases 1996 ADA complaint vs. City of San Jose, CA –Use of PDF inaccessible to city commissioner –Web sites are a “service” and thus subject to the ADA –Led to S. J. Web Page Disability Access Standard 1999 National Federation of the Blind vs. AOL –Based on the interpretation of the Web as a place of public accommodation (ADA) –Settled out of court –2000: AOL agreed to make its browser accessible 2006 NFB vs. Target –ADA as applied to Target’s web site –Settled for US $6 million 7

8. Who is affected? People with disabilities (visual, hearing, motor, cognitive, reading) –About 1 in 5 adults (webaim.org/intro) Older adults – up to 50% of computer users may benefit from accessibility features (http://www.microsoft.com/enable/research/) “Situational impairments” – mobile device users, temporarily injured people Sometimes it’s just convenient – reading transcripts vs. watching a video 8

9. Designing for accessibility User involvement is key Use personas to guide design Follow design guidelines for specific disabilities 9

10. Categories of Impairments Cognitive (Learning Disability, memory, reading) Mobility (Physical) Hearing Speech Visual 10

11. Considerations for Cognitive Impairments Short term memory storage: 7+- 2 – Don’t rely on your user to remember large amounts of information, or complex steps Distraction / Task Decomposition – Consider users who have difficulty focusing Make tasks shorter, simplify designs Socialization – Some children with autism may not be comfortable looking at faces 11

12. Considerations for Mobility Impairments Keyboard accessibility – Users can access and activate everything on the page with solely the keyboard Speech recognition compatibility – Proper code structure is a must Provide ample time for tasks Provide shortcuts – “Skip Navigation” linksSkip Navigation 12

13. Considerations for Hearing Impairments O Use structured pages O Use headings and subheadings O Use bulleted lists O Write clearly O Keep language short, simple, and to the point O Write in active voice O Avoid jargon and/or provide definitions O Provide alternatives to audio O Text, captions, or even sign language interpreters O TTY-enabled customer service lines 13

14. Considerations for Speech Impairments Provide alternatives to speech – Chat rooms and email as well as telephone numbers for customer service (at the same level of service) Provide cues to get people started – May be able to speak, but have difficulty constructing freeform text 14

16. 16

17. 17

18. 18

19. Color blindness Affects 10% of males Multiple variations 19 D. Flatla et al

20. Considerations for Visual Impairments Use text instead of images of text – Use CSS to style text (Logos are exceptions) Keyboard accessibility – Don’t override keystrokes – Users can access and activate everything on the page with solely the keyboard Skip navigation links 20

21. Considerations for Visual Impairments O Have alternatives to color O Required fields in red O * denotes required fields O Provide sufficient color contrast 21

22. Considerations for Visual Impairments Provide ample time for tasks Provide shortcuts 22

23. WCAG: Web Content Accessibility Guidelines Perceivable –Provide text alternatives for non-text content and provide captions and alternatives for audio and video content. –Make content adaptable; and make it available to assistive technologies. –Use sufficient contrast to make things easy to see and hear. Operable –Help users find content and make everything keyboard accessible. –Give users enough time to read and use content. –Do not use content that causes seizures. Understandable –Make text and content understandable, and readable – Make content operate in predictable ways. and help users avoid and correct mistakes. Robust –Maximize compatibility with current and future technologies. http://www.w3.org/WAI/intro/wcag.php 23

24. Effects of assistive devices People with disabilities may use technology that affects how technology is used Visual: Screen readers, magnifiers Motor: alternative input devices, styli Hearing: hearing aid, interpreters 24

25. Examples of AT use Louise, cerebral palsy –http://www.youtube.com/watch?v=KtAHzRu1OF0 Ben, head pointer –http://www.youtube.com/watch?v=p9NsV39nq8U University of Washington DO-IT –http://www.washington.edu/doit/Video/ 25

26. Verifying accessibility User testing is the best way Heuristic evaluation can help –http://webaim.org/intro/#principles –http://webaim.org/standards/wcag/checklist Simulating disability –http://vischeck.com/ –http://firevox.clcworld.net/ – http://www.chromevox.com/ 26

27. Accessibility personas activity Break into pairs Make a persona for a user with accessibility needs when viewing Amazon.com –Who they are –Why they use amazon –Some problem that they have –What they do about it 27

28. Accessibility experience activity Try some accessible technology and report back Use ChromeVox or http://webanywhere.cs.washington.edu/beta/ http://webanywhere.cs.washington.edu/beta/ Try to learn about a new academic program at http://umbc.edu (not IS)http://umbc.edu –What’s difficult? –What’s surprising? 28

29. WebAnywhere demo 29