Usability techniques for better form presentation

I'm trying to simplify a form (using ASP.NET MVC but I guess that might be irrelevant) with a lot of fields. My initial thought was to split it up into tabs, 开发者_Python百科but then I read somewhere that this would be usability hell. Also, required fields would be split between different tabs, so validation would be a challenge. What are some ways to present forms in a nice way so that it's not one long page of fields?

I think the key is to respect the user's expectations.

• Tabs have their place, but I think to most users the expectation is that you go to a different tab to do a different task, rather than needing to go to multiple tabs to fill out a single form.

• A wizard approach can be nice for a long form, especially if you give feedback about the user's progress.

• If some questions only apply depending on the answers to other questions, it's definitely nice to hide the conditional questions until they are relevant.

• Sometimes it's possible to scatter questions throughout the user's interaction with the site rather then make them answer everything at once.

• Lastly, I do feel as a developer that I have a responsibility to advocate for the user by suggesting to the client that they may not need to ask for so much information.

Personally I think showing "one long page of fields" is not only the most usable but also the nicest way to present a form.

There's an argument that users are more likely to fill in a long form that's split over multiple pages, however as a personal preference, I like to see what I'm in for and what needs to be filled in.

(from my own experience of multi page forms, I usually end up quitting half way through because I wasn't able to estimate how long it was going to take to fill out the form and I've got something else that needs doing.)

One thing I like to do is seperate the relevant areas using <fieldset>'s and then style these to offer a clean and clear form. This makes it easy for the user to see what data they need to fill in (seperated into logical fielsets) as well as provides the developer the opportunity to style each area in such a way that the form seems less daunting.

Multiple tabs are fine, but instead of "submit" have "Next", until the last tab, where you have "Finish". Also indicate where you are at with a "Part 2 of 5" on top of the form.

You can disperse with the tabs, in fact, but it is nice if you can go back and fix things up, so if not tabs, then a "Previous" as well as a "Next" button is necessary.

Having just tabs, and a submit button on each tab, and required fields all over the place would be very annoying. :) That's even worse than having one humongous form where you have to scroll up and down.

I must say that i really like the form on StackOverflow Careers, where you post/edit your CV. It's a pretty long form in one page, but it does not become a problem since you always know where you are and what to do.

Personally, one single page with the whole form is what i prefer. That way, you can in a quick way get a look of the form and what you have to do to complete it.

It sounds like Accordion Forms could suit your needs.

Basically rather than showing your fields as a wizard or a series of tabs, the form is presented on one page but with collapsed sections that expand as they are needed or as the user clicks 'next'.

The case example shows Apple's use of them.

If you use the wizard like method, then it is better to validate each page after pressing Next instead of on the last page after pressing Finish.