Best WordPress Accessibility Plugins for ADA Compliance

I have been using WordPress for more than fifteen years as part of my blogging journey, and during this journey, I learned a lot about how to customize, build new features, and fix accessibility bugs in WordPress websites. WordPress is rapidly evolving and is the first choice for many due to its ease of use and easy instance setup if you get a domain and the right hosting service. 

In this article, I would like to talk about a few WordPress plugins that I use on all of my websites. These plugins enhance accessibility and provide accessible features, either out of the box or with very little customization. 

Accessibility Checker by Equalize Digital

Equalize Digital Accessibility Checker audits your WordPress website for WCAG, ADA, and Section 508 accessibility errors. This is my go-to tool when evaluating the accessibility of a WordPress website. It helps me identify accessibility failures on a page or post, presents the failures on the same screen along with descriptions, code snippets, the ability to see the issue visually on the front end, and much more. The free version itself has a ton of features, and the reasonably priced pro version adds even more value. I believe the Accessibility Checker plugin by WordPress itself needs a blog post entirely to describe its features and how to use it efficiently. 

Able Player – Accessible HTML5 Media Player

In the past, we curated a list of accessible video/audio players, and during our hunt for an accessible media player for various accessibility projects, we found Able Player. Able Player is an open-source, fully-accessible cross-browser HTML5 media player with a lot of functionality and features. These include changing colors for captions, placement of captions, adding multiple tracks of audio description, adding chapters, and interactive transcripts, among others. When working on any accessibility project related to WordPress websites, we use the Able Player WordPress plugin to provide users with accessible media. You can embed YouTube and Vimeo videos using the WordPress plugin. Please check the feature list and how to use the Able Player WordPress plugin on its plugin page. 

Contact Form 7

In WordPress, there are more than a handful of contact form plugins that are popular and used on thousands of websites. However, very few form plugins are accessible and compliant with WCAG standards. After reviewing more than ten popular WordPress plugins for accessibility, I was not satisfied with many either because the backend is not accessible or the front end contains bugs where accessibility is implemented poorly. Along with this, the plugins also often contain paid features that provide more functionality. After reviewing popular contact form plugins in the WordPress ecosystem, I felt there is no plugin that beats Contact Form 7. It is simple to use, currently installed on more than five million websites, and its backend is accessible with screen readers. Setting up Contact Form 7 needs a bit of a learning curve, which can be acquired by reading documentation. Contact Form 7 also has plugin add-ons that add more features and expand its capabilities. I feel it is better to check out and try Contact Form 7. 

Kadence Blocks

Kadence Blocks has become my go-to plugin since I redesigned DigitalA11Y about two years back. I used the Kadence theme, and since I decided to use the Gutenberg editor instead of the classic editor, I was looking for plugins with accessible components. Initially, there were challenges with both the Kadence theme and Kadence Blocks plugin in terms of accessibility, but the support team is very proactive and fixes accessibility bugs faster. 

My favorites in Kadence Blocks that we use here at DigitalA11Y are the table of contents, accordions, and tab panels. You can see the live demo of these blocks on some of our pages. 

Classic Editor

Before WordPress 5.0, the WordPress core was shipped with the TinyMCE editor. However, in WordPress 5.0, it was replaced with the Gutenberg editor, which was not ready for production at that time. There was a lot of outcry from WordPress contributors and the accessibility community because the Gutenberg editor was buggy and not accessible. This editor made WordPress non-compliant with WCAG guidelines. Some WordPress contributors forked a version of the WordPress core and called it ClassicPress, while the WordPress team released the Classic Editor.

Here’s some more information about the Classic Editor:

The Classic Editor is an official plugin maintained by the WordPress team that restores the previous (“classic”) WordPress editor and the “Edit Post” screen. It makes it possible to use plugins that extend that screen, add old-style meta boxes, or otherwise depend on the previous editor. The Classic Editor is an official WordPress plugin and will be fully supported and maintained until 2024 or as long as is necessary.

Personally, my favorite is the Classic Editor for writing and editing content. The shortcut keys and ease of navigation make it a favorite editor for many. On the other hand, if you need great, cool designs for each page, then use the Gutenberg editor because a sighted user with a minimum understanding of the Gutenberg ecosystem can create great-looking pages with lots of features.

Lightweight Accordion

