Whether you want visitors to make a purchase, sign up for a demo, or download a white paper on your website, you’ll need to create a website form for that process.
The design, messaging and functionality of your web forms play a large role in whether a visitor completes the form and converts. Making these small adjustments to your WordPress forms can help you reduce the cognitive load for a visitor and boost form conversions.
In this guide we’ll be sharing tips for Gravity Forms and the free Contact Form 7 plugin. These can all be completed with Gravity Forms’ core features and settings, or if you’re using Contact Form 7 with a few free and premium addons. But really any of the tips can be applied to most top WordPress contact form plugins. So let’s get started!
1. Utilize a Strong Color Contrast in the Form Design
When a web visitor lands on your site, they are typically looking for the fastest & easiest way to achieve a goal, whether to get more information or make a purchase. One way to increase form conversions is to make the form design & layout easy to review for all visitors.
A common mistake on WordPress sites is to set up a default website form design with a white form background and thin gray boxes as form fields.
Consider instead creating a form design where there is a strong color contrast between the form background, the form labels, and the white form fields. When selecting the colors for your form, follow the WCAG guidelines on color contrast with a contrast ratio of at least 4:5:1. This helps any visitors with a disability or visual impairment clearly differentiate the form fields from the background color of the web page.
You can refer to the Gravity Forms developer accessibility guide as a resource. This guide really has everything you need to know about accessibility and Gravity Forms, including a whole section on color contrast and use of color.
If you are utilizing the free Contact Form 7 plugin, the Accessible Defaults extension can help you implement accessibility best practices on all your forms.
2. Reduce the Number of Optional Fields
Long website forms can deter conversions as they often take a longer time to fill out. When a visitor encounters a form, they are subconsciously calculating whether the effort it takes filling out the form is worth the benefit that they’ll receive.
In general, reduce the number of fields as much as possible. If you need to include a few optional form fields, clearly label the required versus optional fields in order to reduce user errors when submitting the form.
In the paid Gravity Form plugin, form fields are optional by default and you can check off the “Required” option when editing the form in the WordPress dashboard.
For the free Contact Form 7 plugin, adding an asterisk in the form
This article was written by Kyla and originally published on WPExplorer.