50 Beautiful And User-Friendly Navigation Menus

Advertisement

Usability is an essential goal of any website, and usable navigation is something every website needs. It determines where users are led and how they interact with the website. Without usable navigation, content becomes all but useless. Menus need to be simple enough for the user to understand, but also contain the elements necessary to guide the user through the website — with some creativity and good design thrown in.

Below we present over 50 excellent navigation menus — we feature CSS-based design solutions, CSS+JavaScript-based menus and Flash-designs. However, they all have something in common: they are user-friendly yet creative and perfectly fit to the style of their respective websites.

Please also consider our previous articles:

1. CSS-Based Navigation Menus

Loodo3
A colorful menu that adds to the feel of the website.

Screenshot4

Acko.net5
Steven Wittens takes a look at the navigation menu from a quite unusual perspective.

Screenshot6

Web Design Ledger7
Web Design Ledger has an excellent menu; its large size is convenient but doesn’t intrude on the content.

Screenshot8

UX Booth9
UX Booth uses a a stylish text box under the navigation as a sort of subtext for each menu item.

Screenshot10

Nopokographics11
Vertical navigation menus are used very rarely, for the simple reason: they are harder to use. However, some designers risk unusual approaches. Nopoko Graphics uses an arrow and a hover-effect for its vertical navigation menu.

Screenshot12

Icon Designer13
This website uses a large image-based menu on the home page. The user’s attention is drawn directly to this large menu, making it convenient for users.

Screenshot14

Cosmicsoda15
This large and colorful menu is very noticeable and uses a slight hover effect to further define the menu items.

Screenshot16

Designsensory17
An intuitive drop-down navigation that uses 2 colors effectively to communicate the active navigation item and the passive ones.

Screenshot18

Smallstone19
Smallstone, a U.S. record label, presents its navigation menu in the form of a the so-called Space Echo Roland SE-201.

Screenshot20

TNVacation21
It’s pretty hard to find a nice-looking drop-down menu. This one is a beautiful exception.

Screenshot22

Clearleft23
Clearleft uses a couple of paper pieces for its navigation.

Screenshot24

45royale25
A simple, clean and beautiful navigation with a nice hover effect.

Screenshot26

Design Intellection27
An excellent example of block navigation that shows how effectively “speaking” hover effects can be used with a clean and simple navigation menu.

Screenshot28

Ronnypries.de29
A navigation menu doesn’t have to look like a traditional navigation menu. Ronny Pries uses a floor plan to lead site visitors through the pages of the site.

Screenshot30

Jiri Tvrdek31
Jiri Tvrdek presents the navigation options of his site as leaves on a tree. Creative, unusual and memorable.

Screenshot32

Water’s Edge Media33
Patricia Abbott uses clothespins for the navigation options.

Screenshot34

Matt Dempsey35
Matt Dempsey highlights his navigation options with a brush stroke.

Screenshot36

Cognigen37
The current navigation option is pressed — clear and intuitive.

Screenshot38

District Solutions39
Vertical tabs are used very rarely. But they can look good!

Screenshot40

Jayme Blackmon41
Jayme Blackmon seems to like setting “done”-marks…

Screenshot42

Jeff Sarmiento43
Why not try a sloping navigation options once in a while?

Screenshot44

Studioracket45
A really unusual navigation menu that uses some kind of a mindmap to illustrate the navigation. And, apart from that, the navigation menu is hand-drawn!

Screenshot46

Cultured Code47
A subtle yet distinct menu that is out of the way of content. Excellent colors and a nice hover effect also add to the menu.

Screenshot48

Nando Designer49
This Portuguese designers uses handwriting and a piece of paper for its main navigation.

Screenshot50

Bonfiremedia51
Sometimes typography is just enough…

Screenshot52

Artgeex53
Vivid typography in use.

Screenshot54

Gloobs55
Some designers integrate a stamp in the contact navigation option.

Screenshot56

