I noticed this issue a few times. An app has a settings page where the settings are split into different tabs in a tab control. I hit update, an error shows up and I scan the current tab for the error-ed field and it's not there. Then I start scanning each tab looking for that field.

Isn't the proper high usability way is to automatically switch to the tab containing the error... and highlighting the field? The user is directed straight to the problem field.


You are absolutely correct.

LukeW discusses this in one of his writings:

  • "Clearly communicate when an error is blocking someone from completing a form. Error messages are arguably the most important element on a form when present. Make sure they appear that way!
  • Display error messages in context so they can be resolved quickly.
  • Provide actionable remedies that enable people to resolve errors easily.
  • Top-level error messages should indicate an error has occurred and how it can be resolved. If multiple errors exist, they should be listed in the top-level message.
  • If any input fields are responsible for an error, clearly mark them with a double visual emphasis to ensure they are noticeable.
  • Visually associate any responsible form elements with a top-level error message to clearly communicate they need to be resolved in order to continue. "
| improve this answer | |

At the very least you should be switching to the tab with the error on it, and highlighting the field with the error on it, yes.

I'd also recommend:

  1. Highlighting the tab with the invalid entry via an "error" icon as soon as the error is present (making it not ugly is outside the scope ;-)). This would indicate that something is wrong on the tab well before the user gets to the commit action, so the switch back to that tab may not be a complete surprise.
  2. Trying to provide an example about what the right value would look like.
  3. You may also want to mark the rest of the dialog insensitive until the field is corrected---whether that's a good idea depends on what the field is and how it's related to the rest of the dialog---i.e. you shouldn't mark related fields insensitive if changing their values would make the offending field OK.
| improve this answer | |

That sounds like an awkward way to present an error anyway because either the app is indicating there's been an error, but not showing you what/where it is - or - even if it did switch tab to display it automatically, then it's going to rather rudely flip you out of your current context, in such a way that you forget which tab you were on when the error happened.

All LukeW's points in @Matt's comment are very worthwhile following.

On the basis that there might be a potential for multiple errors, then if they must be presented within their corresponding tabs, then at the very least, each tab could be highlighted in some way to show it needs your attention. Still - about error reporting - like the old joke says: 'If I wanted to go there, I wouldn't start from here.'

| improve this answer | |
  • So how is this to be done exactly? The error message is a top level message. Are you suggesting to change the tab background color or border color of the error tab to highlight it and so the user will know the error is in that tab? What if there are two errors in two different tabs? – Tony_Henrich Jun 27 '11 at 21:03
  • yes - icon, border colour, whatever - apply to each tab. – Roger Attrill Jun 27 '11 at 21:52

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.