Content from collapsing items can render 'below the fold' should the behaviour be to push them above the fold so users can see or is auto scrolling worse experience?

Example of collapse

Collapse example with off-screen content Collapse screen with on-screen content

Example of collapse using auto scroll Example of collapse using auto scroll

  • Your example answers your question. Can you find a case where the page scrolls automatically to include the expanded content?
    – invot
    Jan 30 '18 at 20:21
  • Updated the question to include an example of auto scroll.
    – Eliot Hill
    Feb 2 '18 at 16:13

In most cases it shouldn't.

Such forcible pushing would be a worse solution. The better option would be to leave a focus at the current location and clearly indicate that the view has been opened below. It's very important since user might click that button while it's at the very bottom of the screen, making a newly opened panel unseen.

While in the second the whole panel is clickable, though only a + sign on the right hand side changes to -, that may not clearly indicate the state transition of the panel. The indication seems to be done better in the first example due to fact that the color of the button is changed, clearly indicating its toggling.

  • 1
    I agree and I think ultimately the better solution is invariably somewhere in the middle. Indicating the action has changed something and caused a response but not creating an unexpected change on the screen, moving the page seems like a dark pattern.
    – Eliot Hill
    Feb 26 '18 at 14:23

It depends, on the kind of content that's in there.

For example if its a comments sections then it would be a better experience to see the last comment made if there were a lot of comments. If it was some static information that needs to be read from the beginning. then auto scroll isn't a good idea.

whichever you decide it would be good to provide a link or button to "go to top" or jump to the end.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

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