South Creative57
This website uses large navigation buttons and has a good hover effect.

Screenshot58

Mac Rabbit
59One more example of a large and clean menu. This one uses icons to aid the reader in recognizing each item’s function.

Screenshot60

RapidWeaver61
This menu has a clean and smooth layout, and it has a great sub-menu that uses transparency to separate it from the main menu.

Screenshot62

DFW UPA63
Icons reinforce the menu items on this website and add emphasis to each option.

Screenshot64

Revolution Driving Tuition65
This website has a great grunge style, and the menu fits right into the layout.

Screenshot66

Duarte Pires67
This menu is located close to the content, where it is easy to use. It uses large icons, which adds a visual element to the navigation. Also, the menu on other pages uses the same icons in a vertical layout, bringing consistency to the website. The icons may not fit perfectly, but it’s a nice idea.

Screenshot68

Valetin Agachi69
This navigation has a rather unique style that emphasizes selected items. Also, the menu layout stays consistent throughout the whole website.

Screenshot70

Tutorial971
Tutorial9 recently got a nice redesign, which came with a very usable and well-organized menu.

Screenshot72

2. CSS Menus With JavaScript

Agami Creative73
Designers sometimes use tooltips for their navigation. However, tooltips and aqua are quite an unusual combination.

Screenshot74

Whitehouse.gov75
A perfect example of how one should organize huge amounts of content into clear and easily distinguishable sections. Also, excellent design of the drop-down menu.

Screenshot76

AppStorm77
AppStorm is a new website by Envato. A jQuery effect is used to create an excellent and very usable drop-down menu.

Screenshot78

Eric Johansson79
Eric Johansson, a designer from Sweden, uses tall vertical blocks and images for his navigation.

Screenshot80

Coda81
This conveniently located menu has a beautiful hover effect. The sub-menus are consistent and include every item.

Screenshot82

Dragon Interactive83
Dragon Interactive has a colorful jQuery-based menu with a great effect.

Screenshot84

Bern85
I am a big fan of this navigation layout. I like how the menu fits in with the grunge theme. It also uses another jQuery drop-down effect.

Screenshot86

Abduzeedo87
For its recent redesign, Abduzeedo introduced a jQuery slider into the navigation.

Screenshot88

3. Flash-Based Menus

Iipvapi89
Colorful sloping Flash-based navgation from an Indian Web design agency.

Screenshot90

Not Forgotten: The Movie91
Most entertainment websites use Flash and unusual navigation menus to capture users’ attention. On this one, an instant classic, navigation items are put on cards.

Screenshot92

Nick Tones93
Nick Tones, with a dynamic, colorful and yet still somehow usable navigation menu.

Screenshot94

woonky.ideas95
This Argentinian design agency puts CDs and books on a table, each representing a navigation option, of course. When hovered over with a mouse, each object reveals what can be found inside.

Screenshot96

Gotmilk97
The designers of this Flash-based site came up with something truly original. The navigation menu is put on a ribbon; each navigation item has a nice and simple hover-effect: when an icon is hovered, it is replaced with the site area the icon stands for. Usually tooltips are used for this puprose, here designers use a different approach. Outstanding!

Screenshot98

Spectra Visual Newsreader99
A beautiful and very colorful Flash menu that is a good example of excellent usability.

Screenshot100

NickAD101
This unique website is all about easy-to-use navigation.

Screenshot102

Sensi Soft103
This amazing portfolio has very well-thought out and convenient navigation.

Screenshot104

4. Highly Usable Navigation

tap tap tap105
This website has a beautiful layout and a menu with great effects.

Screenshot106

Apple107
Apple has one of the more exceptional websites, particularly because of the navigation layout. The Mac menu is quite amazing. With images, it couldn’t be easier to find items and move through the menu.

Screenshot108

Alex Buga109
Visitors here use a large and well-laid out slider to move through news items.

Screenshot110

CREASENSO111
The content on the home page of this portfolio website has an extremely simple yet usable organization.

