Best design for a long HTML input form [closed]

Question

I am designing a long HTML input form and am debating between a few design choices:

1. Single page long form and users have to scroll down
2. Multiple pages where you have to click "next..." for each new page
3. Use some tab AJAX interface to organize the form inputs but tabs.

Any research or best practice here?

Answer 1

First off, a good article is, as usual, Nielsen.

A good analysis also can be found in this post.

My own thoughts (many years of web app design plus grad level UI design and usability studies in the past as basis):

1. Pros and cons

Long HTML forms:

Hard to navigate by clicking on scroll bar (very narrow) but pretty easy to navigate using scroll wheel on a mouse.

Multiple pages with "next" links

Worst of both worlds. Hard to click ("next" is a small target), no random access to any part of the form (should it make sense). This option is ONLY useful when you MUST complete the form parts in specific order and going back is not an option.

Tab interface

This is a good option but with drawbacks. The only downside is not seeing all the form info at once (and you have to remember which question was on which tab if you want to navigate back/forth).

2. Conclusion

So it's a toss-up between #1 and #3 depending on what your users find easiest (scroll long vertical page vs. click on tabs).

3. Notes

• Please note that Windows GUIs almost universally use tabbed forms, so most likely research showed that it is better usability wise, thought I don't have any references to cie at the moment.

• Please note that having "opportunity to do validation/checking/saving/etc..." via AJAX calls has pretty much NOTHING to do with the choices above - you can initiate an AJAX call once any element you choose on a form looses/gains focus.

  The only benefit of the tabbed interface for that is that it's user-driven signal "I'm done with this set of form elements" - which can be intelligently done via JS without having the tabs and without the user telling you he's done explicitly (e.. he focuses on next element).

  You can also disable "not yet ready for you" form elements till all the preceding required elements are 100% filled out.

4. Side notes

Why exactly DO you have such a long form? One of the MAIN points of usability research is that filling out of any forms is long, hard and hateful for users. So, unless you MUST obtain the information, do not ask for it. This especially applies to registration forms - see Nielsen and other references.