Accessibility is About Your Users

This was presented as a guest lecture at Langara College for the Fall 2015, LIBR 2411: Library Technologies and Information Management course in the Library Technician program. The presentation covers accessibility, web accessibility, and universal design, focusing at times on the library context.

Transcript

1. ACCESSIBILITY IS ABOUT
   YOUR USERS
   October 9, 2015
   Cynthia Ng
   @TheRealArty
   

   View Slide

2. INTRODUCTION
   

   View Slide

3. De Clerck, Stefaan. (2015). Sleeping beauty. https://500px.com/photo/121896277/sleeping-beauty-by-stefaan-de-clerckCC BY-NC-SA 3.0
   

   View Slide

4. 70 slides in 20 minutes
   = 3.5 / minute
   

   View Slide

5. DEFINITION
   

   View Slide

6. Web accessibility means that people
   with disabilities can use the Web.
   - W3C Web Accessibility Initiative (WAI)
   W3C Web Accessibility Initiative. (2005). What is Web Accessibility. Introduction to Web Accessibility. http://www.w3.org/WAI/intro/accessibility.php
   

   View Slide

7. Snape, John. (2011). See No Evil, Hear No Evil, Speak No Evil. https://commons.wikimedia.org/wiki/File:See_No_Evil,_Hear_No_Evil,_Speak_No_Evil.jpgCC BY-SA 3.0
   

   View Slide

8. TYPES OF DISABILITIES
   visual
   auditory
   physical/motor
   touch
   learning
   

   View Slide

9. NUMBERS
   OR WHY SHOULD YOU CARE?
   

   View Slide

10. Statistics Canada. 2013. Statistics Canada on Twitter. https://twitter.com/StatCan_eng/statuses/407940135729508352
    Approximate number based on: World Bank. 2012. Population ages 15-64 (% of total). .
    http://data.worldbank.org/indicator/SP.POP.1564.TO.ZS
    

    View Slide

11. Brault, Matthew W. (2012). Americans With Disabilities: 2010 Household Economic Studies. http://www.census.gov/prod/2012pubs/p70-131.pdf
    

    View Slide

12. DISABILITY > MINORITY*
    * Based on 2006 Canadian census , and the
    percentage of total population ages 15-64 with a disability percentage of total population ages 15-64 of minorities.
    * Based on 2010 US census , and the
    percentage of total population with a disability percentage of total population of minorities.
    

    View Slide

13. POLICY & LEGISLATION
    Canada: Federal Departments & Ontario: Web Content
    Accessibility Guidelines (WCAG)
    USA: Americans with Disabilities Act; Federal Departments:
    Rehabilitation Act: Section 508
    

    View Slide

14. Lack of statutes or federal laws should
    not exempt [us] from providing
    equivalent access to all; it should drive
    [us] toward it.
    - Camilla Fulton
    Fulton, C. (2011). Web Accessibility, Libraries, and the Law. Information Technology and Libraries.. http://www.w3.org/WAI/intro/accessibility.php
    

    View Slide

15. GETTING BUY-IN
    

    View Slide

16. BENEFITS
    reflect institutional mission, leadership, and values
    serve all users
    make sound fiscal policy
    add value to the institution
    Sources: Maler, A. (2013). The Complete Beginner’s Guide to Universal Design. UX Booth. and
    Rowland, C., Mariger, H., Siegel, P. M., & Whiting, J. (2010). Universal Design for the Digital Environment: Transforming the Institution. EDUCAUSE Review*, 45(6).
    http://www.uxbooth.com/articles/the-complete-beginners-guide-to-universal-design/
    http://www.educause.edu/ero/article/universal-design-digital-environment-transforming-institution
    

    View Slide

17. BENEFITS SIMPLIFIED
    findable
    accessible
    usable
    shareable
    efficient
    collaborative
    

    View Slide

18. Source: Sutton, Marcy. (2015). .
    US Department of the Interior Showcasing Accessible Websites
    

    View Slide

19. DESIGNING FOR ASSISTIVE TECHNOLOGY
    

    View Slide

20. DEFINING ASSISTIVE TECHNOLOGY
    an umbrella term that includes [...]
    devices for people with disabilities [...]
    by enabling people to perform tasks
    that they were formerly unable to
    accomplish, or had great difficulty
    accomplishing, by providing
    enhancements to, or changing methods
    of interacting with, the technology
    needed to accomplish such tasks.
    - Wikipedia
    Multiple authors. (2015). Assistive Technology.Wikipedia.
    

    View Slide

