Colour coding validation messages and general messages

Question

I am currently working on a website which has a lot of validation messages (e.g. you successfully logged in, The address has been saved, Some items are out of stock and so on) we provide customers with accounts and they are able to save their addresses and other information on our site.

I am currently working on guidelines for validation messages and we had idea of separating them into 3 areas: success messages(green), general messages/tips(blue), errors(red). But documenting all of our current messages I noticed that usually success messages and general messages/tips are very similar and even interchangeable sometimes. For example you have successfully logged in could either be general message or success message, same goes for your address has been saved. If we end up using green what kind of messages classify as success (you have logged in, details saved etc?).

Question is: Is there a benefit of having success messages to be displayed on top of green background, instead of just using a blue background for both general tips and success messages.

I feel that only by just typing in this question I have got an idea of how I should approach this, and what should go where, but I would like hear your educated opinions on this, maybe someone has tackled similar issue before?

Answer 1

Yes. There is merit in having different backgrounds or color codes for general tips vs. success messages. I think it becomes clearer if we create a broader categorization - user action messages and system messages. (we can come up with better names :) ) The difference between these categories is:

• user action messages are a direct result of user's interaction. Green (for success) and Red (for failure) could be used here. It's good to stick to these because most users are accustomed to what these colors imply (green for Go, red for Stop). And in most cases, one shouldn't even need a supporting text message. Relying on user's prior knowledge or experience is always a good strategy. As opposed to expecting them to learn a new color coding standard (e.g. blue for success messages)
• system messages are those that the user didn't ask for or might not be because she interacted with the system. These are more of the general tips / additional information kind of messages that you mentioned. These can have messages like "Hey! check out our new feature." or "Here are some recommendations." And these can be displayed in blue (or any other neutral color).