Screen Reader Testing and Website Support for Beginners UMass Accessibility Retreat Monday, October 23, 2017 Screen Reader Testing and Website Support for Beginners

Today’s Presenters Kristina England, UMass President’s Office Matt McCubbin, UMass Boston Screen Reader Testing and Website Support for Beginners

What We’ll Cover Today The Basics of Website Support: WCAG is the Only Way to Go The Four Principles of Accessibility Why Semi-Automated Accessibility Checkers are called semi-automated Manual Testing Matters Hands-on Manual Testing: Live Testing of Your Site How did you do? Screen Reader Testing and Website Support for Beginners

The Basics of Website Support: WCAG is the Only Way to Go Think about it this way: Section 508 was last updated before the iPhone (though there is a planned release in 2018). HTML has changed a lot in the last 17 years. WCAG 2.0 rolled out in 2008. WCAG 2.1 is around the corner in mid-2018. WCAG 2.0 provides the success criterion and recommended fixes you and your developers need to remedy an issue. But, remember, don’t wait for testing… think coding best practices at the start of development. Screen Reader Testing and Website Support for Beginners

The Four Principles of Accessibility WCAG guidelines and associated success criteria are built on the following four principles: Perceivable - Information and user interface components must be presentable to users in ways they can perceive. Users must be able to perceive the information being presented (it can't be invisible to all of their senses) Operable - User interface components and navigation must be operable. Users must be able to operate the interface (the interface cannot require interaction that a user cannot perform) Understandable - Information and the operation of user interface must be understandable. Users must be able to understand the information as well as the operation of the user interface (the content or operation cannot be beyond their understanding) Robust - Content must be robust enough that it can be interpreted reliably by a wide variety of user agents, including assistive technologies. Users must be able to access the content as technologies advance (as technologies and user agents evolve, the content should remain accessible) Screen Reader Testing and Website Support for Beginners

Why Semi-Automated Accessibility Checkers are called semi-automated You may have an automated testing tool in house that checks for violations, but remember, these tools are only “semi” automated and cannot validate several of the criteria within the WCAG guidelines. You must manually check through keyboarding, color contrast testing, zoom testing, etc. Today, our main focus will be keyboarding using a screen reader. Screen Reader Testing and Website Support for Beginners

Manual Testing Matters Examples of violations that would not be detected through semi-automated testing: A non-sighted user navigates to the login page for an application. The non-sighted user accidentally mistypes their password. They attempt to login and do not realize they have failed as the “invalid password” error message is not picked up by the screen reader. A color-blind user navigates to a web page where it mentions projects with a red status bar have a status of at risk and projects with a green status bar have a status of on time. The person cannot see red or green and thus cannot tell the difference between the two status bars as there is no other distinguishing factor. A hearing-impaired user is asking to watch a video for class. When the user receives the link, the user can’t watch the video as it has no captions or transcript. A user with attention deficit disorder lands on a web page with a video playing in the background. The user can’t focus on the content on the page as the video keeps distracting the user. There is no pause button and the video can’t be paused by pressing a command on the keyboard. A user with low vision navigates to a website on a mobile device using a magnifier. The user cannot navigate left or right on the site using the magnifier and half the content is cut off. Screen Reader Testing and Website Support for Beginners

Screen Readers Open Source Options License required NVDA VoiceOver May require administrative installation depending on desktop policies Variety of voice and synthesizer options Provides speech viewer testing option VoiceOver Built in to all Mac devices (laptops and mobile) Easy to enable and configure settings Provides rotor testing option License required JAWS Check with your campus on license availability Screen Reader Testing and Website Support for Beginners

Demo of an inaccessible site University of Washington Demo of an Inaccessible Site What issues did we encounter on this site? What are some content editing choices we could make going forward to resolve some of these issues? Screen Reader Testing and Website Support for Beginners

Hands-on Manual Testing: Live Testing of Your Site It’s time to test your sample web page. Online participants please mute your Zoom meeting mic if you haven’t already. All in-person participants should wear their headphones at this time. Please cover the screen of your computer with a piece of paper and detach or hide your mouse. Have your screen reader keyboarding instructions ready. And go! Screen Reader Testing and Website Support for Beginners

How did you do? What errors did you encounter? How would these errors impact someone using assistive technology? What did you learn while encountering these errors? Screen Reader Testing and Website Support for Beginners