Your SlideShare is downloading. ×
0
Web Accessibility Basic Testing Using NVDA - Confoo 2015 (dboudreau)
Web Accessibility Basic Testing Using NVDA - Confoo 2015 (dboudreau)
Web Accessibility Basic Testing Using NVDA - Confoo 2015 (dboudreau)
Web Accessibility Basic Testing Using NVDA - Confoo 2015 (dboudreau)
Web Accessibility Basic Testing Using NVDA - Confoo 2015 (dboudreau)
Web Accessibility Basic Testing Using NVDA - Confoo 2015 (dboudreau)
Web Accessibility Basic Testing Using NVDA - Confoo 2015 (dboudreau)
Web Accessibility Basic Testing Using NVDA - Confoo 2015 (dboudreau)
Web Accessibility Basic Testing Using NVDA - Confoo 2015 (dboudreau)
Web Accessibility Basic Testing Using NVDA - Confoo 2015 (dboudreau)
Web Accessibility Basic Testing Using NVDA - Confoo 2015 (dboudreau)
Web Accessibility Basic Testing Using NVDA - Confoo 2015 (dboudreau)
Web Accessibility Basic Testing Using NVDA - Confoo 2015 (dboudreau)
Web Accessibility Basic Testing Using NVDA - Confoo 2015 (dboudreau)
Web Accessibility Basic Testing Using NVDA - Confoo 2015 (dboudreau)
Web Accessibility Basic Testing Using NVDA - Confoo 2015 (dboudreau)
Web Accessibility Basic Testing Using NVDA - Confoo 2015 (dboudreau)
Web Accessibility Basic Testing Using NVDA - Confoo 2015 (dboudreau)
Web Accessibility Basic Testing Using NVDA - Confoo 2015 (dboudreau)
Web Accessibility Basic Testing Using NVDA - Confoo 2015 (dboudreau)
Web Accessibility Basic Testing Using NVDA - Confoo 2015 (dboudreau)
Web Accessibility Basic Testing Using NVDA - Confoo 2015 (dboudreau)
Web Accessibility Basic Testing Using NVDA - Confoo 2015 (dboudreau)
Web Accessibility Basic Testing Using NVDA - Confoo 2015 (dboudreau)
Web Accessibility Basic Testing Using NVDA - Confoo 2015 (dboudreau)
Web Accessibility Basic Testing Using NVDA - Confoo 2015 (dboudreau)
Web Accessibility Basic Testing Using NVDA - Confoo 2015 (dboudreau)
Web Accessibility Basic Testing Using NVDA - Confoo 2015 (dboudreau)
Web Accessibility Basic Testing Using NVDA - Confoo 2015 (dboudreau)
Web Accessibility Basic Testing Using NVDA - Confoo 2015 (dboudreau)
Web Accessibility Basic Testing Using NVDA - Confoo 2015 (dboudreau)
Web Accessibility Basic Testing Using NVDA - Confoo 2015 (dboudreau)
Web Accessibility Basic Testing Using NVDA - Confoo 2015 (dboudreau)
Web Accessibility Basic Testing Using NVDA - Confoo 2015 (dboudreau)
Web Accessibility Basic Testing Using NVDA - Confoo 2015 (dboudreau)
Web Accessibility Basic Testing Using NVDA - Confoo 2015 (dboudreau)
Upcoming SlideShare
Loading in...5
×

Thanks for flagging this SlideShare!

Oops! An error has occurred.

×
Saving this for later? Get the SlideShare app to save on your phone or tablet. Read anywhere, anytime – even offline.
Text the download link to your phone
Standard text messaging rates apply

Web Accessibility Basic Testing Using NVDA - Confoo 2015 (dboudreau)

1,712

Published on

Accessibility testing using browser tools such as the Web Developer or the WAVE toolbars is already a daunting task; add screen reader testing requirements to the mix, and for most people, it soon …

Accessibility testing using browser tools such as the Web Developer or the WAVE toolbars is already a daunting task; add screen reader testing requirements to the mix, and for most people, it soon becomes way too complicated to even bother. This session is intended for anyone who does not consider himself or herself to be an accessibility expert, but yet needs to sometimes assess accessibility. In this session, we will be going over a series of techniques for testing the accessibility fundamentals of HTML using NVDA, an open source screen reader. No technical ninja skillz required! Join us if you are willing to discover 12 simple techniques in 30 quick minutes!

Published in: Internet
1 Comment
9 Likes
Statistics
Notes
No Downloads
Views
Total Views
1,712
On Slideshare
0
From Embeds
0
Number of Embeds
2
Actions
Shares
0
Downloads
8
Comments
1
Likes
9
Embeds 0
No embeds

Report content
Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
No notes for slide

