A navigation outlines the structure of the entire website, showing all the webpages and what links to what.
A vertical web site navigation system
The image on the left shows a very common layout of web sites. The header section (in orange) carries the logo, ideally on the left, and might have other images and/or text. The navigation menu is placed in the green section. It might not span the entire height of the page and can have other web page elements or simply blank space below it. The main web page contents (text and images) are situated in the light grey area.
Horizontal web site navigation bar
The web site navigation bar can also be placed horizontally right below the header section of a web page as depicted in green color in the adjacent image. The main contents of the web page are located in the light grey area. The only disadvantage of this web page layout is that the text spans the entire width of the page. This makes it difficult to read as studies have shown that online surfers find it hard to read web page text which spans more than 600 pixels. This problem can easily be overcome by limiting the width of the text display area so that it's lesser than 600 pixels. To fill the blank space created on the left and the right of the text, one can use images or other design elements.
Vertical and Horizontal navigation systems
The third common web site navigation menu layout is shown in the adjacent image. Here the navigation system exists both as a horizontal bar right below the header and also on the left. This is generally used for sites (such as this one), in which there are several pages (and hence, several links). For example, on webdevelopersnotes.com, links to the important sections of the web site are placed horizontally and the links to pages inside that section are placed on the left. Links placed in the horizontal bar remain the same throughout the web site but the links on the left change depending on the web site section.
A navigation map is similar to a storyboard, although it doesn't show all the detail. If the layout is well prepared, then the website itself should be easy for users to navigate through, they should know how to get out of each page or return to the homepage. If a navigation map is poor, it could result in visitors leaving your page early and not returning. It should be clear and well laid out to encourage visitors to explore your website easily and stay on it for longer.
There are many different ways to lay out a navigation map; In multimedia the four maps are familiar as follows:
Linear: Users navigate sequentially, from one frame or bite of information to another.
Hierarchical: Also called “Linear with branching” since users navigate along the branches of a tree structure that is shaped by the natural logic of the content.
Non-Linear: Users navigate freely through the content of the project, unbound by predetermined routes.
Composite: A Composite structure pretty much uses all the structures. Users may navigate freely, but are occasionally constrained to linear presentations of moves or critically constrained to linear presentations of movies or critical information and /or to data that is most logically organized in a hierarchy.
Participants