30 Website Navigations that Make You Wanna Click It

By / Dec 16, 2009 / Inspiration
shares

The navigation might be the single most important aspect of a web design’s usability. Without a navigation, you would be stuck on the home page for a very long time. I believe a navigation or menu must be easy to use, but this doesn’t mean it has to be boring. In fact, it helps to add a little flair to your navigation. It entices visitors to click and hang around your site a little longer. Here are thirty examples of beautifully designed web design navigation for your inspiration.

Billy Tamplin

website navigation

Burciaga

website navigation

The Swish Life

website navigation

Mission Bicycle Company

website navigation

Typejockeys

website navigation

Red Velvet Art

website navigation

MetaLab

website navigation

Authentic Jobs

website navigation

Icon Dock

website navigation

Morphix Design Studio

website navigation

Sushi & Robots

website navigation

Utah.travel

website navigation

Robert Alan

website navigation

Hull Digital Live 09

website navigation

NOSOTROS

website navigation

Artua Design Studios

website navigation

Internet Dreams

website navigation

Strutta

website navigation

Pirata London

website navigation

Tapbots

website navigation

Weightshift

website navigation

Guifx

website navigation

Owltastic

website navigation

inkd

website navigation

Bohemian Coding

website navigation

Think Orange

website navigation

Culinary Culture

website navigation

Light CMS

website navigation

Toggle

website navigation

atebits

website navigation

About the Author

Henry Jones is a web developer, designer, and entrepreneur with over 14 years of experience. He is the founder of WDL and ThemeTrust.

