Comparing automated accessibility checkers and the issues that they can find

Testing the accessibility of webpages can be challenging. Only a certain percentage of issues can be found with automated tools like WAVE, ANDI, or Axe. It would be convenient if testing tools could find all issues, but in practice some automated checkers are better than others at finding different types of issues. If you want to do a thorough accessibility evaluation, you will likely need to test with several different tools to find the most issues.

Here’s a comparison of issues that various automated accessibility checkers can find:

Issue

WAVE

Accessibility Insights

Lighthouse

ANDI

Axe

Language missing

Yes

Yes

Yes

Yes

Yes

Iframe missing title attribute

No

Yes

Yes

Yes, under focusable elements

Yes

Missing alternative text

Yes

Yes

Yes

Yes, under Graphics/Images

Yes

Long alternative text

Yes

No

No

No

No

Aria attribute not allowed

No

Yes

Yes

No

No

Underlined text (Pseudo links)

Yes

No

No

No

No

Skipped heading level

Yes

No

Yes, says Heading elements are not in a sequentially-descending order

No, under Structures > Headings

No

Poor text contrast

Sometimes

Yes

Yes, says background and foreground colors do not have a sufficient contrast ratio.

Yes

Yes

Missing table headers

Yes, will call it a ‘layout table’

No

No

Yes, under tables

No

Touch targets without sufficient size or spacing

No

No

Yes

No

No

‘Yes’ for the tool can find and ‘No’ for the checker can’t find. ‘Sometimes’ means that the checker sometimes can find the issues but not in all cases. For example, WAVE can check contrast ratios of live text but not in images of text, such as in a logo.

If your organization is using PopeTech as its compliance scanner, the WAVE browser extension is a good tester to start with because PopeTech uses WAVE as it’s accessibility engine. In the table above I’ve compared WAVE to other popular automated testers. ANDI is a nice, lightweight bookmarklet that can find a lot of accessibility issues.

Accessibility Insights offers not only automated testing with the Quicktest, but also can guide you through the steps of a conformance testing methodology. So, if you need to do more through manual testing, Accessibility Insights can guide you through that step by step. The only downside is that it doesn’t always refer to WCAG success criteria (SC) as you go through the steps. It can be a good reference to know what WCAG SC each step is related to.

Chinese languages test page for Screen readers

This is a languages test page. The following paragraphs are marked up for Chinese (lang=”zh”). These can be used for testing the accent of a screen reader. The two letter language code in the lang attribute should match the language the text was written in.

The paragraph in English (lang=”en”)

If a language isn’t specified, the screen reader will read the page in the user’s default language. That may result in a bad accent that’s difficult to understand. To specify a language for the page, add the ‘lang’ attribute to the HTML tag. For example: html lang=en.

Paragraph in the Chinese language (lang=”zh”), simplifed (zh-Hans):

如果未指定语言,屏幕阅读器将使用用户的默认语言阅读页面。这可能会导致口音难懂。要为页面指定语言,请将“lang”属性添加到 HTML 标记。例如:html lang=zh.

Paragraph in the Chinese language (lang=”zh”), traditional (zh-Hant):

如果未指定語言,螢幕閱讀器將以使用者預設的語言閱讀頁面。這可能會導致口音不好,難以理解。若要指定頁面的語言,請將「lang」屬性新增至 HTML 標記。例如: html lang=zh.

The key to getting NVDA to speak non-Latin languages is to switch to voice synthesizer like eSpeak NG that is more multilingual. It can be done under Preferences > Settings > Voice > synthesizer. The default MS OneCore voices sound good for American English but don’t support a lot of other languages. The Hong Kong Blind Union has an addon for NVDA that can allow it to better speak Chinese.

Resources

ISO 2 Letter Language Codes reference

Google Translate

ISO 639.2 Codes for the Representation of Names of Languages

Devanagari script languages test page for Screen readers

This is a languages test page. The following paragraphs are marked up for three languages that use Devanagari script. These can be used for testing the accent of a screen reader. The two letter language code in the lang attribute should match the language the text was written in. Nepali, Hindi, and Garhwali are languages that use the Devanagari script (a non-Latin alphabet).

The paragraph in English (lang=”en”)

If a language isn’t specified, the screen reader will read the page in the user’s default language. That may result in a bad accent that’s difficult to understand. To specify a language for the page, add the ‘lang’ attribute to the HTML tag. For example: html lang=en.

Paragraph in the Hindi language (lang=”hi”):

यदि कोई भाषा निर्दिष्ट नहीं है, तो स्क्रीन रीडर पृष्ठ को उपयोगकर्ता की डिफ़ॉल्ट भाषा में पढ़ेगा। इसका परिणाम खराब लहजे में हो सकता है जिसे समझना मुश्किल है। पृष्ठ के लिए एक भाषा निर्दिष्ट करने के लिए, HTML टैग में ‘लैंग’ विशेषता जोड़ें। उदाहरण के लिए: html lang=hi.

Paragraph in the Nepali language (lang=”ne”):

यदि कुनै भाषा निर्दिष्ट गरिएको छैन भने, स्क्रिन रिडरले प्रयोगकर्ताको पूर्वनिर्धारित भाषामा पृष्ठ पढ्नेछ। यसले नराम्रो उच्चारण गर्न सक्छ जुन बुझ्न गाह्रो छ। पृष्ठको लागि भाषा निर्दिष्ट गर्न, HTML ट्यागमा ‘lang’ विशेषता थप्नुहोस्। उदाहरणका लागि: html lang=ne

Paragraph in the Garhwali language (lang=”hi”).

Using lang=”hi” becuase Garhwali, being a regional language, does not have a specific two-letter or three-letter code assigned in ISO 639-1 or ISO 639-2 standards.

यदि कोई भाषा निर्दिष्ट नहीं है, तो स्क्रीन रीडर पृष्ठ को उपयोगकर्ता की डिफ़ॉल्ट भाषा में पढ़ेगा। इसका परिणाम खराब लहजे में हो सकता है जिसे समझना मुश्किल है। पृष्ठ के लिए एक भाषा निर्दिष्ट करने के लिए, HTML टैग में ‘लैंग’ विशेषता जोड़ें। उदाहरण के लिए: html lang=hi.

The key to getting NVDA to speak non-Latin languages is to switch to voice synthesizer like eSpeak NG that is more multilingual. It can be done under Preferences > Settings > Voice > synthesizer. The default MS OneCore voices sound good for American English but don’t support a lot of other languages. ERNET India has directions on how to get NVDA to speak Hindi. eSpeak NG also has a Nepali voice you can switch to in the NVDA speech settings.

Resources

ISO 2 Letter Language Codes reference

Google Translate

ISO 639.2 Codes for the Representation of Names of Languages