Screenshot112

polargold113
This visually stunning Flash-based portfolio uses an accordion-like layout for the content, so there is no loading of new pages. The large type stresses the importance of menu items.

Screenshot114

Colourpixel115
Colourpixel has a very interesting layout for its portfolio. It combines all of its sections onto a single page, and allows each item to be hidden or revealed, as demanded by the user.

Screenshot116

DVEIN117
Yet another excellent Flash-based portfolio. This website organizes all gallery items onto an interesting revolving list.

Screenshot118

Alexandru Cohaniuc119
This portfolio is rather well known for its beautiful layout. An accordion effect allows users to navigate through projects and portfolio items.

Screenshot120

Porsche Canada121
Porsche Canada’s website has very user-friendly navigation, with many sub-items for each menu item. The convenience and usability of this menu is great.

Screenshot122

Jeremy Levine Design123
This architecture portfolio has a unique layout that allows users to easily browse the website. The line of menu items has many effects and transitions that make it very convenient.

Screenshot124

firstborn125
Firstborn, a well-known design studio, uses scrollable, horizontal navigation for its portfolio. The navigation items can also be displayed in other modes, such as thumbnails, making it even better.

Screenshot126

Benjamin David127
This portfolio has a vertical slider that automatically moves through menu items. Many large items are placed together in a single glowing menu.

Screenshot128

Thibaud’s Portfolio129
Another stunning portfolio with creative navigation, this one with Flash-based “color samples” to choose from. Like items are grouped together.

Screenshot130

Jason Reed Web Design131
Accordions are useful when trying to squeeze many items into a small space. Jason Reed used a stylish accordion in his portfolio to allow users to navigate pages.

Screenshot132

Marius Roosendaal133
Another usable accordion menu that groups portfolio items.

Screenshot134

5. Vertical Navigation Layouts

Danny Blackman135
Danny Blackman’s website is often regarded as one of the better portfolios out there, in part because of the amazing vertical layout.

Screenshot136

Tomas Pojeta137
This website is yet another portfolio that uses a vertical layout to incorporate multiple pages onto one, while allowing users to move vertically between sections.

Screenshot138

volll139
Volll uses a vertical layout with a beautiful illustrated landscape background.

Screenshot140

Mediocore141
Mediocore is an awesome portfolio. It has a few more elements than usual on its pages, but still looks excellent.

Screenshot142

6. User-Friendly Sidebar Menus

FreelanceSwitch143
FreelanceSwitch organizes its articles using a great menu.

Screenshot144

Fubiz145
The redesign of Fubiz brings an excellent sidebar. Slide effects are used to fit a large amount of content into a small sidebar.

Screenshot146

Checkout147
Checkout has a stunning website. An extremely clean list-style menu in the features section also displays nice icons.

Screenshot148

Ruby Tuesday149
Ruby Tuesday has a very nice website. The sidebar menu has exceptional icons and smooth hover effects.

Screenshot150

Concentric Studio151
A simple and minimalist menu with sliding effects.

Screenshot152

Barack Obama153
President Obama’s website has a well-spaced and nicely contrasting list-style sidebar menu.

Screenshot154

GABBO DESIGN155
Another clean and well-spaced list menu.

Screenshot156

Further Resources

You may be further interested in these articles and related resources:

(al)

