If you’ve been looking to make forms on your WordPress site more accessible, it’s gotten a lot easier for you in the past month. Two posts were published describing how you can improve the accessibility of your Gravity Forms and Contact Form 7 forms.
Tips on Making Your Gravity Forms as accessible as possible by Cynthia Ng offers advice for the popular Gravity Forms plugin, including how to enable HTML5, avoid presets, create a workaround for fieldsets and legend, and disable tabindex.
After noticing the lack of ARIA attributes, Cynthia contacted Gravity Forms to request ARIA was added. She received a positive response from their development team:
This should be doable for us. I will look into what it will take to implement it.
Alex Cancado, Gravity Forms
In How to Setup an Accessible From Using Contact Form 7 in WordPress, my colleague Rian Riatveld walks you through the steps to create an accessible form with Contact Form 7. You’ll make changes to the default form, modify the CSS, and add two constants to the wp-config.php file.
Rian points out the advantages of using Contact Form 7:
- Accessible back-end
- Complete control over the HTML output
- WAI-ARIA attributes in the forms, for error messages and required fields
- Cleaner HTML output than Gravity Forms
While Contact Form 7 doesn’t have the wealth of features Gravity Forms offers, it’s free, well maintained and documented, the developer is open to suggestions for improvements for features and accessibility, and there are additional plugins for more functionality (integration with Akismet and MailChimp) to the plugin.
When I discovered Contact Form 7 had an accessible back-end, created clean code, and included WAI-ARIA in the forms, I chose to use Contact Form 7 to make my Lireo Designs contact form accessible. It was straightforward and easy to do.