How to Make Your Form Error Messages More Reassuring

Filling out forms isn’t always an easy task. No matter how simple you make it, users will make mistakes. Do your form error messages give users a feeling of worry or comfort? Error messages that are too alarming can make users abandon the form to seek safety from the unknown.

Error messages that reassure users can make it easy for them to correct their mistakes and continue with the form. The design techniques below will help make your error messages more reassuring so that users feel comfortable completing your form.

Avoid Negative Words

Words that have a negative tone have no place in form error messages. Negative words can make users feel like they’ve made a huge mistake, leading them to think the situation is worse than it is.

When users feel fearful or anxious, it’s hard for them to think rationally to fix their mistakes. You don’t want to scare users to the point that they have to call on someone else for help when the issue is easily fixable. And you don’t want to scare them so bad that they leave your form.

There are ways of telling users they’ve made a mistake without making them feel like they’ve made a mistake. Don’t put the user’s focus on themselves by emphasizing that they made a mistake. Instead, put their focus on the form by pointing out what they need to do to fix the errors.

The tone of your error messages should feel polite and professional. The choice of words you use in your error messages affect the user’s emotions. Choose to use reassuring words, not negative ones.

Highlight Error Fields in Orange or Yellow, Not Red

Red is the most common color used to highlight error fields. It’s effective in making them visible, but it can also overstimulate users and raise their pulse rate, making them feel like they’ve seriously screwed up on the form. Red is also associated with danger, which is not what you want users to feel when they make a mistake.

Orange and yellow are warm colors that not only make error fields visible, but they make users feel less alarmed when they see it. These colors do not have as long of a wavelength as red does, and is less intense. Users are less likely to panic when they see an error message in orange or yellow color because it’s not as physically stimulating as red.

Specify Why Field Info Was Not Accepted

Sometimes it’s not enough for an error message to just tell users they made a mistake. Your error messages should tell users exactly why their information got rejected.

For example, an email field should tell users they need to include the ‘@’ symbol if the user leaves it off. It should also tell users to include the domain if they leave that off too. This is more helpful and specific than just telling users that the information they entered is not valid.

Avoid Error Summaries, Place Error Messages Next to Labels

Seeing a large summary of errors at the top of the page doesn’t make users feel comfortable about fixing them. It’s discouraging to read and forces users to have to recall those error messages when they go to the fields to correct their mistakes.

Error summaries magnify the seriousness of the mistakes when they’re grouped in a long bulleted list. When most users see that many errors at once, they’ll likely give up and forget about fixing them.

A less overwhelming approach is to place error messages next to the field labels. Disabled users will appreciate this because it allows their screen reader to read the error message and the field label together to correct their mistakes.

Showing them an error summary forces them to have to remember the errors when they get to the fields. And showing both the error summary and error messages next to fields forces too much work on the user.

Show Error Messages One Field at a Time

An even less overwhelming approach is to highlight the error fields and display error messages one at a time when the user selects an error field. This allows users to correct their mistakes faster due to less noise and distraction on the form.

Callout bubble error messages pointing to the fields are an effective way to do this. However, your callout bubble should not obscure the label for the selected field. When the user selects a new error field, the callout bubble for the previous one should disappear, and a new one should appear.

Validate Fields with Multiple Requirements Before Submission

Certain fields, such as username and password, have multiple input requirements for security reasons. Rather than giving users an error message with a long list of input requirements after submission, validate these fields beforehand. You can do this by placing a callout bubble next to the field. Each input requirement should light up green as the user’s input meets it.

Completing a form takes time and effort. Don’t make users spend more time and effort on your form by giving them alarming and overwhelming error messages. Reassure them that the mistakes they make are no big deal and easily correctable.

Error messages have a bigger impact on form completion rates than most think. Don’t make the mistake of ignoring your error messages, or you’ll find users leaving your website for another one.

Book

Affiliate