By Dany Ortiz, on 25 June 2024
No matter what you use your web forms for, this article is for you. Whether it's to get newsletter subscribers, request quotes, offer discounts... All the strategies we present in this article can be used to boost your inbound marketing or lead generation strategy.
A poorly implemented form can be the difference between a good and a bad conversion rate. From the outset, we can tell you that simplicity and design are fundamental aspects you must not neglect, especially in a highly competitive market.
Once you have implemented the various strategies we propose, it is important to track your form's performance to see if it meets your expectations. You can also create different versions and run an A/B test to see which one has a better conversion rate.
1. Fewer Fields, Better Conversion Rates
Look at the following forms and tell me which one you would prefer to fill out.
Sourece: esepestudio.com
Most of you would likely choose the first one, and the same goes for your potential customers. Therefore, I recommend being selective and only asking for information you consider absolutely essential (there will be time to gather more information later).
Short forms are particularly useful for increasing conversion rates among new audiences. However, longer forms can also perform well with customized audiences.
In this latter case, here's what you can do to avoid having the form take up half the screen.
2. Sections are the Solution to Long Forms
If you have no choice but to include many fields in your form, one thing you can do is divide it into different collapsible and numbered sections.
This will help the user not feel so overwhelmed when seeing the form and prevent them from backing out of filling it out.
These types of forms are very common during the purchasing process, where a lot of data like card information, address, shipping method, etc., needs to be added.
3. Order Must Be Logical to Increase Conversion Rates
A user would be thrown off if you first asked for their email, then their last name, then their phone number, and then their first name, right? They might find it so strange that they don't even fill out the form.
This is a somewhat extreme example, but it serves to explain the importance of following a logical order. Additionally, one of the consequences of not doing so is confusing the user and making them suspect that the company might not be very reliable.
Ideally, you should move from the simplest and easiest questions to answer to the more specific ones.
4. Make the Form Stand Out from the Rest of the Web
If the user does not notice the form's presence, none of the other strategies you have implemented will matter. Therefore, a form should be eye-catching without clashing with the style of your webpage and be large enough to be seen without being disproportionate.
Use colors that match the rest of the page but are different, and if you can make it original by adding movement or illustrations, even better.
5. Labels Should Be Descriptive
Labels are the phrases that appear above or inside each fillable section of the form and indicate what the person should write (name, last name, email, password...).
It is crucial that these labels be as short, simple, and direct as possible. Their function is to guide the user, so avoid any technical terminology.
6. Set Default Values
A user is more likely to fill out a form if they see that some parts are already pre-filled. There are sections where this can't be done (like the name), but it can be done in questions where the user has to choose between different options, such as nationality. If our users are usually from a specific country, we can pre-fill this option by default, always allowing it to be edited.
In the example from our website, you can see how the Spanish phone prefix appears by default. This is because our clients are mainly from Spain. By pre-filling this part, we likely save many leads time when filling out the form.
7. Add Answer Examples
Some forms, to increase their conversion rate, include answer examples in each box. This eliminates any doubt the user might have about what to put, reducing the chances of them not filling it out.
These response suggestions are usually in a very soft-colored font so they are not confused with what the person actually writes.
8. One Column is the Ideal Layout on Mobile
A form's conversion rate increases on mobile when it is laid out the same way the person navigates on this device, which is vertically. This is because the screen is much smaller, and if the form is horizontally designed, it may be too tight and the letters excessively small. This is not the case on a computer, where horizontal forms can be implemented.
You can see a clear example of this concept in the two images below. In the first image the desktop version of the form has form fields that occupy two columns.
However, in mobile we can see that the form adjusts so that the fields only occupy one column. This is how you ideally should design your forms for desktop and mobile.
9. Sticky Forms Increase Conversion Rates
A sticky form always remains visible on the screen despite scrolling. This is not recommended for mobile devices, as the screen is too small, but it is interesting for PCs or tablets.
This way, we keep the user's attention more on the form, as well as its visibility, increasing the chances of improving the conversion rate.
10. Clear and Attractive CTAs
Calls to action (CTAs) are usually on the form buttons, which the person presses once they have filled out all the sections. However, they can also be part of the form's title or content.
CTAs should clearly express the action you want the user to take and should stand out to be easily seen. To do this, you can use capital letters, specific colors, and fonts.
11. Include Autocomplete Functions
This is something that will greatly facilitate the user's work and increase the likelihood of improving the conversion rate.
Autocomplete functions complete the phrase the user has started based on data previously entered by the person. For example, finishing writing their email for them. This, as you can see, speeds up the process significantly.
12. Indicate Mandatory Questions
It is helpful to indicate in the form which questions the person must answer. This is usually done by accompanying the title of each one with an asterisk (*) and causes the person not to feel obliged to add information they do not want to in more specific questions, as the mandatory questions are usually related to basic and straightforward matters.
13. Implement Instant Validation
Imagine someone takes the time to fill out an entire form and, upon submission, an error message appears. This is something that often annoys users and is one of the main reasons conversion rates drop.
To avoid this, customers greatly appreciate being told at the moment if the information is correct so they can change it immediately.
This can be done by showing a green check mark when it is correct or a red cross when it is not, for example.
It is also common to indicate the reason why a response has been marked as incorrect, so the user knows better how to fix it.
14. Ensure Data Privacy to Increase Your Conversion Rate
Many users do not feel safe giving their data online, which significantly limits the ability to increase your form conversion rates. To eliminate this limitation as much as possible, you can include a selectable box about the privacy policy before the submit button, briefly explaining how their data will be handled.
If it is a payment process form, you can also add messages indicating the security of the procedure.
15. Information Symbols are Sometimes Necessary
In some sections of the forms, it is common to see an information symbol accompanying the title of each one. These symbols allow the user to see a clarification about the question when they hover over it, clearing up any doubts they might have about what to add.
16. Add Titles and Answer the Most Common Question
Forms should have an attractive title to accompany them to increase their conversion rate. The title should be in large letters and can include the CTA of the button.
Additionally, it is also interesting for it to be accompanied by a subtitle answering a common FAQ about the form, such as what it is for.
For example, a title could be "Subscribe to our Newsletter" with the subtitle "Receive the latest updates from our catalog in your inbox."
17. Autosave is More Important Than You Think
Users can experience many unexpected things while completing a form that may prevent them from finishing it, such as their device suddenly turning off or the Wi-Fi signal not reaching well when submitting the data.
If we do not implement the save function, in these cases the user will lose all the added information and it is very likely they will not re-enter it.
18. Do Not Place the Form at the Bottom
Where the form is placed on a webpage is one of the most important aspects of increasing the conversion rate. Generally, it is recommended to dedicate a webpage to the form, but if we want it to appear on other pages, it is better to place it on the right side or in the middle.
However, we do not recommend placing it at the bottom, as few people scroll to the bottom of a webpage, so your form may go unnoticed.
19. Avoid Complex CAPTCHAs
CAPTCHA is an extra step often added to forms to protect against spam and ensure password privacy, guaranteeing that the user who filled out the form is a person and not an automatic program.
There are CAPTCHAs where the user simply has to click on a section and others where they have to include a series of numbers and/or letters or select a series of images.
At first glance, it seems interesting, doesn't it? But the reality is that the user experience is negatively impacted because many times the user cannot complete this step correctly, getting frustrated and leaving the page.
Source: Google reCAPTCHA
If you want to implement CAPTCHA in your forms, we recommend opting for the simplest ones to complete.
20. Responsive Design is Essential
Responsive design is one that perfectly adapts to any type of device. So, before publishing your form, make sure that users can view it well regardless of whether they use a mobile phone, PC, or tablet.
Nowadays, many website creation platforms allow you to preview different elements of the page on different devices, which we recommend doing.
