dai11y 21/06/2021

Your daily frequent11y newsletter, brought to you by @ChrisBAshton:

Overview of accessibility testing using DevTools (Microsoft)

  • A guide by the Microsoft Edge DevTools team, though almost all of it applies to any modern browser.
  • This mammoth article is a 23 minute read, and covers how to use DevTools for automated accessibility testing, by working through the accessibility ‘warnings’ in the console. It then describes how you should manually test your page by:
    • Resizing the viewport to simulate a zoomed in or mobile device.
    • Attempt to interact with the page with a keyboard, and keep an eye out for focus styles.
    • Inspecting the Accessibility Tree to check for elements with a “generic” role (usually attributed to being encoded as a div or span rather than a button), which won’t be available to users of assistive technology.
    • Simulating hover/focus states on interactable elements and checking their contrast.
    • Testing with dark and light themes.
    • Emulating vision deficiencies with things like blur filters.
    • Verifying that the page respects the prefers-reduced-motion media query.
  • It’s worth at least a skim through – chances are you’ll learn something!

Prefer longer newsletters? You can subscribe to week11y, fortnight11y or even month11y updates! Every newsletter gets the same content; it is your choice to have short, regular emails or longer, less frequent ones. Curated with ♥ by developer @ChrisBAshton.

Loading...