I am implementing a hidden panel that when triggered will slide in from the right side of the page and take up the whole screen vertically and roughly a third of the screen horizontally.

Would it be better to make this panel:

a) slide out over the main page, appearing to be a level above on the z-index

b) slide out and push the main page to the left, appearing to be on the same level

I personally think a) would provide for a cleaner looking UI but I can't reason why.

1 Answer 1


It depends :)

Option A

Use when panel's info have little to do with content on the main page.

A panel that slide out over top means the content on the main page remains static on screen. This implies info on the panel is standalone.

If the main page shifts as well, the user will need to mentally check to confirm nothing on the main page has changed. It's not a huge thing, but it does add to the cognitive load.

Option B

Use when people need access to the content on the main page when they use the side pane.

In cases where you have say a large list on the main page and you want a side panel to show additional details, pushing out the main page will allow the user to better see the new info in context with the bigger picture. It'll also be a good idea to resize the content width of the main page as well to make everything be visible.

Your Answer

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

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