Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Access 2014: We’re All Disabled! Part 2: Building Accessible (Web) Services with Universal Design

Access 2014: We’re All Disabled! Part 2: Building Accessible (Web) Services with Universal Design

This was presented at Access 2014 Conference. Full write-up is available here: http://wp.me/pHQ83-U9
Abstract: We’re building and improving tools and services all the time, but do you only develop for the “average” user? We all use “assistive” technology accessing information in a multitude of ways with different platforms, devices, etc. Let’s focus on developing and providing web services that are more accessible not only for those with disabilities, but for everyone.The goal is not only to change our thinking, but also to look at the practical side of things in how we might implement an accessible web service using the open source tools and packages, or within the confines of the software we use.

Cynthia "Arty" Ng

October 01, 2014

More Decks by Cynthia "Arty" Ng

Other Decks in Technology



    UNIVERSAL DESIGN October 1, 2014 Cynthia Ng @TheRealArty
  2. 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
  3. [It is] well known among web developers that websites that

    are accessible are also much more usable for everyone. - Mohammad Eyadat and Jeff Lew Eyadat, M., & Lew, J. (2011). Web Accessibility Factor a Key Focus for Serving Students. Review of Business Research, 11(2), 80.
  4. BENEFITS reflect institutional mission, leadership, and values serve all users

    make sound fiscal policy add value to the institution
  5. BENEFITS SIMPLIFIED findable accessible usable shareable efficient collaborative 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
  6. Avoid the peanut butter approach. - Sarah Horton & Whitney

    Quesenbery Horton, S. & Quesenbery, W. (2014). A Web for Everyone: Designing Accessible User Experiences. Rosenfeld Media.
  7. It just won't work to build a complete system and

    then, in the final stages of development, spread the interface over it like peanut butter. - Clayton Lewis & John Rieman Lewis, C. & Rieman, J. (1994). Task-Centered User Interface Design: A Practical Introduction. http://hcibib.org/tcuid/
  8. shrosa814. (2010). Tale of Squirrel and Peanut Butter. With Permission

    from Owner. https://www.flickr.com/photos/shicksba272214/5159576009
  9. Accessibility often gets pigeon-holed as simply making sure there are

    no barriers to access for screen readers or other assistive technology, without regard to usability. - Whitney Quesenbery @whitneyq Quesenbery, W. (2009). Usable Accessibility: Making Web Sites Work Well for People with Disabilities. UX Matters. http://www.uxmatters.com/mt/archives/2009/02/usable- accessibility-making-web-sites-work-well-for-people-with-disabilities.php
  10. Anonymous. (2014). She loves the warm air coming out of

    the laptop. http://imgur.com/gallery/S3JnsF1
  11. All Technology is Assistive Technology. - Sara Hendren @ablerism Hendron,

    S. (2013). All Technology is Assistive Technology: 6 dispositions for designers on disability. https://medium.com/thoughtful-design/a8b9a581eb62
  12. UNIVERSAL DESIGN Universal design is the design of products and

    environments to be usable by all people, to the greatest extent possible, without the need for adaptation or specialized design. - Ron Mace Mace, R. (1998). Universal design in housing. Assistive Technology, 10(1), 21-28.
  13. Whereas [universal design] is a design methodology (similar to user-centered

    design), [accessibility] is its most commonly associated metric. - Andrew Maler Maler, A. (2013). The Complete Beginner’s Guide to Universal Design. UX Booth http://www.uxbooth.com/articles/the-complete-beginners-guide-to-universal-design/
  14. It is important for designers to formulate and adhere to

    usable design processes and guidelines throughout the entire cycle of development so that the product or service is accessible and universally usable for all. - Constantine Stephanidis Stephanidis, C. (2009). Universal access and design for all in the evolving information society. In C. Stephanidis (ed.), The Universal Access Handbook (1–11). Boca Raton: CRC Press.
  15. CHALLENGES technological variety user diversity bridging the knowledge gap 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
  16. TASK ANALYSIS Reidsma, M. (2013). Slide 38. Websites are for

    People. http://matthew.reidsrow.com/articles/29CC BY-NC-SA 3.0
  17. GOOD PRACTICES well structured code style guides e.g. pattern libraries

    e.g. polyfills and other helper libraries e.g. APIs e.g. testing frameworks or set of evaluation tools e.g. good documentation e.g. Normalize CSS UI Pattern Library by GVSU picturefill SFU LIbrary API QuailJS Phabricator
  18. SKIP LINKS <body> <a class="hide-text" href="#main">Skip to Main Content</a> <nav

    role="navigation"> // Menu </nav> <div id="main" role="main"> // Content </div> </body> Schofield, M. (2014). ARIA for the Spec Impaired. http://ns4lib.com/aria-primer/
  19. DESCRIPTIVE VIDEO EXAMPLE Electrox3d. (2011). Star Wars for Blind People

    (Blu-ray audio track): description of a Jawa shooting R2!. http://www.youtube.com/watch?v=PCZqKxQME6o
  20. MrShuffleupagus. (2014). This is a picture I took of a

    friend's dog, Spike, and the face he makes whenever he's confused. http://imgur.com/gallery/9iGSCj7
  21. TOP 10 ACADEMIC LIBRARY WEBSITES 6 / 10 have carousel

    5 / 6 autoplay Singley, E. (2013). Top 10 Academic Library Websites. http://emilysingley.net/top-10-academic-library-websites-2013/
  22. TOP 20 PUBLIC LIBRARY WEBSITES 18 / 20 had carousel

    17 / 18 autoplay Anderson, M. (2013). 20 Great Public Library Websites. http://www.mattanderson.org/blog/2013/02/11/20-great-public-library-websites/
  23. GUIDELINES FOR YOUR CONTENT CREATORS 1. Be clear and concise

    2. Use headers and tables properly 3. Use descriptive links 4. Describe images if needed 5. Make and choose videos with captions, and add a link if you embed them
  24. MrShuffleupagus. (2014). This is a picture I took of a

    friend's dog, Spike, and the face he makes whenever he's confused. http://www.4syllables.com.au/2010/12/text- alternatives-decision-tree/
  25. Until people find themselves in a situation where they are

    disabled due to their surroundings, they cannot fully appreciate how the built and virtual environments can throw obstacles in their paths – and indeed, profoundly affect their quality of life. - City of Calgary City of Calgary. (2010). Universal Design Handbook. http://www.calgary.ca/CSPS/CNS/Pages/Publications-guides-and-directories/Universal-Design-Handbook.aspx
  26. One Thumb, One Eyeball - Luke Wroblewski @lukew Wroblewski, L.

    (2012). Testing One Thumb, One Eyeball Mobile Use. http://www.lukew.com/ff/entry.asp?1664
  27. We’re all disabled - Lennard Davis @lendavis Davis, L. J.

    (2013). The End of Identity Politics: On Disability as an Unstable Category. In L. J. Davis (ed.), The Disability Studies Reader (263-277). New York : Routledge.