User Experience Stack Exchange is a question and answer site for user experience researchers and experts. It only takes a minute to sign up.
Sign up to join this community
Would it be better to have one long form, and let the user scroll down the page, or split the form into 2 or more pages?
Usability wise, one disadvantage I can think of for having multiple pages, is changing info from previous pages is more tedious than just scrolling up and changing the info.
Aside from that, will it make my form seem shorter if it is split to two pages, with each page being about the length of one screen? (Please see my image below)
In ecommerce usability studies that I've reviewed related to checkout screens, what matters most to users in long forms is how many fields are visible on the screen at a time, not the total number of fields on the entire form. This finding was in a discussion of multi-column forms vs long scrolling forms.
Based on this research, (found here http://baymard.com/checkout-usability NOTE not free) the conclusion is that long scrolling forms are ok.
Based on your image, I'd say you are on good footing and should not break it into pages.
You can also search for other answers regarding the design of long input forms like Best practices for long data entry forms
From a data capture view, it is better to separate many questions into multiple pages. This is because each time the user clicks 'next' you can save the data and other contextual input such as timestamp. Also, this allows the user to exit and return to a survey. Or god-forbid if a server crashes you have some data saved.
However, because this question is asked in UX, you are asking about the user's perspective. It would be good to keep all these fields to one page because they are relevant fields. Maybe dim each section as a user finished it. Or highlight the current section.
Suggestion: Would it be possible to align text fields side by side, like first name on left and last name on right? That would shorten the look of it while still capturing all data fields.
There is another solution. Accordion can be used in order to make a form footprint smaller and provide some kind of grouping.
It is likely user will take such grouping as a quite natural and useful. BTW, in such a way it might be possible to provide some useful guidance.
Try to build a multi-step registration page. I mean you can try to break your registration into 3-4 steps as shown in below image. And all these steps can be made using JQuery Accordion. So it keeps your form clean and everything is on one page(means that the page does not load again). Also, the user feels that there are only 3-4 steps and not a long form(Although the entries he makes are same). There is this very good article on "Pagination in Web Forms" on this web-link.
As a user, I dislike multi-page forms. When you fill in a form you are usually giving someone else information about yourself. If a question you would rather not answer is on the last page of the form, you have already unnecessarily submitted a great deal of information by clicking at the end of each page.
If a whole form cannot be viewed without having to make entries, it is good reason to dismiss it as a scam, unless you really trust the source!
PLEASE check your presentation when indicating that fields that have been missed: "question xx is required" may be fine as a comment in the code, but shows bad manners.
Ideally, just accept that the respondent may not wish, or indeed be able, to answer all questions and allow an incomplete form to be submitted. In drop-down answer menus'other' should always be one of the options.
Both single-page and multi-page forms have distinct pros and cons. For example, while a single-page form may seem like a quick step for checkout, packing a lot of fields in one page will make it look cluttered and lead to cart abandonment.
Also, a multi-page checkout allows you to find exactly where a dropout has happened by integrating Google Analytics. This is exceptionally helpful in devising strategies to prevent dropouts and boost sales.
This article explains a lot of useful points that you may need to keep in mind while choosing between a single-page and a multi-page checkout form: http://www.codaemonsoftwares.com/blog/single-page-vs-multi-page-order-checkout-which-one-should-you-choose/
No matter what, you cannot ignore the power of the progress bar. A progress bar informs customers about how far they have come in completing a task. Certain progress bars display the completion of tasks in percentage. This gives customers a feeling of achievement. It motivates them to keep at the task till the completion meter shows a 100%. A multi-page checkout can be customized with a progress bar to improve conversion.
In this particular case the form looks tall because of the single-column layout, i.e., labels on top of input fields, leaving an unused void of about half the available real estate to the right (while hiding half of the form under the fold).
If is was a two-column layout (labels to the left of inputs) then it wouldn't be so tall, it would fit nicely into a single page and this question wouldn't have been asked. Examples and help should be to the right of the input (making it a 3-column form in fact).
There is a generalized belief that single-column forms are more usable. This is not so. Additionally IMO single-column is worse in that usually calls for smaller font labels, which can be an issue for audiences with users aged 50+ years.
This form is 15 fields worth, it can't be regarded as daunting, and it can well fit in a single page.
Setting the fields in two columns with labels on top is not a good two-column layout. Such a layout would call for user confusion. You can set more then one field in a single row when the fields are related, like thus:
Vehicle: model [______] series [__] year [__]
As an additional comment, I'd avoid setting all the inputs with the same size. The input field size should convey a hint about how much data you expect. It also breaks the regularity that would call for user errors (the user looks at the supporting paper documents and when coming back to the form chooses a wrong target field because they are all so alike).
As of the question, I had an experience with online forms containing 100 to 200+ fields, and breaking them in pages was a must.
The forms were well organized in sections, so the sections were the "natural" splitting points for us.
The splitting thing converted a really daunting form in a laborious-like task.
The user would focus on a section at a time, and the paging actions prevented the system to timeout the session, which is something that has to me accounted for in such cases: when the user submits after working for quite a while the system tells that the session expired a while ago.
