Roche : Indigestible menu

The replacement of a constantly visible primary navigation menu with a hamburger icon brings aesthetic benefits – but at significant costs to ease of use. 

click to view

The feature

Roche, the Swiss healthcare giant, has replaced its responsive global website’s conventional, constantly visible primary navigation menu with a mobile-style ‘hamburger’ menu – even in the desktop ‘mode’ of the site. On click of the hamburger icon (which is accompanied by a ‘Menu’ label), a full-screen overlay panel slides into view, containing primary, secondary and deeper-level links. Users can then either select a link to move to another section, or click ‘X Close’ to collapse the overlay panel, revealing the page underneath it. 

The takeaway

Technically, the click-to-expand menu is elegantly executed. Users can, for example, view and scroll up and down the underlying page while the overlay panel is open (the panel tints the page rather than fully obscuring it). Moreover, the replacement of a constantly visible primary navigation menu with a pop-up panel reduces page clutter, making pages cleaner and more striking.

However, the fact that users must now click on a hamburger icon in order to view primary (and deeper) navigation options across the site presents significant problems.

First, users must work harder to familiarise themselves with, access and move between the site’s various sections.

Second, it undermines users’ ability to remain orientated. On pages deeper than primary section landing pages, a breadcrumb trail indicates the user’s position in relation to the current primary section’s landing page – but section landing pages do not have any visible indication of the user’s location on the site, as a constantly-visible primary menu – with the user’s current section highlighted – would provide.

This problem is exacerbated by the fact that some primary section landing pages, such as those for Investors and Sustainability, do not even have titles to give visitors an indication of where they are in the site.

Such sacrifices to users’ experience are heavy prices to pay for the aesthetic benefits that the loss of a constantly visible primary navigation menu brings.
First published 16 September, 2015
< Back to Tips