Menu is important element of every website. Good horizontal menu must be interesting, creative, effective and easy to navigate (user-friendly).

The greatest advantage of horizontal menu is that it occupies less space than vertical one and even more importantly, grouping the menus horizontally can make page navigation easier. On top of that, it can be customized to fit any design, from clean and sleek to retro. Navigation bars built by using flash have cool rollover animation, however you can create a very appealing menu by using CSS list style, rollover effects and popular sliding door effect.

On this list you will find 26 excellent examples of horizontal menus that will help awake your inspiration. These menus are beautiful, creative, stylish… they are just stunning.

1. http://www.boomawebdesign.com/



Very creative and interesting, easy to make, horizontal menu. Instead of saving each link as a separate image, you can save only one image and use CSS positioning to display them all where needed. This is called CSS sprites method. Using this technique your pages will load faster since you'll save bandwidth, HTTP requests, and more.

2. http://www.loodo.com.br/



This is very simple menu with great idea and design. It’s a classic CSS list style (ul li). This menu also uses the CSS sprites method. The whole menu is made out of one picture and for each single image (link) and CSS positioning is used to display them where needed on hover effect.

3. http://www.fritula.hr/index.php/



This one has very nice Overlapping navigation in CSS. On click or mouse over event the notebook that is below appears at the top and the current link (booklet) has different color than the others (pink).

4. http://avalonba.com/

5. http://www.skialpine.com/



Site Skialpine has interesting drop down horizontal menu. It’s created by using JavaScript and on MouseOver and on MouseOut events.

6. http://rzepak.pure.pl/



Very interesting horizontal menu design that fits into the overall look of the site.

7. http://www.noizikidz.com/



This musical site has good-looking JQuery drop down menu.

8. http://www.kriesi.at/



Beautiful JQuery menu. On MouseOver event it shows a picture that describes the link and hides the picture after MouseOut effect.

9. http://www.maxandlous.com/



This top menu provides hover-effects with visual hints. It looks nice and unusual.

10. http://www.nickad.com/



The most unusual menu is Nickad’s Flash-based menu. It becomes visible only if the mouse is clicked and remains being clicked. Choosing a specific link is achieved by moving the mouse up or down and right or left but the left mouse button must constantly be pressed.

11. http://www.le-moulin-de-sauvage.com/

12. http://www.nue-media.com/

13. http://www.twitterevolutions.com/



Very beautiful, imaginative horizontal menu with lava lamp effect (moving lady bug) using jQuery and JavaScript.
Lava Lamp menu is a menu with a bar/graphic that would slide around using some sort of animated affect. These types of menu have become known as "Lava Lamp" menus because the hover state background moves and "stretches" a bit like the lava in a lavalamp.

14. http://www.regines.net.au/

15. http://smallmanrecords.com/

16. http://soupstudios.com/

17. http://www.tnvacation.com/

18. http://watevertnkz.com/

19. http://trendywebdesign.nilarian.com/

20. http://www.webdesignerwall.com/

21. http://blog.wireroses.co.uk/

22. http://clearleft.com/

23. http://www.jay-han.com/

24. http://www.starcraft2.com/



Games related sites, especially online games, utilized horizontal navigation bar, because it can display the menus without using too much space. Navigation bars that are built using flash can have cool rollover animation. This one has nice flash top menu with interesting sound on a mouse over effect.

25. http://www.boukarabila.com/



This menu has nice mouse over event that fades in and fades out the popup menu made with JavaScript functions.

26. http://www.rekkiabilly.com/

You can choose a different type and effect for horizontal menu. There are drop down, flyout, popup navigation menus, multi-column navigation, rollover navigation, sliding doors method, sprites method, tabbed navigation look and lava lamp effect.

Web users usually behave based on learned habits. Creating a layout or pattern that unnecessarily disrupts those habits will only weaken your website’s conversion rates.

So, before you design a horizontal navigation menu, consider link names, section hierarchy and any other factors that could affect usability. In doing so, you will create a smooth user experience that allows visitors to find the information they want quickly and efficiently.