Lighthouse Score: Accessibility
Melissa Grindel avatar
Written by Melissa Grindel
Updated over a week ago

Lighthouse is a Google developed tool that allows website owners to improve the quality of webpages on their website. The tool audits pages for performance, accessibility, SEO, and more. It also offers suggestions for improving these aspects. ActiveComply automatically incorporates Lighthouse scores for each individual website page into WebCompass.

How Does It Work

Lighthouse can run it against any web page, public or requiring authentication. To begin, users can give Lighthouse a URL to audit. It will then run a series of audits against the page and generate a report on how well the page did. From there, users can review the failing audits as indicators on how to improve the page. Each audit has a reference doc explaining why the audit is important, as well as how to fix it.


Accessibility

These checks highlight opportunities to improve the accessibility of your web app for those who need assistive technologies. Improving a websites ARIA (Accessible Rich Internet Application) in the application can enhance the experience for users of assistive technology, like a screen reader and strengthen efforts toward ADA compliance. The main focus of this score is screen reader accessibility!

Key items evaluated in this score include: are elements (like buttons and links) described well, is alt text specific in your pages images, do links have discernible names, is there sufficient contrast ratio between the background and foreground colors, and are heading elements listed in a sequentially-descending order.

NOTE: Only a subset of total accessibility issues can be automatically detected so manual testing is also encouraged. Things to manually check for Accessibility:

  • The page has a logical tab order

  • Interactive controls are keyboard focusable

  • Interactive elements indicate their purpose and state

  • The user's focus is directed to new content added to the page

  • User focus is not accidentally trapped in a region

  • Custom controls have associated labels

  • Custom controls have ARIA roles

  • Visual order on the page follows DOM order

  • Offscreen content is hidden from assistive technology

  • HTML5 landmark elements are used to improve navigation

Have a green score? Congrats! A score between 90-100 indicates that your page has a higher accessibility score for the items that can be automatically detected.

Have a red score? Anything below 90 indicates the page has accessibility issues to address.

Did this answer your question?