30 Cutting Edge Examples Of CSS Navigation
Tom Walker
Navigation is one of those things you have to get right in order to provide your users with easy access to your website’s content. Today we’ll take a look at 30 well-designed navigation menus. Some of them use CSS sprites, some use jQuery or another library, and others take advantage of the great properties available in CSS3.
I hope you will enjoy this post. Please feel free to chime in by leaving a comment at the end of this post as well!
1. Pixlogix
2. RainSong Media
3. Clockwork
4. Freestyle Sport
5. Fight For Future
6. Plug And Play Design
7. Zaplee
8. Media Temple
9. Deportation Day
10. Active Consulting
11. Arbutus Photography
12. Flickr Design
13. Deren
14. Lupus
15. Soh Takana
16. Thoughtbot
17. Abduzeedo
18. Squaredit
19. 3.7 Designs
20. Evan Eckard
21. Pixel Resort
22. Lonn Roth
23. Interactive
24. Nathan Borror
25. UX Booth
26. Clear Left
27. Real Mac Software
28. Appstorm
29. Dragon Interactive
30. Helmy Bern
For Further Reading:
Did you enjoy this article and found it useful?
Get even more from us:
Free Advertisement
Posted 99 days ago 28Very good collection
Thank You
estetik
Posted 149 days ago 27excellent designs and menus.
Charla Strough
Posted 179 days ago 26What a beautiful work of love! Thank you for using your talents for the Glory of God. And dont get discouraged with the negative comments. Pray for them that they may connect with the Truth of how much God Loves Them.God Bless You.
Christian Mungle
Posted 268 days ago 24Do you have a spam issue on this site; I also am a blogger, and I was curious about your situation; many of us have created some nice practices and we are looking to exchange strategies with others, why not shoot me an email if interested.
Rean John Uehara
Posted 268 days ago 25We do experience spam everyday, but Akismet does the trick. :P
Harry
Posted 340 days ago 23Great examples, really inspirational. Got a new site I need to get done for a client and I’m definitely going to take a look at this stuff again to see if I can adapt some of it!
Rafael
Posted 356 days ago 22Excelent !!! great!!
nikhil
Posted 743 days ago 21I love the collection… thankx for sharing.
.-= nikhil´s last blog ..Easy CSS Tooltip =-.
Rachelle Galang
Posted 749 days ago 20It is good that you emphasized here the importance of the navigation since some of the designer did not pay attention about the usefulness of this. Let me share this post to some of my web designer friends.:)
Jonathan
Posted 750 days ago 19Someone please slap Rainsong with the progressive enhancement stick – their main nav has no hover effect when JS is off – slightly petty I know, but I know at least 10 ppl who browse without JS on (and not all of them are web developers etc.)
Tom Ross
Posted 751 days ago 17These are awesome. I love the pixlogix menu.
dr john
Posted 752 days ago 16Like some others, I’m not sure about “cutting edge” navigation, but there are so great examples here (I have collection of sites with good menus for inspiration, and several of them are in your list too).
But clockwork.net ??? sorry, but it does nothing for me, and requires a lot of fishing around with the mouse at times as not all links are obvious.
Meghan Wilker
Posted 751 days ago 18dr john,
You make a valid point about some of our links not being obvious enough; we’re taking a look at that.
Thanks for the feedback!
Liam
Posted 752 days ago 15Not sure why these are “Cutting Edge”?
Most of the navigations listed in this post are used by many websites, making them pretty ordinary, most using CSS instead of the old fashioned Image Roll-overs.
Maybe #24 is quite original, looks good and works well, but there must be better examples of “Cutting Edge” CSS Nav designs out there?
dimaks
Posted 752 days ago 14those are great rounds of beautiful desings.. i definitely can’t get enough of them. thanks for sharing!
Tutorijali HDonWEB
Posted 752 days ago 13Great collection :-)
.-= Tutorijali HDonWEB´s last blog ..Exact Audio Copy Vodič za početnike =-.
Anna
Posted 753 days ago 12Nice compilation. I really liked 7, 15, 21, 26 and 29.
.-= Anna´s last blog ..5 interesting tidbits I read today =-.
Matthew Heidenreich
Posted 753 days ago 11great complication, thanks for the list.
.-= Matthew Heidenreich´s last blog ..Six Websites to Get the Perfect Color Palette =-.
Inside the Webb
Posted 753 days ago 10This is great man! 1st Web Designer is one of my favorite blogs, and rightfully so with these kinds of articles. CSS navigation menus aren’t easy to come by on the web, especially of this high quality
.-= Inside the Webb´s last blog ..Interview with Little Box of Ideas Design Blog =-.
Web4half
Posted 753 days ago 9Awesome Header ” Pixlogix”. But for overall design my vote goes to “clearleft”. Very Neat Design… Thanks for the Awesome Web Site Collection.
.-= Web4half´s last blog ..Website Navigation Tips =-.
M.R.
Posted 753 days ago 8Nice collection. Thanks for posting.
I think #19 – 3.7 Design’s – navigation is pretty innovative.
mavericdesign.com
Posted 753 days ago 6Hi Tom,
Great post, I especially like the Media Temple menu. Keep up the good work.
SmashingWebs.com
Posted 753 days ago 4Ya.. this is something awesome :)
.-= SmashingWebs.com´s last blog ..Most Wanted HTML 5 Tutorials =-.
Danny
Posted 753 days ago 2Thank you for good collection Tom but i have to mention one important thing to Dainis….
Hi Dainis;
Sorry to say that but your blog is becoming only showcases of sites and blogs by your guest writers day by day..
Mike van Hoenselaar
Posted 753 days ago 3@Danny: No offence but 6 out of the 10 last articles are from Dainis. No?
Great post. Lots of great websites. A lot of them I didn’t know. Thanks!
Danny
Posted 753 days ago 5@Mike van Hoenselaar
No defence:) but i didn’t say anything about the latest Dainis Articles.
Dainis is doing fine and if you read his articles they are all great but please just check out the other pages
bla bla designs,bla bla websites,showcase of bla bla websites:))
Anyway no need to break hearts:)..Keep on going guys
Dainis Graveris
Posted 753 days ago 7Oh, I understand your complains, but now site is getting a bunch new guest writers and to get started I try to suggest them easier article ideas, that’s why there is so much inspirational, showcase articles lately.
However I am now focusing to more articles, I want them to come out daily. I cannot sustain that article quality daily, so I need guest writers, to relieve me a little bit.
I am hoping on future there will be more quality articles coming out and often! Some can complain that there is no need to write so often, but I think if I want to have any chances with top niche design blogs, I need to grow quantity and quality.
Please be patient, you will be rewarded with quality! And thank you for your comment and support! Appreciated!
Deepu Balan
Posted 753 days ago 1Nice beautiful post Tom. Very good collection. Luv Pixelresort navigation, clearleft is equally good. Appreciate your efforts in putting this together.
-Deepu