AccessibleWebScott WilliamsOffice of Institutional Equityswims@umich.edu
Disabilities and the web Visual: blindness, low-vision, color-blindness Hearing: partial to total deafness Motor: inabi...
1in 5 people have a disability  People with disabilities in the U.S: 60 million  People age 15 and older having difficul...
A diverse population Cognitive disabilities   Greater number than physical and perceptual    disabilities combined   Ad...
Legal Rehabilitation Act of 1973 and Americans with  Disabilities Act of 1991, both of which prohibit  colleges and unive...
What is web accessibility? Making the web accessible for the widest  possible audience Inseparable from usability, mobil...
WCAG 2.0 W3C Web Content Accessibility Guidelines De facto standard world-wide. Cited in U.S case law.  Adopted by gover...
Perceivable Provide text alternatives for images and form    elements   Provide captions and transcripts for video and  ...
Operable All functionality is available from the keyboard! Users have control over timing and limits Do not cause seizu...
Understandable Economical and plain use of language Text supplemented with illustrations, videos, and  other formats whe...
Robust Functional across various technologies Syntax errors that don’t affect visual presentation  may hamper assistive ...
Biggest barriers to AT users CAPTCHA – images, presenting         Screens or parts of screens that   text used to verify...
VoiceOver Tutorial ctrl + opt + cmd + f8 (3 keys to the left of the  space bar plus f8 key) Or:   Cmd + f5   Ctrl + op...
VO commands CONTROL+OPTION+U -- start web item rotor to  interact with lists of headings, links, etc. CONTROL+OPTION+SPA...
VO Commands (cont’d) CONTROL+OPTION+DOWN_ARROW -- read down  column CONTROL+OPTION+UP_ARROW -- read up column CONTROL+O...
Best Practices Make sure your web interface is POUR:  http://umich.edu/webaccess/best/quickguide.html Testing with Voice...
Accessibility Resources For assistance, email: swims@umich.edu U-M: http://umich.edu/webaccess/ Gmail and Calendar: htt...
Questions?
ES-120507
Upcoming SlideShare
Loading in …5
×

ES-120507

346 views
305 views

Published on

Enriching Scholarship - Accessibility testing with Mac VoiceOver

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

  • Be the first to like this

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

