The problem (and opportunity) of WordPress plugin accessibility
When we build a website, in most cases we don’t have to build every piece of functionality ourselves. Especially on a platform like WordPress, it makes much more sense to use third party plugins to handle important but common functionality such as forms. Within the WordPress ecosystem, there are a number of popular and highly rated plugin options for building forms, which can be used to cover everything from simple contact forms, newsletter subscriptions, nonprofit donation forms, light e-commerce, and much much more.
However, as with any other third-party software you install on your site, it is important to determine how it affects your site’s accessibility. As a site owner, you are responsible (and liable under the ADA) for the accessibility of anything that you introduce into your site. But you can also think about this exercise as an opportunity to introduce a fully accessible set of functionality onto your site without having to write code or conduct much in the way of testing.
Accessibility considerations for forms
What kinds of accessibility issues on forms should you be concerned about? While the full range of possible WCAG accessibility violations that can appear on a website could also be introduced into a form plugin, there are a number of accessibility issues that relate specifically to form features and functionality. Some of the typical accessibility considerations on a form would include:
- Using form field labels (rather than placeholder text) to describe the purpose of all fields
- Required fields are indicated.
- If a symbol like an asterisk (*) is used to indicate required fields, a legend is generated that explains the meaning of the symbol.
- Autocomplete options are available when relevant
- Fields are programmatically generated to share relevant information correctly with screen readers (including required status, autocomplete options, etc.)
- All text color combinations generated within the form have a sufficient contrast ratio of 4.5:1 including field labels, placeholder text, error alerts, inline validation errors, success messages, and button text
- All other color combinations generated within the form UI have sufficient color contrast ratio of 3:1 including field borders to indicate an active control
- Color is not used as the only indication that a field was populated correctly (e.g. a green outline) or incorrectly (e.g. a red outline)
- All fields and functionality are accessible from the keyboard including radio button, dropdown, multi-select, and file upload fields
- All interactive elements have a visible focus effect (outline)
- All errors detected on the form should generate validation instructions to fix them
- Error messages should be generated in a way that they are immediately accessible to screen readers on an attempted submission and allow the user to easily return to the form via keyboard
How we evaluated form plugins for WCAG compliance
Our goal is to identify WordPress form plugins that have made the effort to prioritize accessibility. At minimum, this means that it should be possible to create a WCAG compliant accessible form using the plugin. But ideally, a form plugin would create a happy path towards accessibility by default or at least document their accessibility features and assist accessibility-conscious site builders in proper configurations.
Of course, most people are not accessibility experts and may not be able to easily follow detailed documentation or instructions on how to utilize a plugin accessibly. And even those that can follow instructions might not be aware that separate accessibility documentation exists. This is why it is also important to consider the ways in which a plugin makes it easier or harder for you to build an accessible form without any special knowledge. After all, it doesn’t help you if it is theoretically possible to build an accessible form, but it is very easy to accidentally introduce accessibility violations simply by using advertised, out-of-the-box features.
A full audit of these plugins is beyond the scope of this article and we have relied primarily on self-assessments provided by the plugin providers on their own websites. Our assumption is that if we can’t find any mention of accessibility on a provider’s website, that is usually a bad sign.
We understand that self-assessments may not be enough for some organization’s procurement or technology review processes. If you need help evaluating one of these plugins more deeply, please contact us to discuss how we can help.
Gravity Forms is one of the most popular and comprehensive WordPress form plugins. It offers a simple but extremely powerful visual form editor along with a suite of add-ons to address any number of scenarios including newsletter and CRM integrations, checkout with all of the popular payment processing solutions, and custom feature enhancements. Gravity has enough traction in the WordPress world that a larger ecosystem of supplementary add-ons and plugins have sprung up to further extend Gravity Forms’ functionality.
Over the past few years, Gravity Forms has added accessibility improvements, but the most recent major version (2.5) took a full leap into offering full WCAG 2.1 AA compliance out of the box. The company has brought in an outside agency to audit the plugin and manage ongoing accessibility enhancements. The Gravity website also offers an accessibility checklist for site builders, many blog posts on the topic of accessibility, as well as detailed documentation for developers, designers, and content providers.
This attention to accessibility is one of the reasons we used Gravity Forms on Access Armada’s website. In full disclosure, we did identify a small number of issues (that don’t rise to the level of WCAG violations) in interacting with form error messages using a screen reader. We have submitted support tickets to Gravity Forms documenting these issues and will update this post when they are addressed.
- Plugin has been built with accessibility in mind
- Detailed documentation on how to use Gravity Forms to build accessible forms
- Visual editor includes some warnings when configuration choices introduce accessibility issues
Areas for improvement
- Some form settings (such as Sub-Label Placement and Validation Summary) are not configured in the most accessible manner by default
- Add additional warnings for all possible non-accessible configurations and settings
- Hide inaccessible form field options (or force users to opt-in in order to see these options)
- Document the accessibility of official and certified add-ons
- At minimum, we suggest adding an accessibility checklist or mode that would allow interested users to easily confirm that all fields and settings are configured in the most accessible manner. (Gravity Forms already has a written checklist but this should be integrated programmatically as well.)
- Gravity Forms Accessibility Guide for Developers
- Gravity Forms Accessibility Guide for Designers
- Gravity Forms Accessibility Guide for Content Providers
Another popular form plugin option is Formidable Forms; it supports a wide variety of use cases with its drag and drop form builder, powerful feature set, and official integrations with other popular WordPress plugins as well as payment processor, email and CRM services.
Formidable Forms features an accessibility page on its website, which claims that the plugin is fully ADA and WCAG compliant but otherwise has very few details (including what WCAG version and level it complies with). The page includes a few examples of how the plugin bakes in accessibility and lists high-contrast text, keyboard navigation, and screen reader friendliness as features. But there is no further documentation on how to best take advantage of the accessibility features.
- Recognizes the importance of accessibility and claims to meet WCAG standards
Areas for improvement:
- Provide more detailed accessibility claims such as a VPAT
- Documentation for site builders and developers on how best to take advantage of accessibility features
- Highlight happy-path accessibility configuration
Contact Form 7
Contact Form 7 is one of the oldest and most popular WordPress form plugins with well over 5 million installations. What distinguishes Contact Form 7 is that it is a completely free and open source option. This means that while the plugin itself can be a bit bare bones compared to other options on the market, there is a lot of community support for extensions, integrations with other popular WordPress plugins and third party services.
It is not entirely surprising that Contact Form 7’s own website doesn’t advertise its accessibility features, but it is possible for a knowledgeable developer to build accessible forms using this plugin. A review of the public code repository shows that accessibility-related improvements and bug fixes have been added to the plugin as recently as this year. For advanced users, there is a fork of the plugin that specifically addresses accessibility issues. There is also an add-on plugin produced by Joseph Dolson, a member of the WordPress accessibility team, that automatically sets accessible configurations by default. However, this plugin has not been updated in several years and contains a warning that it has not been tested with the latest major WordPress releases and may introduce compatibility issues.
- Contact Form 7: Accessible Defaults Plugin
- CF7 Tanaguru: a fork of the Contact Form 7 plugin to fix accessibility problems
Form plugins to avoid
While the form plugins listed above are some of the most popular options for WordPress, there are a wide variety of other forms with comparable features. Unfortunately if their websites don’t contain any mention of accessibility features or compliance, it is impossible to know whether this is something that they prioritize. As a result, we would recommend that accessibility conscious site builders avoid building a new site with the following plugins at this time.
- Fluent Forms
- Ninja Forms
- WPForms (In this case, the Terms & Conditions specifically include a disclaimer that the plugin does not claim to be WCAG compliant.)
If you already have one of these plugins installed on your site and would like to investigate how accessible your implementation is, please contact us and we can help.
The implementation matters
We’ve addressed the ways in which the configurations selected within a plugin can be the most important factor in determining whether the resulting output is WCAG compliant. But you should also keep in mind how the form plugin interacts with your theme and custom code. For example, if your site has a dark background, the default form plugin styles might have insufficient color contrast.
We hope the list we shared here helps you make good choices in selecting an accessible-friendly WordPress form plugin. Is there a plugin that you don’t see in this article that you would like to learn more about? Or are you looking for a specific form feature and are unsure how to source or build it in an accessible manner? Access Armada can assist in auditing and evaluating accessible WordPress form plugin options or in remediating form accessibility issues on your site.