Implementing universal accessability

532 views

Published on

This presentation was given at a Library Technology Exchange Forum on Accessability on May 16, 2006. Based on the work of Sarah Horton, this presentation describes the challenge of serving users with special needs, and some of the methods for doing so.

Microsoft Powerpoint presentation, 50 slides

Published in: Education, Technology, Design
0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total views
532
On SlideShare
0
From Embeds
0
Number of Embeds
5
Actions
Shares
0
Downloads
3
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide

Implementing universal accessability

  1. 1. Universal Accessability Paul Houle Library Systems CU Library Based on a presentation by Sarah Horton slide 1 of 64
  2. 2. What is universal accessability?  An extension of usability  Make systems usable for everyone  First: be flexible to people’s needs  Second: provide alternative access  Gives best user experience  At least cost Designing Accessible WebsitesDEFINITIONS slide 2 of 64
  3. 3.  Access by accommodation… Designing Accessible WebsitesDEFINITIONS
  4. 4.  … versus design Designing Accessible WebsitesDEFINITIONS
  5. 5. Prevalance of Disabilities • US Census: 1 in 5 Americans report disability • 9% of incoming freshman have a disability that affects computer use Designing Accessible WebsitesEQUITABLE USE slide 5 of 64
  6. 6. Disabilities and Adaptations • Blindness (screen readers, ALT text) • Low vision (scalable text) • Color blindness (use colors carefully) • Deafness (captions) • Motor problems (access keys) • Cognitive deficits (general usability) Designing Accessible WebsitesEQUITABLE USE slide 6 of 64
  7. 7. •Time to complete task varies: • 2.4 times between 25% and 75% percentile • 15 times between fastest and slowest Jacob Nielsen’s Alertbox 5/15/2006
  8. 8. “Technologically Challenged” • Text web browsers • Old equipment • Small screens (PDA, cell phone) • Large screens (16:9, HDTV) • Web robots Designing Accessible WebsitesEQUITABLE USE slide 8 of 64
  9. 9.  www.nln.ac.uk Some sites offer “accessible” or “text-only” versions… Designing Accessible WebsitesEQUITABLE USE
  10. 10.  www.nln.ac.uk …but alternate versions are often accessible but not equivalent Designing Accessible WebsitesEQUITABLE USE
  11. 11.  www.oldnavy.com Some sites put the onus on users… Designing Accessible WebsitesEQUITABLE USE
  12. 12.  www.jkrowling.com …by requiring them to adapt their environment Designing Accessible WebsitesEQUITABLE USE
  13. 13.  www.newyorker.com Fixed-width columns, mix of text and graphic text FLEXIBLE DESIGN
  14. 14.  www.newyorker.com The main text scales but the column width remains the same… FLEXIBLE DESIGN
  15. 15.  www.newyorker.com …and the image-based navigation does not scale FLEXIBLE DESIGN
  16. 16.  Fixed designs hold together at a certain text size… www.academicimpressions.com/ FLEXIBLE DESIGN
  17. 17.  …but break apart when the text is enlarged www.academicimpressions.com/ FLEXIBLE DESIGN
  18. 18.  www.newyorker.com Fixed-width pages use only a portion of a large display… FLEXIBLE DESIGN
  19. 19.  www.newyorker.com …and do not reflow for viewing on small screens FLEXIBLE DESIGN
  20. 20. Cascading Style Sheets • Can display document parts out of order (put navigation at the end for screen readers) • Users can customize (Opera) • Support flexible layouts Designing Accessible WebsitesEQUITABLE USE slide 20 of 64
  21. 21.  www.wikipedia.org Flexible pages adapt to modifications, such as… FLEXIBLE DESIGN
  22. 22.  www.wikipedia.org …enlarged type… FLEXIBLE DESIGN
  23. 23.  www.wikipedia.org …larger page widths FLEXIBLE DESIGN
  24. 24.  www.wikipedia.org …smaller page widths FLEXIBLE DESIGN
  25. 25.  www.wikipedia.org …customized for small screens FLEXIBLE DESIGN
  26. 26.  www.wikipedia.org …and formatting turned off… FLEXIBLE DESIGN
  27. 27.  www.wikipedia.org …and with custom formatting FLEXIBLE DESIGN
  28. 28. Be careful about • Frames • Pop-up windows • Javascript • AJAX • Flash Designing Accessible WebsitesEQUITABLE USE slide 28 of 64
  29. 29. Accessable Flash • Good: text in Flash is really text • Good: Flash supports video with captions • Good: Flash supports access keys (use them!) • Bad: many sites have broken flash detection • Bad: many platforms will never support flash (text mode browsers) Designing Accessible WebsitesEQUITABLE USE slide 29 of 64
  30. 30. Fallbacks offer alternate modes of access  Primarily text-based because text can be seen and heard  Some provisions for alternates built into technology  Otherwise, alternates can be integrated into interface FALLBACKS slide 30 of 64
  31. 31.  www.apple.com Image-based content that is not accessible to non-visual users… FALLBACKS
  32. 32.  www.apple.com …can be supplied via alternate text (alt-text) FALLBACKS
  33. 33.  www.apple.com Though for equitable use… FALLBACKS
  34. 34.  www.apple.com …the alt-text must be equivalent FALLBACKS
  35. 35.  Equivalent text for text graphics is essential… www.creativecommons.org FALLBACKS
  36. 36.  …but alt-text describing reinforcing graphics is not helpful www.creativecommons.org FALLBACKS
  37. 37.  www.warnerbros.com Flash-based content can be presented with a fallback… FALLBACKS
  38. 38.  www.warnerbros.com …though it often isn’t FALLBACKS
  39. 39.  solarsystem.nasa.gov On some sites, the Flash fallback… FALLBACKS
  40. 40.  solarsystem.nasa.gov …is a suggestion to install Flash, here offered with an additional fallback link… FALLBACKS
  41. 41.  solarsystem.nasa.gov …to a text version FALLBACKS
  42. 42.  www.kidshealth.org The most successful Flash fallback… FALLBACKS
  43. 43.  www.kidshealth.org …is invisible to the user FALLBACKS
  44. 44.  Another way to provide fallbacks is to offer alternates in the interface www.pbs.org/wgbh/nova/sciencenow/ FALLBACKS
  45. 45.  Providing alternate formats accommodates technology preferences and constraints www.pbs.org/wgbh/nova/sciencenow/ FALLBACKS
  46. 46.  Audio-based content that is not accessible to users who cannot hear… www.pbs.org/wgbh/nova/sciencenow/ FALLBACKS
  47. 47.  …can be supplied via captions www.pbs.org/wgbh/nova/sciencenow/ FALLBACKS
  48. 48.  …can be supplied via captions www.pbs.org/wgbh/nova/sciencenow/ FALLBACKS
  49. 49.  …as well as a transcript www.pbs.org/wgbh/nova/sciencenow/ FALLBACKS
  50. 50. Guidelines  Universal design Principles of Universal Design Center for Universal Design North Carolina State University  Usability Jakob Neilson, useit.com Steve Krug, Don’t Make Me Think  Universal usability Sarah Horton, Access by Design Designing Accessible WebsitesGUIDELINES slide 50 of 64

×