We have a web application that has a lot of controls and has steps that the user progresses through. Most of the steps are on the same page, and when one section is done, we don't necessarily need to see the input and output of that step. It's tempting to use an accordion or just collapsible areas to negate the need to scroll so much, but is this the best way? Should collapsed areas automatically expand on hover, or should a click be required?

Are there standard ways to cater for this and describe the interaction process, and what are they?

2 Answers
2

Speaking as a user, I would definitely not want the 'expand on hover' behaviour - that sounds like it would be very annoying.

Is there a reason that all of the steps have to be on the same page? Can you just have the progression stretching over several pages? Once a user has completed one step, will they ever need to revisit it?

Is there a reason that you wish to negate the need to scroll? If not, you could simply have everything on one page. This has the advantage that all information is viewable at once; depending on the exact nature of this application, that may be a small advantage or a great one.

I agree with Bobby: definitely do no 'expand on hover'. Personally, I cannot stand them when a simple menu drops down on hover. I can't imagine an entire section of a web page expanding on hover -- would be very annoying.

A good example IMO is the Apple ordering process, which now uses the accordion approach.