Transcript

  • 1. Web Accessibility Basic Testing Using NVDA Confoo 2015 Hilton Montreal Bonaventure February 19th, 2015
  • 2. Denis Boudreau denis@simplyaccessible.com @dboudreau Web Accessibility Strategist Simply Accessible http://SAteach.es
  • 3. Content overview 1. Fundamental testing concepts 2. Screen reader accessibility testing 3. Wrapping up and questions
  • 4. What is the first thing you think about when thinking about testing for web accessibility?
  • 5. Accessibility testing Most people’s typical testing process Automated Manual Screen Reader 1 2 3
  • 6. 39 million people are blind 246 million people have low vision Visual impairment and blindness (WHO, 2014) http://www.who.int/mediacentre/factsheets/fs282/en/
  • 7. Pro Tip #1 Accessibility is not just about testing with screen readers!
  • 8. BlindnessCognitive Situational disabilities Chemo brain Color blindness Cystic fibrosis Gamer’s thumb Dyslexia Language barriers Photosensitive epilepsy Astigmatism Hard of hearing Lazy-Eyes Directionally challenged Poor hearing Age-related macular degeneration Multiple sclerosis Learning difficulties Visual impairments Tremors Muscle slowness Deuteranopia Monochromacy Dichromacy Anomalous trichromacy Protanopia Protanomaly Deuteranomaly Tritanopia Tritanomaly Deafness Achromatopsia Loss of fine muscle control Parkinson’s disease Muscular dystrophy Cerebral palsy Stroke Photoepileptic seizures Developmental disabilities Dyscalculia Attention deficit disorder Dementia Acquired brain injuries Neurodegenerative diseases Difficulty concentrating Dysgraphia Getting older Post-concussion syndrome Sleep deprivation Vertigo Illiteracy Amputation Cataracts Glaucoma Hearing Autism Motor Diabetic retinopathy Low vision Noise-induced hearing loss Aphasia Reading disordersVisual
  • 9. Pro Tip #2 Unplug your mouse and test using just your keyboard.
  • 10. Pro Tip #3 Run your user interfaces through the “straw test.”
  • 11. Happy with what you find? Then it’s NVDA time!
  • 12. Using NVDA – The Basics References • http://bit.ly/1fDhahU • http://bit.ly/1nOBkrH
  • 13. Let’s try it out, shall we?
  • 14. Meet NVDA
  • 15. Don’t Panic! / Speech Rate / Speech Viewer / Control Key
  • 16. nvaccess.org Sinking your teeth into NVDA!
  • 17. Pro Tip #4 Only use screen readers when all of your bases are covered.
  • 18. Today’s checkpoints 1. Page Titles 2. Default Language 3. Bypass Blocks 4. Page Regions 5. Section Headings 6. Link Purpose 7. Reading Order 8. Keyboard Navigation 9. Informative Images 10. Decorative Images 11. Data Tables 12. Forms
  • 19. a11yTips.org An ever growing resource to understand the many subtleties of Web accessibility.
  • 20. a11yTip #1 Provide descriptive titles for web pages http://bit.ly/1lKYkFE 2.4.2 (A) - Page Titles Pages have descriptive, informative and unique page titles.
  • 21. a11yTip #2 Identify the default language of the content http://bit.ly/1lKWPaG 3.1.1 (A) - Default Language The language of the page is identified using the HTML lang attribute.
  • 22. a11yTip #3 Provide a mechanism to skip content repeated across pages http://bit.ly/1fGcXKr 2.4.1 (A) - Bypass Blocks A method is provided to skip navigation and other elements that are repeated across pages.
  • 23. a11yTip #4 Use landmark roles to define page regions http://bit.ly/1ryGRRx 1.3.1 (A) - Page Regions WAI-ARIA landmarks are used to identify various sections of the page.
  • 24. a11yTip #5 Organize content using hierarchically nested headings http://bit.ly/1ia4Gc6 1.3.1 (A) – Headings Content is hierarchically structured using heading elements.
  • 25. a11yTip #6 Provide links that meaningfully describe their purpose http://bit.ly/1mJNDCm 2.4.4 (A) - Link Purpose The purpose of each link can be determined from the link text alone, or from the link text and its context.
  • 26. a11yTip #7 Organize content in a sequential reading order that remains logical http://bit.ly/1rPdEkF 1.3.2 (A) - Reading Order The reading and navigation order (determined by code order) is logical and intuitive.
  • 27. a11yTip #8 Ensure pages can be fully controlled without a mouse http://bit.ly/Sknpgr 2.1.1 (A) - Keyboard Navigation Page functionalities are available using the keyboard.
  • 28. a11yTip #9 Provide alt attributes for active images http://bit.ly/1q0OVOJ 1.1.1 (A) - Active and Informative Images Static and linked images that convey information have descriptive alternative text that serves the same purpose and presents the same information as the image.
  • 29. a11yTip #10 Make decorative images invisible to assistive technologies http://bit.ly/1fGdj3A 1.1.1 (A) - Decorative Images Images that do not convey content, are decorative, or with content that is already conveyed in text are given null alternative text.
  • 30. a11yTip #11 Structure tabular information using table markup http://bit.ly/1kvnzYG 1.3.1 (A) - Data Tables Data cells are explicitly associated with header cells for data tables.
  • 31. a11yTip #12 Associate text labels with form controls using the LABEL element http://bit.ly/Vr03GH 1.3.1 (A) - Forms Association Text labels are programmatically associated with form controls using the LABEL element with matching values on the for and ID attributes.
  • 32. Pro Tip #5 Involve real end users with various disabilities!
  • 33. Web accessibility is not rocket science… it’s just inclusive design!
  • 34. Web accessibility is not rocket science… it’s just mindful testing!
  • 35. Merci beaucoup! Denis Boudreau Web Accessibility Strategist Simply Accessible denis@simplyaccessible.com @dboudreau
  • 36. Photo Credits All rights belong to their respective owners. http://i.huffpost.com/gen/1760949/thumbs/o-BALANCE-SCALE-facebook.jpg http://foto-ruta.com/wp-content/uploads/2012/01/FR_step5.jpg http://www.bodybiz.nl/wp-content/uploads/2013/06/5redenenen.jpg http://www.vibrantnation.com/wp-content/uploads/blah-blah.jpg http://kpumc.org/wp-content/uploads/2014/01/Angry-Woman.jpg http://hemlocktime.files.wordpress.com/2014/03/4084963522_f50fc5ed37_b.jpg

×