Take the 2-minute tour ×
User Experience Stack Exchange is a question and answer site for user experience researchers and experts. It's 100% free, no registration required.

I am currently designing a web form for the Online Travel Insurance System and I am thinking of hiding the optional fields since there were so many of them. Like the image below.

Hidden Optional Fields

I put a Show More link button that will show all the optional field under the Passport Details section. I also hide the Emergency Contact Information and Accompany section since all the fields under them are optional.

This will discourage the users from inputting a value in the optional fields, but I think it will improve our sales but I do not have any reference to prove that. Is there any UX case-study about this matter?


I have found this study from the UXMovement Site about user making mistakes:

... The lesson is this. When you put more and more fields and elements on your forms, you increase the chances of your users making mistakes. When you’re dealing with money, this can cost you.
...

share|improve this question
add comment

6 Answers

up vote 15 down vote accepted

It is generally accepted (and well proven) that shorter forms are completed more often than longer forms (with all else benig equal of course). However there are exceptions where some information is expected by customers, and leaving it out leads them to question the validity of the form.

'Shorter = better' is a good starting hypothesis, but one that you need to test in your specific situation.

That said, you have not addressed whether this additional information has any business value or not. If it does, you should weigh up the value of this information against any improvement in conversion.

I would also test changing "show more" to something that lets customers understand what the more is. So something like "Show optional fields".


Some references on short vs. long form conversion:
Lead Generation: Testing form field length reduces cost-per-lead by $10.66
Landing Page Optimization Tested

share|improve this answer
add comment

If you don't need the information (e.g. the emergency contact details) then why collect it?

Every extra field on a form increases the burden on the form-filler (they have to at least scan it to see what it is), increases the chance of error (as mentioned on UXMovement) and reduces conversion (as JohnGB refers).

As it is, I would suspect that significant numbers of people won't even bother looking into the "hidden sections", let alone answering questions there, so you might as well not have them at all. Of course, you can't be sure of this behaviour unless you test with the target population in a realistic setting.

FWIW, in your mock-up, I also don't think it is clear that the "Show more" link relates to the sections that are collapsed. If this is the case, I would use the terms "show" and "hide", and have these labels in line with the section heading. Furthermore, a down arrow is usually used to indicate a collapsible section that is open, rather than closed. When a section like "emergency contact" is closed, a horizontal arrow would be more appropriate.

Hope this helps,

Jessica

share|improve this answer
    
Thanks, the Show More button was actually for the Passport Details section, cause there were more optional fields on that section. The fields on the Emergency Contact Information is hidden since it is all optional. I'll ask our marketing first on the business value of those optional fields as pointed by @JohnGB. Thanks again. –  John Isaiah Carmona Dec 27 '12 at 9:15
add comment

As the above answer mentioned, if you don't need it why you collect it? And I want to expand on that can try to give you a better solution.

Most of the time, you need those optional information because the user might need to use some optional features that would require those optional info. So the question is not "do you need the optional info," but rather, "do the users need some features that might require those optional info."

Therefore, those optional fields are actually required fields if the user chose to use a certain optional features. So optional fields follow optional features. That means you can't hide the optional fields in a form, you have to tell the user why you are collecting them in the first place. In another words, you have to inform them what optional features they are missing out if they don't fill out those optional fields.

If those optional fields are not for any optional features, then you should not have them at all. For example, Gmail account sign up form, there are two fields that are optional, phone number and existing email. When you focus and then blur those fields, it will tell you what "optional features" you will be able to use if you fill out those fields.

share|improve this answer
    
Or collect the information right when the user is about to use an optional feature. –  greenforest Dec 27 '12 at 21:19
    
But it's not always so convenient to do that on the spot. Such as the optional feature that Gmail will send text message to your phone if you forgot your password, so when you forgot your password, it's pretty difficult to fill out that optional phone number now right? –  Andy Dec 27 '12 at 21:44
add comment

You are really faced with two problems in these situations. The first is with usability, and the second is with business. If the information you are collecting has no business value, then you can get rid of it and "maximise" usability. Otherwise, you need to think again.

I think the real problem comes with the traditional notion that most of us have about forms. The idea is that you enter all of the data, and only then is it submitted in entirety.

Ultimately, we want the user to convert/reach their goal. Instead of removing bits to get "closer" to the goal, you can think instead about moving the goal, i.e. rather than "Required Fields > Optional Fields > Goal" we can have "Required Fields > Goal > Optional Fields". Once the user has reached the goal, they can drop out at any time. I see no real reason why the flow has to end with a purchase.

So for your travel insurance example, you can have the user enter the necessary fields only. You want them to purchase a product as early as possible in the flow (both from a business and usability perspective). Once the purchase is made, you can then ask the user to provide emergency contact details, join your mailing list, etc. (Of course, it needs to be communicated clearly to the user that they've already reached their primary goal and everything else is optional).

share|improve this answer
add comment

A simple option I've played with a little is hiding optional fields but still using form elements to display the hidden fields.

Basic example

enter image description here

Clicking the yes radio above slides out additional fields like so:

enter image description here

I know the basic example is ugly, but the general idea is to hide some of the extra fields but keep them within the flow of the form, if the user would like to give extra info they can, if not the extra fields are hidden away, but you keep the user's attention within the form.

share|improve this answer
add comment

I am working on a similar project and we are struggling with two goals; 1)to get people to complete and fill out the form 2)to fill out the additional form fields. To solve this issue we have positioned copy to add value to the additional questions that is always shown and hid the with an expand and collapse. We were inspired by https://www.lexus.ca/lexus/en/secure/shopping-tools/request-test-drive.

share|improve this answer
add comment

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

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