Accessibility Primer Version 2 - UXfrkln meetup
0 likes104 views
This document serves as a primer on web accessibility, outlining its importance for individuals with various disabilities and detailing laws such as the ADA and Section 508 that mandate accessibility. It provides resources for further learning, including guidelines for contrast ratios, color blindness considerations, assistive technologies, and techniques for improving web design for accessibility. The creator emphasizes the need for awareness and tools to track accessibility issues while noting that tracking assistive technology usage poses privacy challenges.
Accessibility Primer Version 2 - UXfrkln meetup
- 1. Accessibility a Primer UX.Frkln meetup : Nov 6, 2019 DISCLAIMER: The creator of this content is NOT a licensed accessibility professional, merely a UXer with some experience and knowledge of accessibility and a desire to share and light fires of knowledge and passion.
- 2. What is Accessibility? Web accessibility is the inclusive practice of ensuring there are no barriers that prevent interaction with, or access to, websites on the World Wide Web by people with physical disabilities, situational disabilities, and socio-economic restrictions on bandwidth and speed. (from https://en.wikipedia.org/wiki/ Web_accessibility ) WCAG overview https://www.w3.org/WAI/standards-guidelines/wcag/ Plethora of knowledge at Web AIM https://webaim.org/
- 3. Useful Links Web Accessibility course on Udacity https://www.udacity.com/course/web-accessibility--ud891 Accessibility for Teams https://accessibility.digital.gov 1 hr video on how people with disabilities use the web (virtual panel) https://accessibility.deque.com/on-demand-how-persons-with- disabilities-use-the-web W3 Tutorials https://www.w3.org/WAI/tutorials/
- 4. What Do the Laws Say and Mean? From http://www.ldonline.org/article/35384/ Americans with Disabilities Act (ADA) The ADA prohibits discrimination on the basis of disability in employment, state and local government, public accommodations, commercial facilities, transportation, and telecommunications. Section 508 of the Rehabilitation Act Section 508 of the Rehabilitation Act requires that all electronic and information technologies developed and used by any Federal government agency must be accessible to people with disabilities. This includes websites, video and audio tapes, electronic books, televised programs, and other such media. Individuals with disabilities may still have to use special hardware and/or software to access the resources. Section 508 does not apply to the private sector or to organizations that receive Federal funds. Assistive Technology Act of 1998 The Assistive Technology Act, also known as the "Tech Act" provides funds to states to support three types of programs: • the establishment of assistive technology (AT) demonstration centers, information centers, equipment loan facilities, referral services, and other consumer-oriented programs; • protection and advocacy services to help people with disabilities and their families, as they attempt to access the services for which they are eligible; • Federal/state programs to provide low interest loans and other alternative financing options to help people with disabilities purchase needed assistive technology.
- 5. Color Contrast For proper legibility the contrast between foreground and background should be 4.5:1 or higher. Generic web-based contrast checker https://webaim.org/resources/contrastchecker/ MacOS app https://usecontrast.com/
- 6. Color Blindness There are MANY forms of color blindness. Do not use color alone to indicate status (such as green for up/good and red for down/bad). Use words and/or differentiating icons. http://www.colourblindawareness.org/colour-blindness/types-of- colour-blindness/ https://www.color-blindness.com/coblis-color-blindness-simulator/
- 7. Skip to Main Content Users using assistive technology like a screen reader do not always need to hear the navigation of a site before getting to the page content. Give them an option to skip over listening to it go straight to the main content https://webaim.org/techniques/skipnav/
- 8. Test Your Website (few free trials) Put your URL in and get a high level readout of accessibility issues. https://webaccessibility.com/
- 9. Screen Reader Samples If you’ve never heard a screen reader (like Jaws) read content, its enlightening (and fast!) https://www.youtube.com/watch?v=dEbl5jvLKGQ https://www.youtube.com/watch?v=q_ATY9gimOM
- 10. Information on Disabilities • Attention Deficit Hyperactivity Disorder (ADHD) • Learning Disabilities • Mobility Disabilities • Medical Disabilities • Psychiatric Disabilities • Traumatic Brain Injury (TBI) and Post-Traumatic Stress Disorder (PTSD) • Visual Impairments • Deaf and Hard of Hearing • Concussion • Autism Spectrum Disorders https://www.mightybytes.com/blog/how-many-users-with-disabilities-on- site/ https://www.rochester.edu/college/disability/faculty/common- disabilities.html
- 12. Heading Tags Headings communicate the organization of the content on the page. Web browsers, plug-ins, and assistive technologies can use them to provide in-page navigation. https://www.w3.org/WAI/tutorials/page-structure/headings/
- 13. Alt Tags ALT Tags are invisible descriptions of images which are read aloud to blind users on a screen reader. Adding ALT text allows authors to include images, but still provide the content in an alternative text based format. See example below for what a screen reader experiences when no ALT Text is used. https://accessibility.psu.edu/images/alttext/ Charles Hall says it well: saying nothing is a barrier saying something is access saying it well is quality
- 14. Select Boxes Don’t use select boxes as jump nav or to refresh a page view. A screen reader reads all the options and the onChange event fires, so it is very jarring if you just want to hear the options.. Have an ‘activate’ button outside the select box to do the action.
- 15. Questions to Research… Is there a way to implicitly know (from Google Analytics or similar) how often a screen reader accesses your app/site? What about keyboard only or other assistive technologies? Usually they are not recorded in the browser User Agent data. Update (Nov 11, 2019): A designer at HCA said an Accessibility expert told him: Due to privacy and protection laws, you cannot implicitly track the use of assistive technology, such as screen readers.
- 16. Thanks! Accessibility Primer UX.Frkln For info on future meetups, contact: UX.Frkln@gmail.com