Navigation Menus

Navigation is a large part of your web site and to the visitor, it is an all important part of your site. Without clear navigation the visitor quickly becomes fed-up with trying to figure out how to get where they want to be.

Navigation can be a simple hyperlink (as shown on the left sidebar), or as complicated a peice of kit as you want. As long as the visitor finds it a pleasure to use and easy to get around your site that's all that matters.

Below are a number of menu examples, each is fully configurable and can be horizontal or vertical, they can also be made to match the colour scheme and style of your site. Most are controlled by a java script file that dictates how the menu is to behave, the rest are controlled by a style sheet that tells the visitors browser how to display the menu. This is where the web standards come into their own, by complying with these standards means your web site will be displayed in all browsers the way you want it to be displayed.

Horizontal Navigation Menu Examples
Hover over the menus for a demonstration.

Menu 1

 

A simple black drop-down menu with as many submenu levels and item as you require. The menu can be fully configured using the same fonts, colours and widths etc to match the web site.

Menu 2

 


This menu gives the option of multiple columns within the menu and also supports images. Again this menu can be made to any width or styling.

Menu 3

 


This menu has a different arrow style that only appears on mouseover.

Menu 4

 



This menu has a push button look on mouseover.
The colouring and style of the menu background is also fully configurable.


This is an image based menu that can show any image and is linked like any normal navigation menu. This one works on an accordian principle, hover the cursor over the titles to see it in action.
Vertical Navigation Menu Examples
Hover over the menus for a demonstration.

Menu 1

 








This menu is styled as a box and has submenus that also open as a box.

Menu 2

 








This menu has a space age feel to it and the background changes colour on mouseover.
Menu 3
 









This menu has styling and images to make it appear to be part of a building.
Menu 4

Home
pic

As you can see you can have images and free text within the slider menu

  • Links to pages
  • Links to anywhere

    • Services
    pic

    As you can see you can have images and free text within the slider menu

  • Links to pages
  • Links to anywhere

    • Products
    pic

    You can have any image or images within the menu along side free text and links.

  • Links to pages
  • Links to anywhere

    • About Us
    Here you can give your visitors a brief insight as to the content of your page


  • Links to pages
  • Links to anywhere

    • pic
    Contact Us
    Here you could give your visitors a

    Postal Address

    email@addresslink

    or a

    Phone Number

     


    This is a sliding menu and can have links, free text and images, click on a title to open the menu. As the menu expands all of the content below it is pushed down the page to allow the content to be seen.
    Menu 5


    This menu is controlled by a CSS file of its own, as is the web page that you are currently on.
    Menu 6



    Again this menu is styled purely by a CSS file and is completely configurable it also has the appearance of 3D buttons.
    Tabbed Menu Examples

    Menu 7

     

    Rounded black tabs highlighted on mouseover feature on this example. These are also configurable to suit your colour schemes and styles.

     

    Menu 8

    Tabbed menus work exactly the same as any other navigation menu, other than they appear as tabs, these examples are styled purely with CSS.


    So as you can see from the examples above that navigation can change the look and feel of your web site and it should play a large part of the planning of your web site.

    Whether you want a fully styled navigation menu or a simple list of hyperlinks, clear navigation is one of the major parts of your site.