Desktop: There is plenty of screen real estate for displaying navigation options, and we recommend:
Do not use hidden navigation (such as hamburger icons) in desktop user interfaces.
Instead display the top-level navigation options, usually across the top of the page or down the left side.
Mobile: For phones, there is no hard-and-fast rule. But our general recommendations are:
If your site has 4 or fewer top-level navigation links, display them as visible links.
If your site has more than 4 top-level navigation links, the only reasonable solution is to hide some of these. We did find that the usability penalty imposed by hidden navigation is very present on mobile, but it is smaller than on the desktop. Thus, we recommend making this design tradeoff because the usability of an expandable navigation menu is far better than that of alternative designs.
Provide in-page links to important information on your site, or use other methods of supporting the hamburger (or some other hidden) menu.
Remember: mobile-first is not the same as mobile-only. Plus, of course, follow the other long-established UX guidelines for menu design.
