Floating navigation menus

Fixed navigation has become a mainstay of sites that are either conversion-focused (because the core CTA can stick with you as you scroll) or have sprawling menus. It’s a nice way to simplify the experience of a site by keeping navigational controls constantly at the user’s fingertips.

Lately, we’re seeing designers take the idea a step further by visually detaching the nav from the rest of the site design, and moving it a bit below the browser’s chrome. This reinforces the feeling that the navigation is a global object, not necessarily a part of any one page, but there to follow you reassuringly through the site.

The most obvious way to go about this visually is to add a drop shadow to the navbar, and move it a bit below the very top of the site, as seen in Reseau’s site above. But it’s doable in a flatter design as well, as you can see on the site of Anchor & Orbit.

 

Similar to off-grid designs, this allows for interesting juxtapositions to naturally (or purposefully) occur within the design, which provides a fun creative challenge.

Leave A Comment