21. Anonymous. (2013). Untitled.As permitted by TOS
    

    View Slide

22. CONSIDERING ASSISTIVE TECHNOLOGY
    screen readers
    text-to-speech
    screen magnifiers
    joysticks
    

    View Slide

23. From: Gibson, Anne. (2015). Reframing Accessibility for the Web.With permission from author
    

    View Slide

24. Fitzgerald, Michael. (2008). Computer Budgie II.CC BY-NC-SA 2.0
    

    View Slide

25. Fuster, Anna. (2011). perimer l'un hi dezcansa a sobre...CC BY-NC-ND 2.0
    

    View Slide

26. All Technology is Assistive Technology.
    - Sara Hendren @ablerism
    Hendron, S. (2013). All Technology is Assistive Technology: 6 dispositions for designers on disability.
    

    View Slide

27. We need to change the way we talk
    about accessibility. … We can reframe
    accessibility in terms of what we
    provide, not what other people lack.
    - Anne Gibson @kirabug
    Gibson, Anne. (2015). Reframing Accessibility for the Web.
    

    View Slide

28. UNIVERSAL DESIGN
    

    View Slide

29. marziarh. (2012). Robson Square. https://www.flickr.com/photos/maziarh/7216119402/CC BY-NC-ND 2.0
    

    View Slide

30. UNIVERSAL DESIGN FOR THE WEB
    

    View Slide

31. UNIVERSAL WEB DESIGN PRINCIPLES IN SHORT
    solid
    clear
    helpful
    usable
    accessible
    easy to understand
    designed with people in mind first
    Quesenbery, W. (2014). . O'Reilly.
    A Web for Everyone: Accessibility as a Design Challenge
    

    View Slide

32. UNIVERSAL DESIGN IN PRACTICE
    

    View Slide

33. MAJOR CHALLENGES
    Shneiderman, B., & Hochheiser, H. (2001). Universal usability as a stimulus to advanced interface design. Behaviour & Information Technology, 20(5), 367-376.
    doi:10.1080/01449290110083602
    

    View Slide

34. animoca. (2012). All the Myriad Androids. http://www.animoca.com/en/2012/05/all-the-myriad-androids/CC-BY-ND 3.0
    

    View Slide

35. Habib, Fady. (2005). .
    Unity in Diversity CC BY-NC-SA 3.0
    

    View Slide

36. Trott, Nic. (2012). .
    Clifton Suspension Bridge CC BY 2.0
    

    View Slide

37. APPROACHES
    minimal load time
    progressive enhancement
    mobile first
    responsive design
    

    View Slide

38. MINIMAL LOAD TIME
    average website = 2.2 MB = 6 sec
    . (2015). .
    HTTP Archive Average Bytes per Page by Content Type
    . (2015). .
    Keynote Performance Index: Mobile Commerce (Retail) – US
    

    View Slide

39. [Over 50% of mobile users] will wait
    only five seconds or less for a mobile site
    to load.
    Compuware Corporation. (2011). The new (or only) way to connect with customers. http://www.compuware.com/content/dam/compuware/professional-services/white-
    papers/The%20New%20or%20Only%20Way%20To%20Connect%20With%20Customers.pdf
    

    View Slide

40. Two seconds may not seem like a long
    time, but consider that users can spot—
    and are bothered by—performance
    delays as short as 300 milliseconds.
    - Scott Jehl @scottjehl
    Jehl, Scott. (2014). .
    Planning for Performance
    

    View Slide

41. PROGESSIVE ENHANCEMENT
    Worry about the less capable first.
    - @Swwweet
    Usobiaga, J. (2013). Slide 37. Mobile First: As difficult as doing things right. https://speakerdeck.com/swwweet/mobile-first-as-difficult-as-doing-things-right?slide=37
    

    View Slide

42. MOBILE FIRST
    Mobile forces you to focus.
    - Luke Wroblewski @lukew
    Wroblewski, L. (2009). Mobile First. http://www.lukew.com/ff/entry.asp?933
    

    View Slide

43. RESPONSIVE DESIGN
    

    View Slide

44. Demo
    Resources:
    Responsive web design and libraries by Lisa Kurt
    List of HigherEd Responsive Sites
    

    View Slide

45. "SPECIAL" CONSIDERATIONS
    

    View Slide

