How to represent optional fields?

Question

I've read somewhere, that if you have more required fields than optional, best practice is to mark the optional form fields.

However I think that asterisk notation for required fields is a widely known pattern. The form will be used by novice/beginner web users, is the above statement (marking the optionals) still better?

---

Update: @Janel: thanks for clarifying my question, I have to practice this language a little bit more, if I'd like to work abroad later :). It's important however that there are much more required fields than optional (if there would be eg. 3 optional and 4 required field, than I'll definitely mark the required ones - but there is 12 required and 5 optional fields on one page of the form)

Answer 1

Good question. There are two opposing considerations here:

1. Marking exceptional fields. You want to highlight the fields that aren't like the others. This way you can mark fewer fields in total and reduce visual noise added by each highlight.

2. Following convention by marking required fields. Since users are used to forms highlighting only the required fields (with an asterisk, for instance), suddenly flipping that model on its head could be counterintuitive.

I admit this is an interesting challenge. My approach would be to A/B test it and see which leads to better conversion. Forms are one of those bottleneck points where you can do some really accurate testing. I'd be curious to hear the results!

Answer 2

Since you have fewer optional fields than required, the best option here is to simply mark each optional item with the word 'optional'.

See Luke Wroblewskis comments on this topic Marking Required vs. Optional form fields

---

Update: I had to share this: Whatever you do - don't do the following which I found at onlinerealestatesuccess.com:

Answer 3

Of course, lot's of red asterisks will add noise to form. But, I think that removing them from required fields will confuse users, which will inflict conversion rate of a form.

The only option here, is to write before the form something like "All fields are required, if otherwise isn't stated" and write "optional" near labels.

UXMovement article about this topic

Answer 4

I find that tagging a question as '(optional)' can be white noise -- especially if you're already using that familiar convention of denoting required fields with an asterisk. But as you've mentioned, if you have more required fields than optional, it can be useful. They can figure out that those without an asterisk are optional. Case in point: for the 2011 British census all but one question (on religion) was mandatory. In this instance they indicated 'this question is voluntary' (see below) to indicate that this was the only question on the multi-page survey that wasn't required.

But to contrast this thought there's the example of Ethn.io, where all fields on their screeners are optional, yet there's no guidance to say so. Yet, I'm always intrigued to see my recruits people filling in every field!

As Rahul mentioned, testing is the best way to gauge results. Even some quick hallway testing will net some great results!

Answer 5

I thought you might be interested in Baymards latest research: http://baymard.com/blog/required-optional-form-fields

The summary is that:

• When benchmarking the top 100 US checkout processes, only 9% of the sites explicitly marked both field types
• By explicitly denoting both optional and required fields the user isn’t forced to infer anything and can stay focused on just the field they are filling out and are consequently able to progress seamlessly throughout the entire form field by field without any back-and-forth scanning of previous fields.
• The most common mistake – made by 63% of the top 100 e-commerce checkouts – is to only denote one of the types
• When testing mobile checkouts, 75% of the test subjects experienced severe form usability issues on sites that failed to mark both required and optional fields clearly.

I think this isn’t as black and white as is made out within the article. Let me explain why. Taking the salient insight here of “both optional and required form fields should be indicated” the recommendation is to, simply put, “add one word (‘optional’ or ‘required’) next to each field”.

Did you find any issue or trouble with this? For example, some assumptions I would make on user behaviour here is that users would scan this label as:

• it’s almost like a disclaimer such as that at the top of your Target example which users dismissed
• it’s another word that users have to read and as Steve Krug says – get rid of half the text on your page then get rid of half again
• when users scan the page, which they will as indicated, this is not just an additional word, but a 3 syllable additional word that could be quite hard to interpret
• maybe this is just a design element in the example you gave – but because optional isn’t a stand out element from required or visa-versa, they look exactly the same and therefore non-differentiating.

Contextually, I think there are still issues. I’m not debating the point at all, just the implemented or recommended solution. Adversely, then again, if you were to place “optional” and an “*” you are almost comparing apples and pears to a word mixed with a symbol that users have to associate to an action.

Answer 6

I like to split the optional fields into a separate section, usually below, the mandatory fields; mixing up optional fields in between the mandatory fields, I suspect, increases completion times...

eg http://oscr.org.uk/meeting-our-requirements/how-to-complain-about-a-charity/charity-complaint/