What's better UX: Letting users completing a form with errors marked inline? Or, block the rest of the form as soon as there´s a wrong field?

Question

I'm using inline validation (on blur) as soon as the user clicks/tabs another field.

Is it good to block the rest of the fields (previous and following) when a field is validated?

The case is: Asking a user to fill in "weight" and "dimensions" of a container that MUST meet a weight/size limit. There's no way the form can be sent if the input surpasses the limits. If the user doesn't fill a valid weight/size, there's no sense in filling the rest of the form as the form is not going to be sent anyways.

I believe that blocking the rest of the input may be frustrating, but I'm just wondering if this behavior will help the user notice or focus on the "invalid" field as soon as the error is detected.

Or perhaps it will prevent the user to waste time filling the whole form when they are warned about the incorrect field.

Maybe the better option is to provide inline validation and let the users fill the form in whatever order they fancy, and just hope they check the "red" fields before hitting "Send". And recall all the red fields when the hit "send".

Answer 1

Just to offer an alternative solution, which I believe would work best:

This sounds like a situation that might benefit from having the form split into various subforms (even if technically it's still one). This however only makes sense if you actually expect people to come to the form with the intent to do something that actually is not possible/allowed with the form. From your description it sounds like this is the case, however you are in the best position to judge this. In the end this introduces one additional click and does enforce a certain order in filling out the form, but if this causes less wasted time it could well be worth it. Please note that in case the requirements for the form are not met you shouldn't just display an error ideally, but just go to "another step 2" that consists of the 'error message'.

Answer 2

Do not block the user from completing the form. Allow them to complete the form and fix the errors after.

A study in 2007, titled Usable error message presentation in the World Wide Web: Do not show errors right away, was done by Javier A. Bargas-Avilaa, Glenn Oberholzerb, Peter Schmutza, Marco de Vitoa, and Klaus Opwisa.

Study abstract:

Online form validation can be performed in several ways. This article discusses two empirical studies with 77 and 90 participants, which have found evidence that the best way of presenting error messages is to provide the erroneous fields after users have completed the whole form. Immediate error feedback recommended by the International Organization for Standardization (ISO) showed the worst performance in these studies. Where presented with immediate feedback, users often simply ignored the messages on the screen and continued completing the form as if nothing happened. These results lead to the postulation of the “Modal Theory of Form Completion”: Users are in either “Completion” or “Revision Mode” when filling out online forms. These modes affect the users’ way of interaction with the system: During Completion Mode the users’ disposition to correct mistakes is reduced, therefore error messages are often ignored.

In short, users tend to have two different modes when completing a form: completion mode and revision mode. They will complete the form first and then fix errors, even if errors are presented in real time inline with the form fields.

The study found that users tend to ignore immediate error messages when they are in completion mode. It found that the most productive way of returning errors was embedded in the form all at once, after the user had completed the form and attempted to submit.

Punishing the user (i.e., blocking them from continuing) is not appropriate when they've made a simple mistake. However, based on your specific work flow and needs, it could be appropriate to display an inline message that weight limits are outside a required range -- but allow the user to ignore this and continue if they choose. When the submit the form, they will address the error when it fails to submit.

Answer 3

Error messages are generally a result of the interface not being clear enough for a task to be performed correctly.

Perhaps you should consider informing the user how to complete the form correctly before / "in-time" rather than the users going through all the trouble of completing a form only to be told after that they did it wrong.

Its like your airline didn't tell you to bring a passport or boarding pass until you arrived at the airport. All in all it leads to a bad user experience.

A simple help/input-restriction text near the input field would solve this problem. In the case that the users still make an error you can always rely on your trusty error message!