Would it be good to only show invalid fields when showing input errors?

Question

It occurred to me that it might be a clever idea to only show the fields with problems when a user makes a mistake on a form. This would be server-side validation, with the assumption that there is already client-side validation in place.

On one hand, it seems like it would be beneficial in that they are not hit with another wall of fields, with the possibility of making a mistake in one of the ones that is already validated.

Though on the other hand, it might disorient the user. Or worse, they will miss the opportunity to notice valid mistakes in their previous submission (e.g. wrong phone number).

Has any usability research been done in this area? What are your thoughts?

Answer 1

I don't know about academic research, but here is an article that explores this avenue (option #4).

They recommend displaying a summary of the form data (in this case address data) in order to reduce the chance of disorientation (as you mentioned) and additionally provide the user with a way back to the original form, in case they actually do want to go back and modify their input.

From their summary:

The “error fields only” approach is usually best when inline validation wouldn’t quite work. In April 2012, we benchmarked the top 100 e-commerce websites in the world and found that only 8% use live inline validation during checkout (likely due to having to validate both postal addresses and credit cards). In general, the longer the form and the more complex the inputted data and its dependencies, the more likely the error-fields-only approach is the best choice.

...

On smartphones, the error-fields-only approach has an advantage over the same-page-reload technique, because users typically lack an overview and context of the form due to the small screen. In such cases, displaying only the erroneous fields would help the user focus on the task at hand.

My personal intuition is that this approach will work in most cases with the aforementioned benefits; the reason that this approach isn't taken more often is simply because it is more technically complex than "reshow the form with a validation summary". That said, however, you need to keep in mind that if your form data can't be easily summarized for the user, this approach might actually decrease usability over just reshowing the form with errors.

Answer 2

Few considerations:

• If I see "Error Fields Only" after pressing a submit button, I would presume I am at a page next to previous page that had all the fields on it. That gives a sense of completion or moving forward in the direction of your goal.

• Because of having less fields to look at, getting them right is more likely than showing them in the presence of additional fields which have already been entered correctly.

• A worrisome aspect of this approach would be re-arrangement of form elements and elements appearing in different visual groups than before. That also means for different error fields, different groups will be made. In the forms, we put logically related fields together, like First Name, Middle Name, Last Name and In Address, First line of Address, Second Line of Address, Post Code, State, Country. Now what if Middle Name and Second Line of Address had error and combination would be something like.

Middle Name

Street, Suburb

Social Security number

Even thought its not wrong but you are missing some information which sets your context right. A solution to that could be to group logically related elements show them together even if one of the fields from that group had an error. But this "solution" is kid of "killing the essence" of your approach.

• How will the user see all the from fields if he needed to? Will you place a button "Show all fields"? or would you use "back" link? In case it is show-all fields button and user finds all fields on the same page, error fields will re-arrange themselves in their respective groups? If so then user would have to re-scan the whole page and spot them. In case you choose to use "back" button, you have increased the cognitive load for such user considerably that he is moving forward and backward in a form.

Conclusion: I see there is some gain which the approach would provide but this can lead to possibilities which are far more complex and difficult to manage. If you just wanted users not too worry about "Correct Fields" and only focus on "Wrong Ones", you may reduce the visibility of correctly entered fields by 40% and also putting a TICK MARK next to them but leaving them accessible and intractable if user wanted so.