Live: A Non-Developer's Guide to Accessibility Testing with Chrome DevTools
taught by: Jonathan Whiting
Session Summary
Learn to use Chrome Developer Tools (DevTools) to identify basic accessibility information, test contrast, identify an elements "accessible name", and see how ARIA is being used.
Description
Watch this presentation in the Knowbility Learning Center
A browser inspector is an essential tool for any web accessibility tester, but it can be intimidating for people who do not consider themselves Developers. During this workshop, we will practice using Chrome Developer tools to quickly find accessibility information like contrast, role, name, and keyboard accessibility (we will explain all these terms). We will also use Chrome to dig deeper into advanced contrast testing (including different element "states") and will used the "Accessibility" tab to see what information is being conveyed to screen readers, ARIA that is being used, and more.
While you do not need to be familiar with DevTools basic familiarity with HTML and web accessibility principles is recommended. Developers already familiar with DevTools are also welcome. Bring your Windows or Mac laptop to take full advantage of the workshop.
(ICT 2022 Presenter)
Practical Skills
- Use the "Select an element" feature in Chrome DevTools to find important accessibility information at a glance.
- Practice testing contrast, changing browser states, and modifying elements in a webpage.
- Become comfortable using the "Accessibility" tab DevTools to identify important accessibility information.