What is a good way to indicate a field is mandatory?

Question

I would like to indicate to the user that a particular textbox or combobox is mandatory. What is a neat way to do this?

Currently, I have a gradient red border around the textbox when the text is null or empty, but it seems a bit much when you show a form and a number of the fields are red. I'm looking for something that is clear, but is not so overwhelming to the user. Something subtle.

I would prefer to make the textbox indicate that the field is mandatory rather than say make the label bold or have an asterisk. What are my options or any ideas you might have.

Answer 1

you can also change background color of textbox..

Answer 2

Just put a * in front on the mandatory fields. It's simple, yet effective. I think most people will know what this means. Also, when they try to submit and it fails, because some mandatory field was not filled in correctly, then you let the user know which field they need to change (by using those red borders, for instance). I think this is what most people are accustomed to.

Edit: I saw that you didn't want to use an asterisk by the way. I still think this is the best option, simply because I think most people will recognize it right away and know what to do :)

Answer 3

It depends on your design, of course, but I prefer something simpler like the labels of the input being bold. The red outline, while clear, does have an "error" connotation associated with it, which might be misleading to the user. Bolding the labels is subtle, but easy to understand without being an eyesore.

Answer 4

I like the jquery 'example' plugin for text input fields. A subtle grey inlay for instructions or sample input.

See demo page here for an, ahem, example. http://mucur.name/system/jquery%5Fexample/

Depending on how many fields you have, it might be too cluttered, but light-colored, italicized text like:

first name (required)

last name (required)

might work for your app.

HTH

Answer 5

A recent usability study suggests taking the opposite approach and indicating which fields are optional rather than required. Furthermore, try to ask for only what you really need in order to reduce the number of optional fields.

The reason is that users tend to assume all fields are required anyway. They may not understand or pay attention to the asterisk, whereas they readily understand clearly labeled optional fields.

Link to the study (see Guideline 5): http://www.cxpartners.co.uk/thoughts/web%5Fforms%5Fdesign%5Fguidelines%5Fan%5Feyetracking%5Fstudy.htm

Answer 6

I do it this way. Mark the left-border of the element with 2px Red color.