Long Form, What to Place First: Required or Optional Fields?

Question

We have a very long form, 40 fields.

Q1: Where we should place the required fields, at the top or at the bottom?

Q2: Based on the first question, where we should place the submit button? Top, bottom or both? We do not have other options!

Answer 1

If you can, try to avoid displaying the optional fields at all - it'll make the form shorter and thereby less intimidating to users. Just display the required fields on the form, and then after submission perhaps display a notice something along the lines of "Thanks! Your data has been submitted. If you want, you can help us improve [our service/your experience/etc] by providing some extra information below:"

As for the submit button, put it at the bottom. Users will be at the bottom when they're ready to submit.

Answer 2

It depends on what type of fields you have. What kind of form are we handling with? Do you have an example of the fields?

I would suggest to split up the form in multiple sections (not to order required fields first or at the top of the form)

E.g.

[ Section A ]

• Field *
• Field
• Etc.

[ Section B ]

• Field
• Field *
• Etc.

[ Section C ]

• Field
• Field *
• Etc.

You could display all those sections by default, or you can choose to toggle them. Per each section you can validate the required fields. You can automatically toggle the next section if all the required fields are filled in. Even better and more user friendly is to place a submit button per section. You can disable it and enable it when the required fields are filled in. After submitting it will toggle the next section.

Displaying the submit button (to post the form) on the bottom of the form seems to be like a good idea since people expect it to be on that position.

Answer 3

Unless having the required and optional fields separated also matches the workflow, I would recommend neither option. You want to provide the easiest, most seamless experience for the user. If the form fields do not progress in accordance to the user's workflow, the user may have to work much harder to obtain/provide the information requested.

For instance: Let's say you are requesting 4 pieces of information:

1. Tax information from last year's tax return (required)
2. Address (required)
3. Driver's license (required)
4. Tax preparer's address (optional)

If these are separated into required and optional sections, the user may have gone on a search to find their tax forms to enter the information requested in 1, then replaced the returns back in their files. When they reach number 4 and want to provide that information, the will have to go back to their files and pull out the forms again to obtain that information.

While this example is a bit on the extreme side, you don't want the user having to shuffle back and forth while entering information. It increases cognitive load and frustration for the user.

Always put the submit button at the end of the form, as that is where the user finishes their work.