Is it okay if error messages always appear in the same place on a website? I know the right thing to do is place errors inline, close to where the error occured. But there's hundreds of errors that could happen when users play with my site and I don't have the time to create customized inline errors for each one. I'm proposing that I slide down a red box at the top of the page whenever an error occurs. The box slides back up and disappears in 5 seconds.


Since the error message always occurs in the same place, won't users be trained to look up there whenever something bad happens, even if they're clicking somewhere low in the page? And is there any better alternative to designing this generic error?

  • 4
    Error messages disappearing in 5 seconds does not sound like a good idea. Commented Jan 4, 2011 at 7:34
  • 1
    'At least add one file' reads better than 'Add at least one file,' I guess.
    – user371
    Commented Jan 9, 2011 at 0:17
  • While I understand the desire to cut down on the amount of work you have to do when building the site - what development project doesn't have a tight timeframe? - this kind of shortcut seems like a bad idea to me. Broadly speaking, trading worse UX for faster development is seldom a good idea.
    – Bevan
    Commented Jan 9, 2013 at 21:17

4 Answers 4


I usually like to show an error message on top that summarizes all errors on the page, plus in each location, highlight what is wrong.

For example with a form, on top you would say that email, phone and address are required, and in the form, set all of these three fields in red with a text along the lines of "this field is required" (or something more specific, depending on how it failed the requirements).

However, I usually keep the error message [on top] always open (because quite a few customers complained the message was gone before they're done reading it, so leaving it open (instead of disappearing after a few seconds) made everyone happy).

So in short for your question, yes they will be trained to look on top (Twitter does it too for example), it's the natural thing to look when something suddendly moves, but if you can add extra hints, so much the better. And I might suggest not to auto-hide the message, give a "close" button option instead (I quite like how StackExchange does it personally).

  • I think his main problem is that he doesn't want to have to create individual inline error lines. He might be able to get away with that if the error types are simple or intuitive (e.g. required field is empty, malformed email address ...), but if there are multiple error types per field that are less than intuitive, then he might need to do more than just highlight the field. Perhaps he can have the top error dialog change to a detailed error description of each field on hover. Commented Dec 31, 2010 at 7:20

How about a compromise between showing inline messages, which I agree would take a lot of time, and having a slide down red box? Instead, show your red box just about where the error happened. You can then:

  • Leave it for 5 seconds as you suggested, or,

  • Have it go away only when the user has fixed the problem, or

  • Have the dismiss button or close icon


Proximity is good for error messages, but having all the error notifications in one place has advantages too. The user learns to always look there. Now Apple puts all the notifs of the iPad at the top of the screen. Web browsers do that too with their yellow bars. As users, we get used to look there. Generally, the top of the view is a good place to put messages.

However, making a message disappear from its own after 5 seconds is a bad idea. This is against the W3C's accessibility guidelines, this harms accessibility, this harms usability. The Web page does not dictate where the user looks, neither during how much time, let alone the user's reading speed. Often we give instead a cross, or a button “OK”, that removes the message when clicked. If the removal of the message is a necessity. But leaving the message with the form as long as the form is not re-submitted is perfectly OK — as a user, I even prefer this.

I think “Add at least one file” is good, better than “At least add one file”. That is consistent with the button “Add files”.


Additionally, to make a few points explicit:

Do not remove your error message until it's corrected

Whatever error correction information you present to the user should last at least until they correct it. Your suggested method assumes that your user will always sit in front of your page, undistracted, and stare at only that page until the next action is ready to be completed. What if they switch tabs, answer the phone or sneeze violently after submitting that form section? They'll be back at your app page with an error and nothing to indicate anything is wrong.

Don't you already have your error messages?

You cite hundreds of possible errors that can occur as a barrier to making inline error messages. Why not simply displace (or otherwise show) the error text you've already prepared nearer to the input field that threw the error (since your mockup shows the error message to be fairly descriptive already).

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

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