[Update Dec. 2015] Please note that the below-presented examples are heavily outdated. If you look for up-to-date navigation design techniques, please continue reading on Marco Hengstenberg's Designing Smashing's Mobile Navigation, David Bushell's Responsive Off-Canvas Navigation, Viljami Salminen's Responsive Nav Plugin, or check out or our latest articles on designing a modern, lightweight and responsive navigation. (Ed.)
Navigation menus have to be intuitive, precise and easy-to-use. One simple, fundamental principle, which is common for all kinds of nav bars you would ever want to use for your projects. In fact, the navigation menu is probably the most important element in web design: after all, it is being used more often than any other element on a given page. Therefore, it's important to make sure that your visitors will find they way around the site structure - however complex the latter might be.
So how do designers cope with a challenging task to create an attractive and usable menu? Which results can be achieved? OK, that's a tough one. Let's take a look around.
Below you'll find 53 beautiful and user-friendly Navigation Menus and solutions web designers came up with using basic CSS styling.
PS: Over the last few months we've reviewed CSS-Based Techniques, CSS-Based Forms and CSS-Based Tables and CSS-Based Footers (yes, some of these techniques use not only CSS, but also JavaScript and PHP). You'll find even more CSS-related articles in our CSS Section.
PSS: We have included some DHTML- and JavaScript-based navigation menus in this list by mistake. Sorry for inconvenience.
CSS-Based Navigation Menus
Change.org

N.Design Studio | Design & Blog

Good Creative - Web and Graphic Design
MacRabbit - Welcome

Joyent: Introducing Joyent

CSS Vault » The Web's CSS Site

notiam.com

Jamie Huskisson: Full time UK PHP freelance developer

Web design, development and consultancy from Ottawa, Canada - Snook.ca

BREAKER DESIGN

Jen Gordon

Tulumarka

Ars Technica

CSS Beauty | CSS Design, News, Jobs, Community, Web Standards

Digg / Technology

Triple Crown Customer Service

microformats

Badboy.ro

GetMenus.ca

Wedding Extravaganza 2007 - A Perfect Marriage

Job Pile - Aggregating the Best Job Boards on the Web - Artypapers

Norman Morrow & Co - Estate Agents In Crumlin, Northern Ireland

Listal - List the stuff you love! Movies, TV, music, games and books

folietto

Tony Yoo - Online Showcase (version2)

Digital Web Magazine

Denbighshire Supporting Business

Pulmad, peod, lillesalong... - Annilill Peoteenindus

ExpressionEngine - Publish Your Universe!

coda.coza

purevolume™ | We're Listening To You

EGOLOUNGE *Büro für digitales Design

Merix - Internet Technologies

Bartelme Design | Showroom

Luis Alarcón, Blog

CSS3 . info - Everything you need to know about CSS3

nclud™ a creative web design agency

Convan Design - Howdy

ExpressionEngine - Publish Your Universe!

Silverpoint: Web Solutions for Schools

Jambor-ee - Celebrating ExpressionEngine

far from fearless

Scribd - Home

Erika Greco - Blog


Welcome to Buzz — Buzz Recruitment

Michal Zapoměl - český vlasový design | czech hair design

Onlinecenter Upload

M122Arts Mixed Media and Technology // oo*o
KazanShops.Ru

Stone inc. - Aménagements Paysager, Pavés.

Pixellogo

AUSMAG - das Australien Work & Travel Portal