62 Comments

  1. Brendan Wenzel
    December 16, 2009

    Great list. Wish I would have seen it earlier. Needed the help. Oh well. I’m happy with what I ended up with. Thanks for the inspiration list.

    Reply
  2. webdevelopment
    December 16, 2009

    I like the list, well mainly because it contains some pretty examples.

    But my question is: do these pretty buttons really want to make you click them? Do you have test data to back your statement ?

    Cheers

    Reply
  3. Waheed Akhtar
    December 16, 2009

    Excellent examples. Love them all

    Reply
  4. Damian Webber
    December 16, 2009

    How about the very simple navigation of http://www.portsurf.co.uk

    This still needs some tweaks to stop the navigation bouncing when over-zealous mouse movements are used but I like it.

    One day we’ll have the time to make the site even slicker (I’d love to have more time, I really would!)

    Great list, though – very inspirational for those who are not graphic designers

    Reply
  5. Design Informer
    December 16, 2009

    Utah and Pirata London are the ones that I really like for some reason.

    Nice collection. I think the nav is a very important part of the design. I do think that the links should be enticing, and you have done a great job showcasing sites that have enticing navigations. :)

    Reply
  6. designi1
    December 16, 2009

    nice examples!!

    Reply
  7. Jhay Gamba
    December 16, 2009

    Awesome collection!! Thanks

    Reply
  8. dandy
    December 16, 2009

    Great navigation bars. Loved to navigate them.
    Thanks

    Reply
  9. Anggi@icreativelabs
    December 16, 2009

    i liked metalab and guifx

    Reply
  10. M Anthony
    December 16, 2009

    nice list… thank you.

    Reply
  11. Check
    December 16, 2009

    Love the post title

    Reply
  12. Petrus
    December 16, 2009

    Nice showcase with beautiful examples. Good work.

    Reply
  13. Kien
    December 16, 2009

    tabs for navagation never seem to get old. great post.

    Reply
  14. Jon Fukuda
    December 16, 2009

    Nice showcase! It’s always a beautiful thing when cognitive psychology, gestalt laws of perception, elegant design and keen interaction modeling come together!

    There’s something to be said for the aesthetic-usability effect. It doesn’t always solve the problem, but it does make you want to click!

    Reply
  15. Melody
    December 16, 2009

    This showcase is an example of clean webdesign..love the red velvet art navigation!

    Reply
  16. Waasys
    December 16, 2009

    Hate such buttons! i click them even if don’t want to (

    Reply
    • vivienne
      January 4, 2010

      haha.

      Reply
  17. Don
    December 16, 2009

    I wasn’t a fan of a couple of these, some of them look the same as lots of other websites. I hated the Utah one, those compelled me not to click on them.

    Reply
  18. DB-Elements
    December 16, 2009

    Very nice! Extremely inspirational.

    Reply
  19. Xcellence IT
    December 17, 2009

    hey, it helps generate great ideas… we can use few styling & colors in making layouts for our clients..

    great list.

    Thanks
    Xcellence IT

    Reply
  20. $hekh@r
    December 17, 2009

    thax for great inspiration.

    Reply
  21. waqas khan
    December 17, 2009

    good stuff, thanx.

    Reply
  22. Noel Wiggins
    December 17, 2009

    There are so many elements that go into making a great website design. So many it can be overwhelming, personally I like to break each element up into individual creative exercises, In most cases the creativity is limitless, but I have found that the navigation is one of those elements you have to be careful with, being you don’t want to confuse the visitors,

    I love this round up, for navigation inspirada, it is both creative and clearly noticeable, and can really help explore ideas for any website design project

    Thanks and Regards

    Noel for Nopun.com
    professional graphics design

    Reply
  23. Glassgigang
    December 17, 2009

    Actually a large amount of them does make me want to leave their site.

    Reply
  24. M.R.
    December 17, 2009

    Thanks for posting.

    Me likes Burciaga’s site design.

    Reply
  25. Samoo
    December 18, 2009

    Though they all are good examples, I love clean, simple navigation such as Mission Bycicle company.
    If you want to see others navigation samples here you are a nice list that I’ve made up:
    http://web-patterns.net/category/menu-navigation/

    Reply
  26. Design Ideas
    December 18, 2009

    Great collection of navigations

    Reply
  27. RK1 Web Design
    December 18, 2009

    Inspiring list of web navigation.

    Reply
  28. Adam Hermsdorfer
    December 19, 2009

    You’re seeing more navigation sets with icon sets and sprites. Nice list.

    Reply
  29. aziq
    December 19, 2009

    Just love them all.

    Reply
  30. Michelle
    December 20, 2009

    really nice collection :)

    Reply
  31. Amanda Sage
    December 21, 2009

    I like the more subtle ones. I think Nosotros is my favorite. The only one I really don’t like is the ribbon-shaped Home button on Billy Tamplin… it looks like an award, which would be a weird thing to have in your navigation.

    Reply
  32. Andy
    December 21, 2009

    Some really good ones. I get inspired by looking at them. Thanks for showcasing them.

    Reply
  33. Template Customization
    December 24, 2009

    I like the “atebits” site, like apple design. Very nice looks. Thanks a lot.

    Reply
  34. Stephen Ou
    December 29, 2009

    Carsonfied is not on it :(

    Reply
  35. Thibault
    December 30, 2009

    Really good stuff. Thanks for sharing.

    Reply
  36. brahim abrkok
    December 31, 2009

    that”s very nice . all like of them

    Reply
  37. Glendelm Web Design
    January 5, 2010

    This is a great collection. Thanks for sharing these, I particularly like all the Apple-style ones. :)

    Reply
  38. Thomas
    January 8, 2010

    Great inspiration, thanks

    Reply
  39. Pynouch
    January 9, 2010

    love the inkd navigationcsimple but useful.

    Reply
  40. Siddhartha Oza
    January 12, 2010

    Fantastic. Although I know most designers dont prefer it, and I am not a designer or a UX expert, but still, no examples of vertical navigation that are very clicky?

    Reply
  41. Great Post
    January 18, 2010

    Awesome post

    Reply
  42. dotndot
    January 23, 2010

    Wonderful collection.Great post.

    Reply
  43. Digikraf
    February 9, 2010

    I love the Utah.travel thing…. too good…

    Thanx for the post!

    Reply
  44. ecommerce web design
    February 19, 2010

    I think many people over look how important the style of menu buttons can be in a website design. All of these websites are great examples as the menu buttons make you want to click through.

    Reply
  45. Hadith
    February 20, 2010

    Great site for this, im definitely bookmarking it.

    Reply
  46. Ronnie
    February 24, 2010

    http://monaconovel.com
    best navigation ever

    Reply
  47. Shelton Heusinkveld
    March 5, 2010

    I like the layout of your blog and I’m going to do the same thing for mine. Do you have any tips? Please PM ME on yahoo @ AmandaLovesYou702

    Reply
  48. web design los angeles
    March 17, 2010

    These are really great menu designs. Probably one of the most overlooked things when designing a website.

    Reply
  49. Rak Design
    April 13, 2010

    Great varity… good inspirational blog.

    Reply
  50. 12 Excellent CSS3 Button and Menu Techniques | Tutorials
    April 23, 2010

    [...] on so much JavaScript and images to create nice looking website elements such as buttons and menu navigations. So, in order to encourage you to start experimenting with CSS3, we’ve rounded up 12 [...]

    Reply
  51. drummer
    May 5, 2010

    Great site and very nice info! Thanks!

    Reply
  52. Alex I.
    May 11, 2010

    Wow! Also fantastic navigation i’m find here – http://aisay.org

    Reply
  53. Hannah P.
    July 15, 2010

    I am so grateful to know this site. Very amazing! It helping me a lot in navigating easily and is giving me idea in web designing.

    Reply
  54. olvia
    July 21, 2010

    webdesignledger very nice!

    Reply
  55. Kerem
    September 21, 2010

    Not to brag but I find my websites navigation pretty clickable.

    Reply
  56. Webáruház készítés
    May 7, 2011

    Nice i like them :-)

    Reply
  57. RD Web Design
    August 12, 2011

    These are fantastic, internet dream have a very good design with the blue.

    Reply
  58. Nuasoft Web Design
    September 2, 2011

    Some really nice designs there.

    Unfortunatly it looks like lightcms replaced thir navigation with something far less interesting.

    Reply
  59. Website Design New York
    September 30, 2011

    Amazing navigations, stylish navigation plays major role for getting success in online business

    Reply
  60. Web Design Winchester
    March 29, 2012

    Inspirational

    Reply
  61. web designer london
    December 7, 2013

    Awesome collection, it really play key role in online world.
    Thanks for sharing….

    Reply

Leave a Reply