Should I throw an error or a info message when a form fails to submit because of user error?

Question

I have a form where the user can add a drink recipe. There's a couple of details that needs to be provided in order to successfully add a new drink to the database

• a unique name
• at least one ingredient (with a name) and
• at least one tag must be selected.

These things are of course handled on the client side with Javascript. If these verifications fail, for some reason, I need to do this on the server side before the form is submitted to the database. I also must return a message about what went wrong.

So, I do a couple of checks through PHP's if/else statements, and return an array of messages back to the user if any of the checks fails.

This php.message.class that I've created has 4 types of messages (for now):

• error (symbol: red circle with an "X")
• warning (symbol: orange triangle with an "!")
• information (symbol: blue square with an "i")
• success (symbol: green circle with a white big "V")

The messages that is returned is of informational type, but it holds an error response. What do you think?

Answer 1

For me, it's not clear what the distinct difference will be between an error and a warning. Also having four different types of messages could give an information overload. When filling in a form, as an user, I just want to know if I'm doing it right or wrong. Just straightforward and as simple as possible so I can race through the submit.

Right now, based on the way you asked your question, I think you're in a developer mind set and your messages will reflect that. I don't know what kind of message you'll convey to the user when for example the unique name of the recipe is already taken, so off course I might be wrong.

I could give you some insight from personal experience when trying to set up the perfect registration form.

Error before submit
The users I tested hated having to submit the form before finding out if they entered their information correctly.

"I hope I entered the information correctly this time". submit

So run the validation when users are typing or have just entering the input field.

Give clear messages
The question "Why isn't it valid" was often heard, because the error message told the user the password they entered when registering was not valid. When telling them it had to be at least eight characters long they understood immediately.

Give messages at the right location
Some users gave a remark on the fact that the error messages were shown right beneath the input field it concerned. They were used to error messages shown at the top of page after which they had to find out what input field it was concerned.

Automatic help
The users were complementing us for filling in some input fields, like their address, based on information they already filled in (their postal code and streetnumber). This might not be useful for you since you have three inputs, but you could do it: you could add tags based on part of the name and some of the ingredients they fill in. If the tags play a big part in finding recipes, you could fill some tags in automatically in order to ensure every recipe comes with enough tags.

I hope this helps.

Answer 2

It should be an information dialog.

You're informing the user of something they didn't know. It is not an error. If you're a human and someone hands you a form with "W" in the "age" field, do you yell at them "Error! You gave me a bad age!", or do you politely ask "I don't understand what you wrote in the age field, can you tell me your age"? Bad input isn't an error, it's just a situation that needs to be handled.

If a user is trained to think that a simple input validation is an error" they will learn to not take error dialogs seriously. Then, when a genuine error pops up they'll be inclined to dismiss it as "oh, I probably typed something in wrong" and not take the time to read and understand the dialog.

Answer 3

You should show your message styled as an error message, not an information message, because there was a problem.

An error message merely containing information doesn't mean it should be styled as an information message, because errors should always contain information. An error which contains no information, like the following...

Error: error: There was an error caused by: error

... should, naturally, never be shown to the user, even if some unfortunately programmed library could produce an error message like this. Naturally, they ought to be provided with useful information about what went wrong and what they can do about it (insofaras they'll care).

Define cases for where to use your Information style

You should probably work out a well-defined standard for when the information style should be used. It's obvious enough for error, warning, and success messages, but it's particularly important to work this out for a class of message such as "information" because of how vague that name is.

Consider for a moment that all messages in your website will probably be information, but you wouldn't want to mark all of those with an information icon.

An information style might actually not be useful: for instance, the blue styling on one of my local government's websites is actually a direction style instead, and is used in the case where someone is being informed about related, but tangential, information or services. All other messages providing them with information are just plain text.