websites-with-floating-and-fixed-position-navigation-designs

Great looking and user-friendly navigation is one of the most important aspects to get right in web design. Web designers have invented many different ideas to help users find what they are looking as efficiently as possible. Still the most used approach is one or two drop down menus placed at the top of the page. However, one of the recent and really cool trends is to make the navigation menus visible at all time by either using a floating menu or navigation that have a fixed location. It works really well for website with long pages as it makes the navigation visible for visitors even when they have scrolled a long way on a page.

Implementing a floating menu typically require some kind of JavaScript. Most of the cool navigation scripts have been implemented as jQuery menu plugins and often they are quick and easy to implement. I have previously collected some of the best jQuery plugins for creating dynamic menus and I am sure you will find the article useful. For WordPress the best option is to use WordPress menu plugins, as it is possible to use them without diving into the theme code.  Check this article, if you want to enhance your WordPress website navigation.
In this article I have collected more than 45 of the coolest websites with floating and fixed position navigation for your inspiration. Please take a minute to share the article on social medias with people you know.


ElegantThemes
ThemeForest

Advertisement

Creative full stop – MORE INFO

fullstopinteractive

Creative Full Stop use a simple navigation fixed to the top of the page. The navigation bar is transparent and let you see the page through it as it is scrolled down. This is a cool design idea.

Jacksonville Art Walk – MORE INFO

Jacksonville-art-walk

Has a very arty design with an image as background and navigations are fixed on the top.

Fat-Man Collective – MORE INFO

fat-man-collective

Fat Man Collective uses navigation when you hover, it displays images.

Theme Crunch – MORE INFO

theme-crunch

Theme Crunch has simple yet elegant design, having fixed positions of their navigation.

Design Bureau – MORE INFO

design-bureau

B14 has very simple black and white design with navigation menus on the right top corner, which is easy to see.

jQuery4U – MORE INFO

jquery4u

Founded in November 2010, jQuery4u delivers web news, coding tips, plugins, code snippets, video tutorials and other content related to JavaScript, jQuery and web design/development to web enthusiasts around the globe.

Face – MORE INFO

face

Face is an intelligence-driven supermodernist design studio, based in Monterrey, Mexico whose work range includes design solutions, advertising, editorial projects and custom publishing, corporate identity, web design and brand development.

Ryan Scherf – MORE INFO

ryan-scherf[3]

This site has very colorful design, you have to scroll down to see more of it’s content.

Hard Graft – MORE INFO

hard-graft

Dedicated to designing an original, clever, functional product that surprises and excites with a subtle elegance and high aesthetic.

MMD – MORE INFO

MMD

Works on creating and crafting digital experiences, services and utilities for major brands.

Coffee Bicycles – MORE INFO

coffee-bicycles

Inside the Hub has slideshow images as background and menus are very easy to navigate.

Who’s Eligible – MORE INFO

whos-eligible

Who’s Eligible has very good design, simple yet very classy.

Reserved – MORE INFO

reserved

Has very sophisticated design, navigations are well positioned at the top of the site.

Resoluut – MORE INFO

resoluut

They make apps and websites. They try to do it on the basis of strategic insight, intuition and creative freedom. Ultimately, we want to entice users to the appropriate action.

Happy Cog – MORE INFO

happy-cog

Designing digital experiences ever since the web existed. And that entire time we’ve stayed ahead of the curve.

UnderCurrent – MORE INFO

undercurrent

Undercurrent is a digital strategy firm, very simple web design and navigations turns red when hover.

Struck – MORE INFO

struck

Has a great web design, with slideshow images to their homepage.

G’Nosh – MORE INFO

g'nosh

G’nosh has cute design and menu when hovered pops up another cute design.

The Style Junkies – MORE INFO

the-style-junkies

The Style Junkies is an independent luxury travel website. Has large navigation menu at the left part of the site.

Character – MORE INFO

character

Character is a San Francisco-based, independent creative agency with a passion for launching, rejuvenating and propelling brands.

Mustache – MORE INFO

mustache

Mustache has evolved into an agency with great professionalism and high skills in analysis, strategy, idea and concept of design and technical implementation.

Julius Mattson – MORE INFO

julius-mattson

Has simple one-colored background and navigations are positioned at the left.

Kitchen Sink Studios – MORE INFO

kitchen-sink-studios

KITCHEN SINK STUDIOS® INCORPORATED is a creative and design consultancy based in Phoenix, Arizona.

Milk and Pixels – MORE INFO

milk-and-pixels

Collective of like-minded creators who love clean, well-designed, and easy-to-use products.

Fundutia Comunitara – MORE INFO

fundutia-comunitara

Managing professional and transparent donations received from folks, make sure the donor objectives, providing concrete opportunities for community members to attend the best ideas to catalyze and support quality programs.

Fandango Media Group – MORE INFO

fandango-media-group

Innovative design and development studio devoted to creating emotional experiences between brands and customers.

Boost Inspiration – MORE INFO

boost-inspiration

Boost Inspiration is a blog that boost your inspiration by showcasing different creative resources for Digital Art, Graphic Design, Illustration, Photography and Typography.

Ok Studios – MORE INFO

ok-studios

Ok Studios has great white background design, navigations are on the top of the site.

TouchTech – MORE INFO

touchtech

Very nice design and navigation menu are well positioned at the top of the site, when hovered it turns into green.

Graz Secrets – MORE INFO

graz-secrets

Great design and navigations are at the top that turns to red when hovered.

Majkol’s Playground – MORE INFO

Majkol's-playground

Very cool design with images showing on the home page as slideshow.

Hopgoods FoodLiner – MORE INFO

Hopgoods-foodliner

Hopgood’s Foodliner is a Maritime inspired restaurant located in the heart of Roncesvalles Village, Toronto.

Lucid Design Concepts – MORE INFO

lucid-design-concepts

Lucid Design Concepts is a small web design studio based out of Orange County, CA.  Specializes in custom web, print, & apparel design.

Girl With a Camera – MORE INFO

girl-with-a-camera

A blog that features great photography and arts.

Gilles Manzato – MORE INFO

gilles-manzato

Code websites using an Apple MacBook Pro, SublimeText2, GitHub and Photoshop.

Psych and Psych – MORE INFO

psych-and-psych

At Psych & Psych Consultants are dedicated to provide comprehensive, private, and personalised services for your mental health and psychological care needs.

Rob Edwards – MORE INFO

rob-edwards

Rob Edwards has a very cool design, once the page is scrolled down, it then changes to the next navigation menu.

DKNG Studios – MORE INFO

dkng-studios

DKNG is a full service graphic design and illustration studio catering primarily to the entertainment industry.

Ascension Latorre – MORE INFO

ascension-latorre

Has a very classy and elegant style, navigations are fixed at the top of the site.

Carbure – MORE INFO

carbure

Has simple design with navigations at the bottom of the site.

Sputnik – MORE INFO

sputnik

The studio provides a range of capabilities within the space of design, development, content strategy, and brand managment.

Author : Lars Vraa

Lars is passionate about web design, web development, SEO, social media and loves to look into new technologies, techniques, tools etc. and to write articles for tripwire magazine readers.

Pin It on Pinterest

Shares
Share This

Share This

Share this post with your friends!

Shares