Within a form, is it enough to just display an icon next to the required field and void the instruction text saying "* required fields"? In addition to that, is there a specific style (shape, color) for the required field icons?
Required field markers, IMHO, are anti-patterns that have morphed into a user expectation and now not having them is actually a problem.
I've come to the conclusion in user testing I've seen. I've long been a proponent of a) never show optional fields if you can avoid it--only ask for what you need or b) if you must ask for an optional field, make it the exception, and instead of marking required fields, just mark the optional field.
Alas, in user testing, invariably, users kept mentioning that they didn't know which fields to fill out since the required identifier was missing.
So, as much as I hated to add them, we did.
Personally, I'd still suggest trying the former and only go with the latter if need be. In general:
- only ask for information that you absolutely require
- and then, note that 'all fields required' somewhere prior to the form.
If that fails testing, then consider sticking in the required field markers.
In additional to that, is there a specific style (shape, color) for the required field icons
Again, I'd call it more of an anti-pattern, but it appears that users tend to expect a red asterisk. (Behind the scenes you can then add a TITLE attribute or make it a tooltip to expose the 'required' text).
Required field label has some forcing accent also user can feel that they are treated as a little foolish person. The label sounds like "I said write it here! Don't you understand?". It is not very user-friendly.
So if you try to be more friendly to user, don't use such labels. Leaving only relevant and reasonable (small) amount of field will make form filling process both easy and understandable. Of course, implement gently error messages, which don't abuse users.
The other thing with instructional-styled forms. It could be some government sites, visa registration, etc. where
- user is not expert (lack of understanding)
- price of errors is rather high (time or money)
Though this doesn't mean the instructional style should be rude, just be a little more demanding (for user's sake).
Could you split the form into two sections? This would stop the user having to check required/not required for each field and they can concentrate on the content.
You could go even further and have a submit option halfway through the form.
If you chose to go with an icon, you might get away with a tooltip that appears when the icon is hovered over. However, It needs to be obvious that the icon means "required" and that you can interact with it. Compared to the effort to show the icon along with the words "required field" may not be cost effective.
I would go with red - it's pretty much the de facto standard. A simple asterisk is common.
A few more thoughts: I would suggest any error messages appear next to the problematic field - if an email address is invalid, tell me that next to the email field. If you show that message at the top of the form, I have to go hunting for the erroneous field.
Also, try showing such error messages as soon as the field is skipped over (the field gets focus and loses it without a satisfactory input) or as soon as an error is made, like a zip code with too few digits. Letting users correct errors one at a time is less intimidating and jarring than a screen full of 18 error messages.
Some quotes from L. Wroblewski's Web Form Design: Filling in the Blanks:
- Try to avoid optional input fields in forms.
- If most of the inputs on a form are required, indicate the few that are optional.
- If most of the inputs on a form are optional, indicate the few that are required.
- When indicating what form fields are either required or optional, text is the most clear. However, the * symbol is relatively well understood to mean required.
- If you do use * to indicate required fields, don’t forget a legend that explains what it indicates.
- Associate required or optional indicators with input labels to give people an easy way to see which questions need to be answered.