Footnotes

  1. 1 http://www.smashingmagazine.com/2007/03/14/css-based-navigation-menus-modern-solutions/
  2. 2 http://www.smashingmagazine.com/2008/02/26/navigation-menus-trends-and-examples/
  3. 3 http://www.loodo.com.br/
  4. 4 http://www.loodo.com.br/
  5. 5 http://acko.net/
  6. 6 http://acko.net/
  7. 7 http://webdesignledger.com/
  8. 8 http://webdesignledger.com/
  9. 9 http://www.uxbooth.com/
  10. 10 http://www.uxbooth.com/
  11. 11 http://www.nopokographics.com/english/
  12. 12 http://www.nopokographics.com/english/
  13. 13 http://www.icondesigner.net/
  14. 14 http://www.icondesigner.net/
  15. 15 http://www.cosmicsoda.com/
  16. 16 http://www.cosmicsoda.com/
  17. 17 http://designsensory.com/
  18. 18 http://designsensory.com/
  19. 19 http://www.smallstone.com/home.php
  20. 20 http://www.smallstone.com/home.php
  21. 21 http://tnvacation.com/
  22. 22 http://tnvacation.com/
  23. 23 http://clearleft.com/
  24. 24 http://clearleft.com/
  25. 25 http://www.45royale.com/about/
  26. 26 http://www.45royale.com/about/
  27. 27 http://designintellection.com/
  28. 28 http://designintellection.com/
  29. 29 http://www.ronnypries.de/
  30. 30 http://www.ronnypries.de/
  31. 31 http://www.tvrdek.cz/en
  32. 32 http://www.tvrdek.cz/en
  33. 33 http://www.watersmedia.com/
  34. 34 http://www.watersmedia.com/
  35. 35 http://www.mattdempsey.com/
  36. 36 http://www.mattdempsey.com/
  37. 37 http://www.cognigencorp.com/
  38. 38 http://www.cognigencorp.com/
  39. 39 http://www.districtsolutions.co.uk/candidates/
  40. 40 http://www.districtsolutions.co.uk/candidates/
  41. 41 http://www.jaymeblackmon.com/
  42. 42 http://www.jaymeblackmon.com/
  43. 43 http://www.jeffsarmiento.com/
  44. 44 http://www.jeffsarmiento.com/
  45. 45 http://studioracket.org/
  46. 46 http://studioracket.org/
  47. 47 http://www.culturedcode.com/
  48. 48 http://www.culturedcode.com/
  49. 49 http://www.nandodesigner.com/home.htm
  50. 50 http://www.nandodesigner.com/home.htm
  51. 51 http://www.bonfiremedia.com.au/web/
  52. 52 http://www.bonfiremedia.com.au/web/
  53. 53 http://artgeex.com/v6/
  54. 54 http://artgeex.com/v6/
  55. 55 http://www.gloobs.com/
  56. 56 http://www.gloobs.com/
  57. 57 http://southcreative.com.au/
  58. 58 http://southcreative.com.au/
  59. 59 http://www.macrabbit.com/
  60. 60 http://www.macrabbit.com/
  61. 61 http://www.realmacsoftware.com/rapidweaver/
  62. 62 http://www.realmacsoftware.com/rapidweaver/
  63. 63 http://dfw-upa.org/
  64. 64 http://dfw-upa.org/
  65. 65 http://www.revolutiondrivingtuition.co.uk/
  66. 66 http://www.revolutiondrivingtuition.co.uk/
  67. 67 http://www.duartepires.com/
  68. 68 http://www.duartepires.com/
  69. 69 http://agachi.name/weblog/
  70. 70 http://agachi.name/weblog/
  71. 71 http://www.tutorial9.net/
  72. 72 http://www.tutorial9.net/
  73. 73 http://agamicreative.com/
  74. 74 http://agamicreative.com/
  75. 75 http://www.whitehouse.gov/
  76. 76 http://www.whitehouse.gov/
  77. 77 http://mac.appstorm.net/
  78. 78 http://mac.appstorm.net/
  79. 79 http://www.ericj.se/
  80. 80 http://www.ericj.se/
  81. 81 http://www.panic.com/coda/
  82. 82 http://www.panic.com/coda/
  83. 83 http://dragoninteractive.com/
  84. 84 http://dragoninteractive.com/
  85. 85 http://www.helmy-bern.cz/
  86. 86 http://www.helmy-bern.cz/
  87. 87 http://abduzeedo.com/
  88. 88 http://abduzeedo.com/
  89. 89 http://iipvapi.com/
  90. 90 http://iipvapi.com/
  91. 91 http://www.notforgottenmovie.com/
  92. 92 http://www.notforgottenmovie.com/
  93. 93 http://www.narrowdesign.com/
  94. 94 http://www.narrowdesign.com/
  95. 95 http://www.woonky.com.ar/
  96. 96 http://www.woonky.com.ar/
  97. 97 http://www.gotmilk.com/#/gotmilkbrand/
  98. 98 http://www.gotmilk.com/#/gotmilkbrand/
  99. 99 http://msnbcmedia.msn.com/i/msnbc/components/spectra/spectra.html
  100. 100 http://msnbcmedia.msn.com/i/msnbc/components/spectra/spectra.html
  101. 101 http://www.nickad.com/
  102. 102 http://www.nickad.com/
  103. 103 http://www.sensisoft.com/
  104. 104 http://www.sensisoft.com/
  105. 105 http://www.taptaptap.com/
  106. 106 http://www.taptaptap.com/
  107. 107 http://www.apple.com/mac/
  108. 108 http://www.apple.com/mac/
  109. 109 http://www.alexbuga.com/v8/
  110. 110 http://www.alexbuga.com/v8/
  111. 111 http://www.creasenso.fr/
  112. 112 http://www.creasenso.fr/
  113. 113 http://www.polargold.de/
  114. 114 http://www.polargold.de/
  115. 115 http://www.colourpixel.com/
  116. 116 http://www.colourpixel.com/
  117. 117 http://www.dvein.com/
  118. 118 http://www.dvein.com/
  119. 119 http://www.alexcohaniuc.com/
  120. 120 http://www.alexcohaniuc.com/
  121. 121 http://www.porsche.com/canada/
  122. 122 http://www.porsche.com/canada/
  123. 123 http://www.jeremylevine.com/
  124. 124 http://www.jeremylevine.com/
  125. 125 http://www.firstbornmultimedia.com/
  126. 126 http://www.firstbornmultimedia.com/
  127. 127 http://benjamindavid.cc/
  128. 128 http://benjamindavid.cc/
  129. 129 http://www.thibaud.be/
  130. 130 http://www.thibaud.be/
  131. 131 http://www.jasonreedwebdesign.com/
  132. 132 http://www.jasonreedwebdesign.com/
  133. 133 http://www.mariusroosendaal.com/
  134. 134 http://www.mariusroosendaal.com/
  135. 135 http://www.dannyblackman.com/
  136. 136 http://www.dannyblackman.com/
  137. 137 http://www.pojeta.cz/
  138. 138 http://www.pojeta.cz/
  139. 139 http://www.volll.com/#section_main
  140. 140 http://www.volll.com/#section_main
  141. 141 http://www.mediocore.cz/
  142. 142 http://www.mediocore.cz/
  143. 143 http://freelanceswitch.com/
  144. 144 http://freelanceswitch.com/
  145. 145 http://www.fubiz.net/
  146. 146 http://www.fubiz.net/
  147. 147 http://www.checkoutapp.com/features/#sales
  148. 148 http://www.checkoutapp.com/features/#sales
  149. 149 http://www.rubytuesday.com/
  150. 150 http://www.rubytuesday.com/
  151. 151 http://concentric-studio.com/work/dealbreaker/?nav=2
  152. 152 http://concentric-studio.com/work/dealbreaker/?nav=2
  153. 153 http://www.barackobama.com/index.php
  154. 154 http://www.barackobama.com/index.php
  155. 155 http://www.gabbo.cz/graficke-studio.html
  156. 156 http://www.gabbo.cz/graficke-studio.html
  157. 157 http://patterntap.com/tap/collection/navigation
  158. 158 http://www.noupe.com/ajax/13-awesome-java-script-css-menu.html
  159. 159 http://www.noupe.com/menu/7-advanced-css-menu-for-your-next-design.html
  160. 160 http://www.1stwebdesigner.com/recources/300-jquery-css-mootools-and-js-navigation-menus/

