accessibility testing-gyani and siddhanth
DESCRIPTION
TRANSCRIPT
![Page 1: Accessibility testing-Gyani and Siddhanth](https://reader033.vdocuments.net/reader033/viewer/2022051412/54d12ef54a795988238b45b4/html5/thumbnails/1.jpg)
Web Accessibility TestingBy Siddhant Chothe
![Page 2: Accessibility testing-Gyani and Siddhanth](https://reader033.vdocuments.net/reader033/viewer/2022051412/54d12ef54a795988238b45b4/html5/thumbnails/2.jpg)
I thought I’m here for
![Page 3: Accessibility testing-Gyani and Siddhanth](https://reader033.vdocuments.net/reader033/viewer/2022051412/54d12ef54a795988238b45b4/html5/thumbnails/3.jpg)
Then closer look at spelling indicated
![Page 4: Accessibility testing-Gyani and Siddhanth](https://reader033.vdocuments.net/reader033/viewer/2022051412/54d12ef54a795988238b45b4/html5/thumbnails/4.jpg)
Contents
• Assistive Technologies• Demonstration of screen reader on the web• Guidelines and Laws• Accessibility Testing (automated and manual)
![Page 5: Accessibility testing-Gyani and Siddhanth](https://reader033.vdocuments.net/reader033/viewer/2022051412/54d12ef54a795988238b45b4/html5/thumbnails/5.jpg)
Assistive Technologies
![Page 6: Accessibility testing-Gyani and Siddhanth](https://reader033.vdocuments.net/reader033/viewer/2022051412/54d12ef54a795988238b45b4/html5/thumbnails/6.jpg)
Assistive Technology
Screen Reader Magnifier
Braille Viewer
Which means USERS of
![Page 7: Accessibility testing-Gyani and Siddhanth](https://reader033.vdocuments.net/reader033/viewer/2022051412/54d12ef54a795988238b45b4/html5/thumbnails/7.jpg)
Screen reader is a software that reads the screen and provides audio output enabling blind individuals access information available via electronic devices.
SCREEN READERS
![Page 8: Accessibility testing-Gyani and Siddhanth](https://reader033.vdocuments.net/reader033/viewer/2022051412/54d12ef54a795988238b45b4/html5/thumbnails/8.jpg)
User using screen reader
![Page 9: Accessibility testing-Gyani and Siddhanth](https://reader033.vdocuments.net/reader033/viewer/2022051412/54d12ef54a795988238b45b4/html5/thumbnails/9.jpg)
SCREEN READER EXAMPLES
Computer Screen Readers:Windows OS Linux OS Mac OS
•JAWS For Windows•NVDA•Windows-Eyes
ORCA Voice Over
![Page 10: Accessibility testing-Gyani and Siddhanth](https://reader033.vdocuments.net/reader033/viewer/2022051412/54d12ef54a795988238b45b4/html5/thumbnails/10.jpg)
SCREEN READER EXAMPLES
Mobile Screen Readers:Symbian Android I Phone•Nuance Talks•Code Factory Mobile Speak
•Code factory Mobile Accessibility•Talk Back
Voice Over
![Page 11: Accessibility testing-Gyani and Siddhanth](https://reader033.vdocuments.net/reader033/viewer/2022051412/54d12ef54a795988238b45b4/html5/thumbnails/11.jpg)
MAGNIFIERS
Magnifies the keyboard-highlighted and Mouse-focused objects enabling low-vision users operate computers.
![Page 12: Accessibility testing-Gyani and Siddhanth](https://reader033.vdocuments.net/reader033/viewer/2022051412/54d12ef54a795988238b45b4/html5/thumbnails/12.jpg)
BRAILLE DISPLAYS
Provides braille output on a rubber screen.
![Page 13: Accessibility testing-Gyani and Siddhanth](https://reader033.vdocuments.net/reader033/viewer/2022051412/54d12ef54a795988238b45b4/html5/thumbnails/13.jpg)
Demonstration of screen reader with web pages
![Page 14: Accessibility testing-Gyani and Siddhanth](https://reader033.vdocuments.net/reader033/viewer/2022051412/54d12ef54a795988238b45b4/html5/thumbnails/14.jpg)
Couple of volunteers please?
![Page 15: Accessibility testing-Gyani and Siddhanth](https://reader033.vdocuments.net/reader033/viewer/2022051412/54d12ef54a795988238b45b4/html5/thumbnails/15.jpg)
Image example
• Turn your screen off.• Press Control+Home to go to top of page• Listen using down arrow keys• Tell us what you hear.
![Page 16: Accessibility testing-Gyani and Siddhanth](https://reader033.vdocuments.net/reader033/viewer/2022051412/54d12ef54a795988238b45b4/html5/thumbnails/16.jpg)
Table example
• Use tab to read form fields in the table.• Only header row identifies form fields in case
of inaccessible example• Both header row and header column identifies
form fields.
![Page 17: Accessibility testing-Gyani and Siddhanth](https://reader033.vdocuments.net/reader033/viewer/2022051412/54d12ef54a795988238b45b4/html5/thumbnails/17.jpg)
Accessibility Guidelines and Laws
![Page 18: Accessibility testing-Gyani and Siddhanth](https://reader033.vdocuments.net/reader033/viewer/2022051412/54d12ef54a795988238b45b4/html5/thumbnails/18.jpg)
The Idea being to create a POUR Website
WAI provides 12 Guidelines under WCAG 2.0 organized under 4 P-O-U-R principles
PERCEIVABLEContent presented in ways perceivable by all 5 senses of human beings
OPERABLEA website must be device independent to be operable
UNDERSTANDABLEContent presented and website behavior must be predictableAnd understandable.
ROBUSTMaximize compatibility with current and future user tools.
![Page 19: Accessibility testing-Gyani and Siddhanth](https://reader033.vdocuments.net/reader033/viewer/2022051412/54d12ef54a795988238b45b4/html5/thumbnails/19.jpg)
WCAG 2.0 talks about
• Text alternatives for non-text content• Proper use of headings• Accessible Elements-Forms, Tables, sliders, etc• Device independent• Use of lang attribute • List just can go on
![Page 20: Accessibility testing-Gyani and Siddhanth](https://reader033.vdocuments.net/reader033/viewer/2022051412/54d12ef54a795988238b45b4/html5/thumbnails/20.jpg)
Other Accessibility Guidelines & Laws
• WAI-ARIA (Accessible Rich Internet Applications)
• USA Section 508• UK-DDA (Disability discrimination Act)• GIGW (Guidelines for Indian Government
Websites)
![Page 21: Accessibility testing-Gyani and Siddhanth](https://reader033.vdocuments.net/reader033/viewer/2022051412/54d12ef54a795988238b45b4/html5/thumbnails/21.jpg)
Accessibility Testing
![Page 22: Accessibility testing-Gyani and Siddhanth](https://reader033.vdocuments.net/reader033/viewer/2022051412/54d12ef54a795988238b45b4/html5/thumbnails/22.jpg)
Automated Testing Tools
• WAVE Accessibility Tool• Web Accessibility Toolbar for Firefox
![Page 23: Accessibility testing-Gyani and Siddhanth](https://reader033.vdocuments.net/reader033/viewer/2022051412/54d12ef54a795988238b45b4/html5/thumbnails/23.jpg)
How to choose a testing tool?
• Tool itself needs to be accessible.• Tool must check for browser DOM.• Range of guidelines / laws it covers.• Guidance offered for further manual testing.
![Page 24: Accessibility testing-Gyani and Siddhanth](https://reader033.vdocuments.net/reader033/viewer/2022051412/54d12ef54a795988238b45b4/html5/thumbnails/24.jpg)
Manual Testing
• Automated testing tools test less than 50% of WCAG 2.0 success criteria.
• Whatever can be checked can be checked partially.
• Manual testing allows to test all the 61 WCAG 2.0 success criteria.
• Manual testers have knowledge of guidelines and laws.
• Manual testing is thorough.
![Page 25: Accessibility testing-Gyani and Siddhanth](https://reader033.vdocuments.net/reader033/viewer/2022051412/54d12ef54a795988238b45b4/html5/thumbnails/25.jpg)
THANK YOU !!!
![Page 26: Accessibility testing-Gyani and Siddhanth](https://reader033.vdocuments.net/reader033/viewer/2022051412/54d12ef54a795988238b45b4/html5/thumbnails/26.jpg)
Your Questions Please