There is an ask to have a collapsible horizontal navigation bar. This would be below the main horizontal navigation. This is not standard imo. And poor user experience because it is so uncommon. The reasoning is to allow more page real-estate. This would mean that the page content ( breadcrumb, title etc ) would shift or jump up everytime the horizontal navigation header is collapsed/exanded.

Are there any examples you have seen? And is there any write ups on why this is poor ux?



For horizontal navigation, submenus that appear on hover are something known. If a collapsible section replacing this and it is properly signalized, it seems ok to me, because on mobile accordions will be used anyway, but hiding title and breadcrumbs is not a good idea at all.


I found the hover (mouseover) degrades in responsive design. Only screen types using a pointer device can trigger the hover leaving tablets and phones impotent.

For example: I coded a wonderful CSS hover event on a vertical menu which triggered border/background. Wasted on tablets and phones 😞

Emphasize homogeneous site design, as important as logo/color/font, to your customer so they are aware of consistency between screen size.


bbc.com/.co.uk is a major website with a collapsible header nav section - triggered by a section of the main nav labelled "More v". The main nav also overflows into that section when used on smaller screens, but several of the links are always in there. The main nav / collapsible section is common across the entire site, pushing the content of the individual pages down when it is opened.

Outside of websites, there could also be an argument that the ribbon toolbar is a collapsible sub-nav section. The justification for the ability to collapse there was also to increase the amount of screen space available to users for the main document workspace.

One of the neat things about the Ribbon is that it can be closed. For times when you want the maximum concentration on your document, you can collapse the ribbon to just a single line. Buttons you have added to the Quick Access Toolbar (the area at the top where the Save button is) stay around, as well as access to the Floatie (watch the video or stay tuned!) and context menus. So, sometimes when I'm just trying to get ideas down on the page, I collapse the ribbon and use my whole screen for typing. Then, when I'm beautifying and laying out my document for others to see, I expand the Ribbon and use the full functionality of Word to get the output I expect.

Jensen Harris - Enter the Ribbon

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.