↑ Back to top Tweet itShare on Facebook

Matt Cronin is an avid graphic designer, web designer/developer, Cocoa programmer, photographer, digital artist, and the like. He also enjoys writing, and does quite a bit of writing for Smashing Magazine. He is currently working on a startup called VAEOU, which will have new services coming soon.

Advertisement
  1. 1

    Uh. It’s RE-201, not SE-201. Not that anyone cares… ho hum.

    0
  2. 52

    Can some of these be used with WordPress?

    0
  3. 103

    This is a great list. It’s very extensive, and I’m sure will provide a lot of design inspiration in the future. However, I do not think that it lives up to its “User-Friendly” title – the vast majority of these are clearly not designed with usability as the primary focus.

    0
  4. 154

    These mashups are much more useful when they link to examples of how you too can achieve these effects. Here are two (one of them is a shameless plug for my blog) off the top of my head: Dragon Interactive hover fade and CODA popup bubble.

    0
  5. 205

    And another nice CSS-Navigation from a german website: http://www.liberty-homes.de

    0
  6. 256

    Thanks Matt for the shout out!

    0
  7. 307

    Really great job smash magazine i like that “Designsensory” Menu it has perfect web design too .

    0
  8. 358

    Hi, Matt. just a note: Nando (of Nando Designer) is not portuguese, he’s brazilian, from Rio de Janeiro.

    cheers!

    Rui

    0
  9. 409

    I agree with boredreader #39 we have seen most of these sites in previous posts. I guess it’s OK to dissect these sites but hopefully we can look forward to some new content here on SM and not simply re-posts with different titles.

    0
  10. 460

    I might mention that my site (included in this list) does actually validate as XHTML 1.0 strict, and gracefully degrades as well. I just wanted to prove that some JS-dependent navigation can actually remain useful if JS is disabled, and to dismiss any navigation that uses JS is perhaps a bit short sighted.

    Whether or not it is ‘user friendly’ is perhaps up to the individual user. I find it to be friendly and interesting, but that’s just me.

    0
  11. 511

    Thanks for the compilation =) Seems hover menus and tabs are pretty common

    0
  12. 562

    50 Beautiful And User-Friendly Navigation Menus.

    But thanks :)

    0
  13. 613

    amazing! Thx!

    0
  14. 664

    @Euge I worked on the navigation featured from Tutorial9.net and UXBooth.com, and can confirm that both these sites are WordPress blogs. Takes a bit of understanding to get things to work nicely though =/

    0
  15. 715

    Knoxville Website Design

    February 6, 2009 6:24 am

    Nice collection here to revisit from time to time.

    0
  16. 766

    nice one really! :D

    0
  17. 817

    Really nice collection, Thank!

    0
  18. 868

    The fact that there are “highly usable” and “user-friendly” categories shows how ridiculous the others are. The menu is unimportant. The content should drive navigation and be the focus of your site. It’s like Vista vs. Mac OS X. The UI shouldn’t be the focus.

    0
  19. 919

    That’s an awesome compiled list of navigation! Not only that the sites sport an intuitive and visitor-friendly navigation menu, they have great designs that inspire. These websites have more than just menus to offer – thanks for sharing! Woonky.ideas is one of the brightest one so far, not to mention the ones from Studioracket and Fubiz :)

    0
  20. 970

    The whitehouse.gov menu doesn’t use javascript actually accept for maybe the transparency. it’s all css for the hover and column like menu item list

    0
  21. 1021

    Mushex Antaranian

    February 6, 2009 5:32 pm

    Adidas.com – beautiful but not user friendly ..

    0
  22. 1072

    A very nice CSS/Java menu I’ve found at http://www.nextframe.ro . You might want to include this too.

    0
  23. 1123

    Many great ideas. Thank you.

    0
  24. 1174

    Christopher Peterson

    February 7, 2009 2:16 pm

    This is a great list of sites, i will be sure to come backt o it for inspiration.
    As for user friendly, not so much, especially the flash layouts.

    0
  25. 1225

    Matt, thanks for adding my website nopokographics in your list.
    Great job guy!
    Keep going!

    0
  26. 1276

    Some very nice examples.

    0
  27. 1327

    Thanks very much for the nice list, you guys always showcase things that are truly inspiring and fresh! Thanks!

    0
  28. 1378

    Thx a dozen for the apprecation – SM ftw!

    0
  29. 1429

    Wow great collection and thanks for the list.

    0
  30. 1480

    Wouter Van den Neste

    February 11, 2009 6:47 pm

    Real nice article! There are some great innovative ideas included in this post!

    0
  31. 1531

    I built AppStorm and I want to say thank you for including it in this awesome list, but just thought it might be important to note that the jQuery used for the menu is to add a class to the current top level category so it stays active when hovering over the subnav. It really isn’t a full blown jQuery menu, just a couple lines of code are used to achieve the effect. The CSS is really the one that is doing the heavy lifting here. And by the way, great roundup. There are a lot of really nice navigation out there.

    0
  32. 1582

    Thanks a lot for sharing, keep it up!

    0
  33. 1633

    cool! thanks

    0
  34. 1684

    These are all super inspiring. I think I come to this website almost once a day to check on new and great information. I just created a very cool blog that I am super proud of. It has a ticker that sends info to readers and it has links at the top as well as side links that move with you as you navigate the blog. It also has a music player that we installed that organizes all of the music on the page. I know you said no link dropping but I am just really proud of the navigation part of my blog and would love to show you and your readers. Cheers.

    0
  35. 1735

    Many thanks!

    0
  36. 1786

    Nick Tones sounds much cooler but it’s Nick Jones. Thanks so much for including me though!

    0
  37. 1837

    Bold Endeavours

    March 26, 2009 2:39 am

    this is amasing! i am really impressed by the variety of menues. thank you

    0
  38. 1939

    awesome list

    Thnks guys.

    0
  39. 1990

    very nice post.. But i feel NickAd is not user friendly..

    0
  40. 2041

    Can Nick Tones’ be made in CSS as well? Any idea or other examples?

    0
  41. 2092

    Some really pretty example in there, which are great to look at and showcase the talents of the designers that came up with them.

    But…..as other people have said, many are distinctly user unfriendly. Visitors to your site shouldn’t have to think about how to navigate it – it should be intuitive. Sure, this might make for some slightly less pretty nav solutions (although there’s still a lot of scope IMO) but it’s much more important for users to be able to navigate your site than to sit there thinking, “wow, pretty. Now how do I get about”.

    That said, there are certainly some examples in this list that look good, and enhance the user experience.

    0
  42. 2143

    Some of these examples are nice….. yet…. a lot of these examples are pretty horrible. Looking at the mac slide bar… I hate using that thing. When the browser loads the page the control does not respond immediately. There are other things in this list that are pretty bad too like the small stone example… hey, here is an idea…. make users hunt around for things they need… why not just hide the links all together and they just have to click and guess where they want to go and really waste their time… yeah, that’s the ticket. :/

    0
  43. 2194
  44. 2245

    Very good collection

    0
  45. 2296

    Great article. And of course there is the easy way to create flash menus using FMF: http://www.flashmenufactory.com/

    0
  46. 2347

    I love macrabbit’s menu!

    0
  47. 2398

    Where in the world can you learn to make these masterpieces?? Books, articles, tutorials? Anyone?!!!

    0
  48. 2449

    These are truly excellent, well done

    0
  49. 2500

    Web Design Camarillo

    May 20, 2010 12:12 pm

    Anytime text is written vertically it is difficult to read and generally not considered to be user friendly. However it does have high aesthetic value.

    0
  50. 2551

    These are excellent compilations of navigation menus and websites that have outstanding designs. Keep them coming.

    0

↑ Back to top