No notes for slide
  • Not just blind and deaf …Avoid motion on screen.Keyboard accessible and don’t make fine motor control necessary.
  • In general terms …The beautyof the standards is that you don’t have to keep in mind every conceivable disability when you are coding your site.
  • This is a departure from WCAG 1.0, which references specific technologies, such as javascript
  • Captions, screen reader, Braille display
  • Chunking appropriately, avoiding jargon or institutional languageDifferent learning modalities, visual versus verbalDon’t changenav and layout structureCareful with AJAX-y elements, pop-upsConsiderate form validation; especially important for ITS
  • ES-120507

    1. 1. AccessibleWebScott WilliamsOffice of Institutional Equityswims@umich.edu
    2. 2. Disabilities and the web Visual: blindness, low-vision, color-blindness Hearing: partial to total deafness Motor: inability to use a mouse, slow response time, limited fine motor control Cognitive: Learning disabilities, distractibility, dyslexia, inability to remember or focus on large amounts of information
    3. 3. 1in 5 people have a disability  People with disabilities in the U.S: 60 million  People age 15 and older having difficulty hearing a normal conversation: 8 million  People who cannot hear at all: 1 million  People age 15 and older having difficulty reading ordinary newsprint (even with glasses): 8 million  Number of people being completely unable to see: 2 million
    4. 4. A diverse population Cognitive disabilities  Greater number than physical and perceptual disabilities combined  Adults with ADD/ADHD: 16 million  38% of soldiers, 31% of Marines and 49% of National Guard members returning from combat report psychological conditions such as TBI and PTSD Mobility issues—8 million Americans have difficulty using their arms or hands 11 million people 6 and older need assistance with everyday activities
    5. 5. Legal Rehabilitation Act of 1973 and Americans with Disabilities Act of 1991, both of which prohibit colleges and universities from discriminating against students, faculty, and staff with disabilities Users with disabilities must have the full and equal enjoyment of all goods, programs, and activities If users with disabilities are forced to use separate access, it must be equally effective
    6. 6. What is web accessibility? Making the web accessible for the widest possible audience Inseparable from usability, mobile, and SEO: improve one and you improve the others Best way to accomplish accessibility? Adherence to standards  The beauty of standards: you don’t have to code for every conceivable disability when you are producing your site.
    7. 7. WCAG 2.0 W3C Web Content Accessibility Guidelines De facto standard world-wide. Cited in U.S case law. Adopted by governments. Future basis for ADA and Section 508 compliance. WCAG 2.0 is principle-, not technology-based The four principles (POUR):  Perceivable  Operable  Understandable  Robust
    8. 8. Perceivable Provide text alternatives for images and form elements Provide captions and transcripts for video and audio Use correct semantic markup so content can be presented in different ways Make it easier for users to see content by using good color contrast Avoid movement and distractions on page
    9. 9. Operable All functionality is available from the keyboard! Users have control over timing and limits Do not cause seizures (don’t flash content) Provide ways to help users navigate, find content, and determine where they are
    10. 10. Understandable Economical and plain use of language Text supplemented with illustrations, videos, and other formats where appropriate (i.e., support various learning modalities) Navigation, information structure are discernable and consistent Make pages operate in predictable ways Help users avoid and correct mistakes
    11. 11. Robust Functional across various technologies Syntax errors that don’t affect visual presentation may hamper assistive technology and accessibility evaluation tools Adhering to W3C standards ensures future compatibility Validate your code at validator.w3c.org
    12. 12. Biggest barriers to AT users CAPTCHA – images, presenting  Screens or parts of screens that text used to verify that you are change unexpectedly a human user (&reCAPTCHA)  Missing or improper headings Inaccessible Flash content  Too many links or navigation Cryptic Links or buttons items Images with missing or improper  Complex data tables descriptions (alt text)  Lack of "skip to main content" Complex or difficult forms or "skip navigation" links Lack of keyboard accessibility  Inaccessible or missing search functionality
    13. 13. VoiceOver Tutorial ctrl + opt + cmd + f8 (3 keys to the left of the space bar plus f8 key) Or:  Cmd + f5  Ctrl + opt + h (help)  Arrow down to tutorial in menu Web tutorial: http://goo.gl/so6bx
    14. 14. VO commands CONTROL+OPTION+U -- start web item rotor to interact with lists of headings, links, etc. CONTROL+OPTION+SPACEBAR -- select an option CONTROL+OPTION+SHIFT+UP_ARROW -- stop interacting with object CONTROL+OPTION+SHIFT+DOWN_ARROW -- interact with object CONTROL+OPTION+RIGHT_ARROW -- next item CONTROL+OPTION+LEFT_ARROW -- previous item
    15. 15. VO Commands (cont’d) CONTROL+OPTION+DOWN_ARROW -- read down column CONTROL+OPTION+UP_ARROW -- read up column CONTROL+OPTION+R -- read entire row CONTROL+OPTION+C -- read column header CONTROL+OPTION+H -- help (tutorial is help item) CONTROL -- toggles reading/stopping ESCAPE -- leave menu
    16. 16. Best Practices Make sure your web interface is POUR: http://umich.edu/webaccess/best/quickguide.html Testing with VoiceOver: http://.umich.edu/webaccess/eval/voiceover.html Make sure your MS Word and PDF files are accessible: http://umich.edu/webaccess/best/pdf.html Caption your videos. Use SSD or other resources: http://umich.edu/webaccess/best/caption.html
    17. 17. Accessibility Resources For assistance, email: swims@umich.edu U-M: http://umich.edu/webaccess/ Gmail and Calendar: http://goo.gl/YolQn Google Docs: http://goo.gl/UOyFT WebAIM: http://webaim.org Online accessibility checkers:  http://www.achecker.ca/  http://wave.webaim.org/
    18. 18. Questions?

    ×