This lab helps students gain experience and proficiency with alternative modalities for browsing the web (i.e., navigation using the keyboard and using screen readers). Students will learn how to perform a website accessibility evaluation using a keyboard and screen reader. Students will also gain an appreciation for the prevalence of web accessibility issues, and will reflect on what can be done to improve web accessibility.
- If a student didn’t learn how to use a screen reader before lab, there probably won’t be enough time for them to learn during lab. Instead, have them test websites using keyboard navigation. If they finish early, encourage them to try using a screen reader as well.
- It is important that the instructor be proficient in keyboard navigation, and in using both desktop and mobile-based screen readers. Otherwise, the instructor may not be able to provide adequate support to students. However, it isn’t necessary to completely master these tools, since the basic functionality is enough to complete most tasks. If students have questions, point them towards the appropriate “cheatsheet.”
- Since most students will be new to using keyboard navigation and screen readers, the instructor should help students differentiate between genuine accessibility issues, and challenges with using the screen readers themselves. For example, if a student claims that a website isn’t accessible because the website has a lot of text and the screen reader takes a long time to read it, point out that skilled users of screen readers listen to text at high speed, and use screen reader features to jump between areas of interest on the page.
- When leading the class discussion about the accessibility issues discovered by students:
- Focus on how accessibility issues may negatively impact users. For example, an issue preventing users from customizing their food orders would be especially serious for users with allergies.
- Identify common accessibility issues, such as alt text not being available or certain features of the website being inaccessible when using only the keyboard.
- If possible, identify whether certain types of websites were more accessible than others (e.g., are news websites more accessible than food delivery websites?).
- Emphasize that many well-resourced websites have severe accessibility issues (e.g., Grubhub), while some less well-resourced websites are accessible. Ideally, the course website should be accessible, and can be used as an example. Emphasize that the issue of inaccessible websites is not a problem of lack of resources, but rather a problem of lack of awareness or priority for web developers. Allude to the fact that simple websites are often more accessible than complex websites; web developers often write Javascript code that overrides website behavior that would otherwise be accessible by default.
- The suggested readings are ideal because they include the perspectives of people with disabilities, explain laws related to accessibility (e.g., the Americans with Disabilities Act), and emphasize the feasibility of building accessible technology products. If the readings must be updated, keep these factors in mind when choosing replacements.
Students prepare for lab by reading a recent news article about web accessibility issues, by watching a video showing how to perform a web accessibility evaluation, and by configuring and using a screen reader on their own device. If a student already uses a screen reader, they can simply use their own screen reader.
In lab, students work either individually or with a partner to conduct web accessibility evaluations on three different websites. Students have the option to use either keyboard-based navigation or a screen reader. After completing their testing, students list the worst issues they uncovered on the board, along with any websites that were highly accessible. Next, the instructor leads a discussion about the issues
discovered by students. Students submit the results of their accessibility evaluations, and responses to several reflection prompts.
The lab uses multiple engagement practices from the NCWIT Engagement Practices Framework:
- Use Meaningful and Relevant Content Including a recent news article about accessibility issues connects the content directly to the real world. Readings should highlight individuals who are negatively impacted by inaccessible websites.
- Address Misconceptions About the Field of CS Accessibility can sometimes feel like an afterthought in the field of Computer Science: some of the world’s biggest companies have inaccessible websites, programming environments may not support users of screen readers (e.g., Scratch), and accessibility-related instruction is lacking at many schools. Including thislab early in the CS curriculum can prepare students to engage with accessibility issues in later courses (e.g., in a web development course). Furthermore, highlighting careers related to accessible design and usability evaluation can encourage students with interests in these areas.
- Incorporate Student Choice Students should choose which websites they test, so the websites’ functionality is familiar to them and so they are interested to learn how accessible the websites are. Also, students should be offered optional readings that go into more depth about issues of accessibility and disability.