While researching accessible accordion plugins for WordPress, I came across lightweight accordions. I decided to give one of them a spin in my test sites and was impressed with its features and accessible implementation. I intended to use the plugin to input FAQs for some of my articles and also to implement the FAQ schema. However, I later discovered that Kadence blocks already provide these features. Therefore, I am not using this plugin on my website at DigitalA11Y.
Here is a brief description of the lightweight accordion WordPress plugin:

Lightweight Accordion plugin for WordPress allows you to add collapse elements to posts using a Gutenberg block or a shortcode (via classic editor). By using the details HTML tag and a few lines of CSS this allows for a javascript-free accordion for minimum page load.

I feel that without JavaScript, this could improve performance, but at the same time, we need to verify if the HTML tag is supported on all browsers and screen readers.

Abbreviation Button for the Block Editor

In any field while creating content abbreviations are most common and often people do not realize that abbreviations can cause cognitive overload for some user groups. Here at DigitalA11Y we use the term WCAG all the time, which refers to Web Content Accessibility Guidelines, and this abbreviation plugin for Gutenberg will come in handy when we use abbreviations across the site.
Here is the description from the plugin:

The goal of this plugin is to provide expansions or definitions for abbreviations by using the abbr HTML element. It helps to make your website compliant with the
success criterion 3.1.4 of Web Content Accessibility Guidelines (WCAG).
It is always appropriate to use the abbr element for any abbreviation, including acronyms and initialisms. This HTML element helps to make sure the abbreviation is understood by assistive technologies, by informing the user agent that the characters are an abbreviation, and by providing its meaning using the title attribute.
This plugin adds a new abbreviated format button in the formatting toolbar of the block editor.

Accessibility New Window Warning

When DigitalA11y started, we did a lot of listicle articles doing the roundups of various accessibility resources. Initially, I thought it would be best to have all external links open in a new window. But as the website grew, we stopped this practice. In the initial days, we used a plugin or a custom function to open external links in a new window or tab with an icon signifying that clicking this link opens a new window/tab.
As DigitalA11y grew over the years, we stopped using this practice. As a website that teaches accessibility best practices, it is essential that we follow all the best practices on our own platform. After a long time, here is a WordPress plugin that simplifies the process of telling users which links open in a new window.
If you ask my opinion, then let external links open in the same window/tab.

Here’s the description from the plugin:

Web Content Accessibility Guidelines (WCAG) Success Criterion 3.2 (Predictable) specifies that web pages should appear and operate in predictable ways. It is a common practice to set links that go to off-site locations to open in a new window or tab when clicked. Opening new windows or tabs automatically when a link is activated can be disorienting for people who have difficulty perceiving visual content, and for some people with cognitive disabilities, if they are not warned in advance.

This plugin helps websites become more accessible and better meet WCAG guidelines for predicability by providing advanced warning if a link is going to open a new window or tab before the user clicks or activates it. Providing a warning allows the user to decide it they want to leave the current window, and the warning will help them find their way back, if they do decide they would like to go to the new window. It will help them understand that the “back” button will not work and that they have to return to the last window they had open in order to find their previous location.

There are no settings in this plugin. Simply activate it, and it will automatically find all links that open in a new window and add the following three fixes to each link:

• A new window icon after the link text to denote that the link opens in a new window for sighted people.
• A tooltip, visible on hover, that says “opens a new window.”
• “Opens a new window” screen reader text that will be read out to blind or visually impaired people using screen readers immediately following the link anchor text.

WP Accessible Modal

Recently, while auditing a WordPress website, I came across a lead capture form embedded inside a modal dialog. It failed WCAG 2.4.3 – Focus Order for the following reasons:

• Focus is not placed on the modal when it opens.
• Focus is not trapped inside the modal.
• Focus is not returned to the triggering element when the modal is closed.
• It is possible for a screen reader user to navigate outside the modal dialog using arrow keys (browse mode).

This led me to look for an accessible modal plugin for WordPress, and here’s a reliable one created by Joe Dolson.

While there are many other plugins in the WordPress ecosystem, it is important to choose plugins that output accessible content on the front end. For this, we need to curate plugins, test, and work with developers if they need minor adjustments to ensure accessibility. 

This article is a work in progress and will be regularly updated with content related to WordPress plugins that offer accessibility features and essential functionality. If you come across other WordPress plugins that meet accessibility standards and can be included in the list, please alert us in the comments section, and we will add them to the list.

Related reads

• WCAG audits for WordPress Accessibility testing tailored specifically for WordPress sites.