0

It's common for website pages with long text content to split that content into sections that can be opened and closed individually. For example, on an FAQ page, you might initially only see the headlines of each item in the FAQ with a plus-icon (or something similar) that openes and closes the corresponding text. One common implementation for that pattern is the Bootstrap Collapse component.

My question regards a common practice for this kind of content division, which is to allow only one of the toggleable sections to be opened at any time. So if I open one section, then open another one, the first one will automatically close. My intuition is that this is bad design, but I would like to get some other opinions (and/or research data, if available). Some of my thoughts:

Pro

  • Prevents the page from getting too long (because of many opened sections), so the user will never have to scroll very far or get lost on the page.

Contra

  • It is an unnecessary restriction on the user (maybe they want to open all sections and then read them top to bottom).
  • It leads to some awkward behavior (if a section above the text I want to read is closed automatically, the page will shrink and the text I'm trying to read will wander upwards).
  • The problem with a page getting to long could be solved better (e.g. by providing sticky "back to top" or "close all sections" links/buttons in a corner of the page).

Is there some benefit to this that I'm missing? Or should the pro be weighted more heavily? Any and all insights are appreciated!

Improve this question
2
  • 2
    I've seen both. I generally prefer to be permitted to open multiple sections at once, but I don't find autoclosing objectionable enough to be worth complaining about. Your mileage may vary.
    – Jeff Zeitlin
    Mar 14, 2018 at 11:57
  • 1
    …another thing: toggleable content should have anchors so that you can actually link to the respective section, and that section opens. Otherwise it becomes impossible to share.
    – benteh
    Mar 14, 2018 at 15:29

1 Answer 1

Reset to default
1

It depends entirely from the context.

Allow one open when the general view is the main object of interest:

  • the general view needs to be easily scannable: you can compare for example price of different items, or how they look etc.
  • users mostly don't need the additional information

And the opposite, allow multiple accordions open when the hidden information is the main object of interest and there is no need to compare the items in the general view.

Improve this answer

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.