46. COLOUR CONTRAST
    

    View Slide

47. KEYBOARD ACCESSIBILITY
    Demo
    

    View Slide

48. FORMS
    Form Elements and Accessibility
    

    View Slide

49. SKIP LINKS
    

    View Slide

50. MEDIA
    Images: alt=""
    Audio: transcript
    Video: transcript
    Video: captions
    Video: descriptive audio
    

    View Slide

51. TOP 10 ACADEMIC LIBRARY WEBSITES
    6 / 10 have carousel
    5 / 6 autoplay
    Singley, E. (2014). .
    Top 10 Academic Library Websites
    

    View Slide

52. TOP 10 OF 20 GREAT PUBLIC LIBRARY
    WEBSITES
    9 / 10 have carousel
    9 / 9 autoplay
    Anderson, M. (2013). 20 Great Public Library Websites. http://www.mattanderson.org/blog/2013/02/11/20-great-public-library-websites/
    

    View Slide

53. DOCUMENTS
    WebAIM. (2014). Microsoft Word.
    © WebAIM. Used under full credit, at no cost allowance as per the .
    http://webaim.org/techniques/word/
    WebAIM Copyright & Terms of Use
    WebAIM. (2014). PowerPoint Accessibility.
    © WebAIM. Used under full credit, at no cost allowance as per the .
    http://webaim.org/techniques/powerpoint/
    WebAIM Copyright & Terms of Use
    

    View Slide

54. TESTING AND ASSESSMENT
    EVALUATION TOOLS
    (bookmarklet)
    (Firefox plugin)
    For more,
    HTML Codesniffer
    WCAG Contrast Checker
    WAVE Toolbar
    W3C Web Accessibility Tools list
    SIMULATION TOOLS
    Fangs
    VisCheck
    Colorblind Web Page Filter
    

    View Slide

55. Developer toolbars, semantic markup
    and automated testing tools can only
    get you about 30% of the way towards
    Web Accessibility goals.
    - Denis Boudreau @dboudreau & Matt Feldman
    @hlpsom1
    Boudreau, Denis & Feldman, Matt. (2015). Slide 13 of .
    Integrating Accessibility into the Project Lifecycle - Lessons Learned
    

    View Slide

56. Ask Your Users
    

    View Slide

57. TRAINING AND DOCUMENTATION
    

    View Slide

58. We need to make simple, readable,
    effective content.
    - Anne Gibson @kirabug
    Gibson, Anne. (2014). .
    An Alphabet of Accessibility Issues
    

    View Slide

59. GUIDELINES FOR CONTENT CREATORS
    1. Use headers properly
    2. Use descriptive links
    3. Use tables for data, not layout
    4. Describe images if needed
    5. If you embed audio/video, add a link to it too
    

    View Slide

60. Alexander, Dey. (2014). .
    Text alternatives for images: a decision tree
    

    View Slide

61. Other Guideline Examples and Resources
    by Adina Mulliken
    LibGuides Presentation: Accessibility
    Facilitating Accessible Instruction and Resources (University
    of Victoria)
    United Nations Accessibility Guidelines: Content
    

    View Slide

62. MORE RESOURCES
    General Resources
    - a lot of great articles on focused on
    accessibility and HTML/CSS
    - lots of quick tips
    (out of date, currently being revised)
    by CLA
    by OCUL
    WCAG Quick Reference
    The Paciello Group Blog
    The Accessibility Project
    Canadian Guidelines on Library and Information Services for
    People with Disabilities
    Accessibility Information Toolkit for Libraries
    

    View Slide

63. EVEN MORE RESOURCES
    Lists of Accessibility Resources:
    out of date but still a
    number of useful resources
    Accessible Technology: Tools & resources by the University of
    Washington
    Tools and Resources for Accessible Web Design by Texas
    School for the Blind and Visually Impaired
    Code4LibBC Accessibility Breakout Group Notes
    

    View Slide

64. TAKE AWAY
    

    View Slide

65. Websites are software that help people
    accomplish their goals, regardless of the
    hardware and software combination,
    regardless of the shapes and forms of
    their people. That is accessibility.
    - Anne Gibson @kirabug
    Gibson, Anne. (2015). Reframing Accessibility for the Web.
    

    View Slide

66. THANKS!
    CONTACT
    Cynthia Ng
    @TheRealArty
    about.me/cynthiang
    

    View Slide