Formisimo app includes a report specifically designed to show where and what type of corrections your users are making when filling out your online form.
We go into a high level of detail about corrections because what you can learn from them can help you prevent user-frustration and drop offs.
A customer journey that is held up by having to make corrections is one filled with friction. You should be aiming to reduce the number of corrections a user makes as much as possible.
The main data strip shows you on average how many corrections people who start your form (form starters) make. Scroll down for a breakdown by field name.
Formisimo’s Most Corrected Fields report shows you:
- Interactions – these are key presses and clicks. counted for each field of the form.
- Refocuses – a refocus shows that users are refocusing on the field, either with their mouse or keyboard. This shows that the user is checking the field again and alludes to confusion or uncertainty about what is required.
- Deletes – backspaces and deletes have users had to press in this field
- Cursors – how many times has a user pressed a cursor key in this field.
- Correction % – straight-forward enough, this is the percentage of corrections for the field, calculated as a percentage of the total number of corrections in the form.
- Health – how does this field compare to the rest of my form and others in the same industry? Health scores use a percentage and traffic light system – the lower the percentage is, the worse the usability of the field.
Why do users need to correct their inputs?
The data on corrections can point you straight to problem points in your form. Once you know a field is causing problems for users, you have to look at the context to start to understand why.
What might be causing your visitors to make those errors?
- Sloppy data input (by the user).
- Unclear labels (including compulsory fields).
- Unforgiving input requirements (of your form.)
- Lack of good (inline) validation and error messages
Is your field label clear and understandable to every single user? This is the first point of reference for every user; they read the label and mentally process, “This field is for…” Is there any ambiguity about what you’re asking for?
Another problem we often see in this category is when fields are not clearly indicated as optional or mandatory. Users will for the most part do as little as possible in order to successfully complete the process. If mandatory fields are not marked clearly, users may to try and skip over ones that they perceive to not be necessary to move forward. They’ll be greeted with error messages and have to spend more time than they’d like completing your form.
Unforgiving input requirements
If your form requires that information be entered in a certain way, you have to ensure that you do everything possible to let the user know this, or force them to enter it in a way that they cannot get wrong.
For example, there may be a postcode or zipcode field where a user could not enter a postcode without spaces. The result? Lots of corrections, with a 12% corrections rate in that field (meaning that 12% of all interactions in this field were correcting previously entered inputs):
If your error rate is high for one field, it may be because you do not accept information in a way that many users expect to enter it. For example, the format of dates, adding spaces between a credit card number and putting the country code in brackets when providing a phone number.
Does your form accept all variations of data formatting?
With a little bit of input from your developers, you can accept inputs in a variety of formats so your users with see less validation errors and be able to complete your form more easily.
Preventing the need for corrections
Prevention is better than the cure.
Label everything well
Leave no room for ambiguity.
Give clear instructions on data entry
Let users know before they start typing that data must be entered in a certain way.
Yahoo’s password field in their sign up form is a good example of this:
Force users to enter information in a particular way (that is not intrusive).
Gmail asks for your date of birth, but minimises potential errors by splitting the information into a drop down for month.
Gmail uses labels but also displays help messages. This is excellent error prevention. When you focus in a field, help text appears:
Provide error messages that help users correct mistakes
Although Gmail’s labels and help text do a lot to prevent errors, Google know that errors still happen and so they’ve also written helpful error messages for when things still go wrong. Error messages appear underneath the field as soon as you leave one without completing the information properly. The wording is friendly and gives tries to help the user correct the mistake.
Add inline validation
What is inline validation?
Inline validation refers to validating the form field as the user moves through the form. Twitter display ticks next to fields that have been positively validated:
In the Gif above you can even see flashes of the word ‘validating’, as Twitter show that they’re checking what you’ve entered passes their criteria.
While checking the data, Twitter also take the opportunity to help users correct their errors, by displaying a message relevant to the error. In the example above I typed ‘password’ into the Password field and was shown a message advising me, “Please enter a stronger password.”
This helps me, the user, enter correct information the first time around, preventing the need for corrections, reducing errors and ultimately making it quicker and easier to fill out the form. Making the process as easy as possible reduces the chance of drop offs.
Implementing inline validation
Implementing inline validation is easy once you know how. It can be done using the editor controls of several common form types.
For tips on when to trigger the help message and pointers on different technologies, here’s an article on implementing inline validation.
Placement of labels matters
Still seeing a high correction rate? Go back to basics and look hard at the how your form fields are labelled.
I’ve already talked about label text. It could be as simple as writing a label that more fully explains what the user has to do but labels can trip users up in another way too. Many forms are designed with the label for the field placed inside the text box.
In the example from Twitter above, the labels are inside the each field and become replaced by the information I enter. Suddenly that field isn’t labelled anymore. For many users that’s fine, they’ve finished interacting with that field. For others, labels inside form fields are harmful.
Using labels as placeholder text could cause users to correct the field for a few reasons:
- The label has to disappear once the user starts to typing. This increases cognitive load for dyslexic users and puts a strain on users’ memory.
- Users’ eyes are drawn to empty fields. Text already inside a field makes it harder to differentiate which ones have been completed already.
- The conversational flow, i.e. question, answer, question, answer, is interrupted, causing confusion and thus confused behaviour.
A note on high drop offs at the end of your form
Customers often ask us why the Submit button of their form has a high drop off rate. One of the main reasons to see this behaviour in your form is that users are submitting the form but failing to convert due to errors.
Adding inline validation and alerting users to errors as they happen, as outlined above, will reduce the number of users who quit the form when it fails to submit.