Testing for Accessibility

Manual Testing

Microsoft Accessibility Insights is a great tool that can assist you with manually testing your site.

Use HTML elements correctly.

  • Use a native elementas opposed customizing or creating your own whenever possible.
    • HTML elements communicate specific roles and functionality, so overriding elements with ARIA or JS can lead to confusion and incompatibility with browsers and assistive technology.
    • For example, use <button> for mobile menu toggles, as opposed to a <div>, <span>, or <a> tag.
  • Review your site’s accessibility tree to make sure that assistive technology is able to interact with and interpret your site’s elements and functionality as intended.
  • Ensure valid HTML using the HTML Markup Validation Service.

Ensure the structure of your webpages makes sense.

  • Utilize HTML landmarks to organize and section your content. This will allow users to navigate your web page in an outline format, instead of linearly. These landmarks save users time and lets them skip to the section that they are looking for.
  • Review your page’s hierarchy using the “Structure” tab in the WAVE extension. Make sure there are no skipped heading levels.