When done correctly, validation is a powerful tool that helps you collect the right information in the right format. When it’s done incorrectly, it can decrease your number of leads, sales, and submissions.
Put simply, if you’re not careful with form validation, it can negatively impact your bottom line. Here’s how you can use form validation to your advantage.
Provide Actionable, Specific Validation Errors
One of the most important aspects of validation errors is to always provide enough details to make it easy for the user to correct the problem.
Imagine you’ve just filled out a long form and you hit submit only to be told: “The value in the ‘Home Phone’ field is invalid.”
You take a look, and you’ve entered: “206 384 4671.” That seems right to you, but then you think, “Hmmm, maybe they expect hyphens.”
You change it to “206-384-4671” only to get the same error. Now you’re starting to get frustrated. You’re consider abandoning the form and finding somewhere else to do your business.
You give it one last try and enter “2063844671” and hit submit. Success! The error is gone! But you’re left with a bit of a bad taste in your mouth.
This type of vague error messages can hurt conversion rates in a big way.
The solution is simple. Provide clear and considered validation messages that tell the user how to fix the problem.
In this example, the error, “Please enter your Home Phone in this format 7788383202 (10 digits with no spaces),” would have solved the problem on the first pass. But why wait for the user to hit submit before letting them know the value is invalid? Read on to find out how you can make the validation process even easier and improve your bottom line.
Use Inline And Real-Time Validation Errors
In the above example, the user entered an invalid phone number. They continued filling out the form, got all the way to the bottom, and then hit submit only to be told there was an error way back up in the home phone field.
They returned to the home phone field, re-entered a value, scrolled back down, hit submit, only to be told it was still invalid! This is where your users start to get frustrated, and the point at which they might abandon your form. You can avoid form abandonment and see completion rates skyrocket by using inline validation.
Inline validation simply refers to the process of showing an error right next to the field containing the error. As soon as the user enters a value and moves on to the next field, an error pops up and tells them (with an actionable and specific message) how to correct the value they have just entered.
They correct it, and move on. Voila! One simple change and you’ve just saved your user plenty of time and frustration, and with that easily increased your conversion rates.
Make Your Form’s Validation Unobtrusive
When using inline and real-time validation, be sure to make the validation unobtrusive. If you over do it, your attempt at being helpful can get in the way. For example, you don’t want to start showing error messages about an invalid phone number the first time your user start typing their area code.
Only after users leave the field should the validation run. When the user returns to the field, the validation can run on key press as the user corrects the field.
This enables you to change the error messages to a success messages as soon as your audience corrects the problem. This is helpful as the user does not need to click outside of the field to check if they’ve corrected the error. Logiforms does all of this automatically.
Best Practices for Unobtrusive Inline Validation
- Do not enforce required (not blank) validation until the first submission attempt. Often users jump around while filling out a form. You don’t need to tell them about a missing field until after they click submit. Remember, using a red required asterix can help let a user know which fields are required.
- Enforce formatting validation when a user leaves a field and show an inline error message. When a user is correcting an error, validate on key press. Immediately inform the user once they’ve corrected the error.
- After the first submission attempt, validation on all fields should run on key press. It will let the user know validation errors have been corrected – in real time.
These best practices will guide how you approach form validation and improve your forms’ performance.
Remember to Keep These Form Validation Industry Standards in Mind.
- Reserve the color red for validation messages and alerts. Do not use red in your labels and text. Red is the universally recognized color of an error message. It will help your users quickly find any errors
- Validation error messages should describe exactly what the error is. Avoid vague error messages.
- Provide confirmation when a validation error is corrected.
- Communicate any formatting or out-of-bounds entries in real time.
- When validating inline, do not interrupt the user to provide validation error messages.
- Enforce required field validation only after the first submission attempt.
- On a failed submission attempt, consider scrolling to the first field error to make it easier for the user to correct and re-submit.
- On Submit, provide all applicable validation errors. Do not provide one error, allow the user to fix it, and then show another error when they click submit the next time.
The takeaway? Your form validation should be unobtrusive. It must provide actionable feedback. That’s why Logiforms does this for you automatically. Watch our tutorial to learn more.
We’re amazed at the increased conversion rates we’ve seen when form validation is done right. Give it a try with logiforms and let us know how your conversion rates respond.