How to Use Validation Error Messages to Improve Web Form Submissions
What kinds of forms do you have on your website? Registration forms? Subscription forms? Lead magnet forms? You probably have a few different ones. Forms are how you collect information from your users. But what if a user inputs invalid information? This is where validation error messages come in.
You’ve probably come across these yourself as a user. You try to register for a subscription and when you hit “Submit,” required fields on that page that you failed to complete are highlighted. Or you enter your birthday, but the system doesn’t recognize it because it isn’t formatted properly.
How does it make you feel?
Have you ever heard that people have the attention span of a goldfish especially when online? That’s a mere 8-9 seconds. If your forms are difficult to complete, chances are that users will just give up and abandon them. Validation error messages help guide users to correctly and seamlessly complete forms.
Here we’ll cover how to make your forms user-friendly while also saving yourself from a headache.
What are web forms?
There are many different types of web forms. Web forms are used to collect necessary information from your customers. Common web forms are contact forms, lead generation forms, order forms, registration forms, and survey forms.
Web forms benefit you by giving you important customer information you need to communicate with your customers and seamlessly provide your product or service. Forms benefit your customers too. Forms put them in contact with you so that they can access your products and services.\
In order to encourage users to complete your forms, though, they have to be user-friendly. If a form is lengthy, unorganized, confusing, or challenging, a user isn’t likely to complete it. And that hurts your business.
Here are some tips to help make your forms user friendly:
- Clearly name the form; briefly explain its purpose
- Keep it short
- Make sure it’s organized
- Make it simple
Consider this registration form from Searchbug for example:
First, the form is named and its purpose is explained. This is a registration form for creating an account. A user needs an account to order and receive Searchbug’s services.
Second, the form is short. It asks only for a name, email address, and password. Now, there are other pages to complete the registration, but each page is brief, clearly defined, and the user can see the steps ahead of time: User Info > Billing Details > Review > Complete.
Without these steps outlined, users might complete their profile with name, email address, and password and think they’re finished. If they are surprised by one page after another, they might wonder how many there are and give up the task completely.
Surprises and vagueness deter users. They don’t make you look professional and they compromise users’ trust.
Third, the form is organized. The information requested from the user is in a natural order. Name and contact information are foremost, then billing details, then review. The fields are also laid out in a single column. This keeps the user from getting confused and overwhelmed. Remember, online users have short attention spans!
Last, the form is simple. It asks for only the necessary information and nothing more. The field lengths match the required input, meaning they fit brief answers only. This eliminates room for error. For an even simpler way to register, users have the option to link an existing account. Finally, the form includes validation error messages. See below:
How Validation Error Messages Simplify Forms
Again, validation error messages are those red boxes that pop up on a form when a field has not been completed or has been filled out incorrectly. There are so many ways this can happen. Therefore, good validation error messages should be specific and helpful.
Check out this one from Searchbug:
Before users begin completing the form there is guiding information:
- “All fields are required.”
- “Min 8 char. Must contain a number or symbol. Case sensitive.”
This helps users complete the form on the first attempt. The more times users have to try to complete a form, the less likely they are to see it through to the end.
Next, check out the validation error message: “E-mail Address Format was incorrect. It should look like email@example.com.”
There are two things to note here:
- The message clearly identifies which field needs to be adjusted.
- The message shows exactly what the field submission should look like.
Have you ever seen a validation error message that just says, “E-mail address incorrect,” or “Enter a valid email address”? These are vague, weak messages that confuse, frustrate, and annoy users.
Don’t assume your users know what you mean or what they need to do. Your customers are busy, they are in a hurry, they are easily distracted.
Common Validation Issues
There are many places users can get confused when it comes to formatting information. The following are questions you should consider when setting up forms and error messages:
- Do I spell out the month or use numbers?
- Should I use a forward slash to separate the digits?
- Do I use a two-digit or four-digit year? One-digit or two-digits for the month?
- Card number
- Should I space or hyphenate between groups of numbers?
- How many numbers should it be? What if I miss one?
- Phone number
- Do I need the area code? What about the country code?
- Should I use spaces or hyphens?
- Does it go on one line or two?
- Where do I put my apartment or unit number?
- Should I spell out the state or use the abbreviation?
Unfortunately, these are just some of the questions. There are many more. The good news is that there are also many ways to help guide users:
Provide instructions along the way, like showing an example of the formatting (MM/DD/YYYY) or adding and labeling separate lines for the different parts of addresses or providing a drop-down box with options for acceptable responses.
And of course, use specific validation error messages. Don’t just tell your users that the information they input is invalid or unrecognized; tell them how to fix it.
What Can Go Wrong
The point of web forms is to provide you with useful information about your customers so that you can run your business. That means that the information your customers put into the form needs to be valid and legitimate. There’s no sense in uploading invalid information to your database.
Validation error messages help your customers input valid information by giving clear instructions on how it should be formatted. This ensures that you get the information you need without having to fix it later. However, there are still some things that can go wrong.
Bot Form Submissions
Your forms need to be easy enough for your users to complete, but not so easy that a bot can submit forms. Bot submissions provide you with unintelligible or unverified information that can lead to TCPA violations, not to mention polluting your database and skewing your metrics. (You can read more about how to prevent bots from submitting forms here.)
Fake Email Sign-ups
There are also instances where users will complete a form using a fake email address. They might want what you have to offer—a lead magnet, perhaps—but don’t want to receive follow-up campaigns. But this can be avoided as well. With a data validation API, you can catch spam traps and invalid email addresses at the point of entry. (Learn how to stop people from signing up with fake email addresses here.)
Even if you use a data validation API, you should still clean your email list regularly. Email addresses that you successfully verify and upload to your database decay and need to be removed sooner rather than later. Sending emails to invalid, outdated, and abandoned email addresses increase your bounce rate and affect your deliverability. Clean your list using an API or batch email verification tool and learn more about how to fix and prevent
Validation error messages are important for two main reasons:
First, they help guide users through the process and increase form submissions giving you more, better leads. Second, they help protect your database.
It’s important to remember that when your users are online, your competitors aren’t limited to businesses that have similar products and services to offer. You are competing with all potential distractions from your form, online or otherwise.
Create a smooth path from start to finish. To catch those goldfish, keep your forms clear, short, organized, and simple. After 8 seconds, if you haven’t reeled them in, they will swim away.