Scribd
Upload
32 views9 pages

Website Navigation

The document discusses different types and styles of website navigation such as hierarchical, global, local, text links, breadcrumbs, navigation bars, tab navigation, sitemaps, dropdown menus, and flyout menus. It emphasizes the importance of consistent navigation that is easy to use and minimizes clicks for visitors to find desired pages or sections.

Uploaded by

Roshan kumar sahu
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
32 views9 pages

Website Navigation

The document discusses different types and styles of website navigation such as hierarchical, global, local, text links, breadcrumbs, navigation bars, tab navigation, sitemaps, dropdown menus, and flyout menus. It emphasizes the importance of consistent navigation that is easy to use and minimizes clicks for visitors to find desired pages or sections.

Uploaded by

Roshan kumar sahu
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 9

Skip to Content | Skip to Navigation

Website Navigation

Website navigation is important to the sucess of your


website visitor’s experience to your website. The website’s
navigation system is like a road map to all the different
areas and information contained within the website.

Using a consistent navigation scheme from page to page


helps the website visitor learn your website navigation
system.

Types of Website Navigation

There are different types of website navigation:

Hierarchical website navigation

The structure of the website naviation is built from


general to specific. This provides a clear, simple path to
all the web pages from anywhere on the website.

Global website navigation


Global website navigation shows the top level
sections/pages of the website. It is available on each
page and lists the main content sections/pages of the
website.

Local website navigation

Local navigation would the links with the text of your


web pages, linking to other pages within the website.

Styles of Website Navigation

Styles of website navigation refers to how the navigation


system is presented.

Text Links

Text links are words (text) which are surrounded by the


anchor set of tags to create clickable text which takes
the visitor to another web page within your website, a
downloadable document from your website, or to
another website on the Internet.

Breadcrumbs
Breadcrumb navigation shows the website visitor the
path within your website to the page they are currently
on.

Navigation Bar

A navigation bar is the collection of website navigation


links all grouped together. A navigation bar can be
horizontal or vertical.

Tab Navigation

Tab navigation is where the website navigations links


appear as tabs, similar to the tabs you use in a binder to
divide the contents into sections.

Sitemap

A sitemap is a page within your website that lists all the


sections and web pages (if you don’t have too many)
that are contained within the website. This is different
from Google Sitemaps and Yahoo Sitemaps.

A traditional sitemap provides navigation for your


website visitors should they get lost, a shorter path to
the different areas of the website for those who know
what exactly they are looking for and a means for the
search engines to find all the pages within your website.

Dropdown Menu

A dropdown menu is a style of website navigation where


when the visitor places their mouse over a menu item,
another menu is exposed. A dropdown menu can include
a flyout menu (see next item).

A dropdown menu system can create accessibility


issues and a problem as far as the search engines not
being able to read the links in the menu, but if
constructed properly, these issues can be overcome.

Flyout Menu

A flyout menu is constructed similar to the dropdown


menu. When the visitor places their mouse over a link,
another menu “flys out”, usually to the right, from the link
where the mouse is placed.

Flyout menus face the same challenges as dropdown


menus but if constructed properly, they can be
accessible and readable by the search engines.
Named Anchors

Named anchors are the type of links that take you


directly to a spot on the current page or on another web
page.

Website Navigation Use

To be effective, the website navigation system needs:

To be consistent throughout the website.

The website visitors will learn, through repetition, how to


get around the website.

The main navigation links kept together.

This makes it easier for the visitor to get to the main


areas of the website.

Reduced clutter by grouping links into sections.

If the list of website navigation links are grouped into


sections and each section has only 5-7 links, this will
make it easier to read the navigation scheme.
Minimal clicking to get to where the visitor wants to get
to.

If the number of clicks to the web page the visitor wishes


to visit is minimal, this leads to a better experience.

Some visitors can become confused or impatient when


clicking a bunch of links to get to where they want to be.
In large websites, this can be difficult to reduce. Using
breadcrumbs is one way to help the visitor see where
they are within the website and the path back up the
navigation path they took.

Creating the website navigation system at the planning


stage of the website will effect the overall design of the web
page layout and help develop the overall plan for the
website.

Further Reading

Jakob Nielsen’s Alertbox Newsletter of March 31, 2008


points out:

“Between the ages of 25 and 60, people’s ability to


use websites declines by 0.8% per year — mostly
because they spend more time per page, but also
because of navigation difficulties. …problem is that
people have more trouble navigating websites as
they age….”
Middle-Aged Users’ Declining Web Performance
(Jakob Nielsen’s Alertbox)

Don’t Make Me Think,A Common Sense Approach to Web


Usability, Second Edition by Steve Krug is a short book
written for web designers, website owners and anyone else
involved in the development of a website. Well worth reading
as Mr. Krug works through website navigation and other
issues related to the usability of websites.

Web Pages That Suck and Son of Web Pages That Suck by
Vincent Flanders and co authors is another good set of
books to read. Mr. Flanders coined the phrase “meatless
navigation” for navigation systems that leave the website
visitors clueless as to what each symbol in the website
navigation is for.

Colour blindness on the Web is written by a person with


colour blindness. Within the article he points out:

“…aspect of red-seeming-black that causes me


problems on the Web. The issue arises when
designers specify links to be dark red but don’t
underline or embolden them. This means the link is
indistinguishable from the rest of the text. …So be
careful with your link colours (or simply make sure
they are all underlined or emboldened)…”
Colour blindness on the Web

Importance of link architecture – Part of Google Webmaster


Central Blog’s Linking series October 2008.

“…Link architecture—the method of internal linking


on your site—is a crucial step in site design if you
want your site indexed by search engines….”

Importance of link architecture.

Copyright © 2005 - 2018 Web Page Mistakes. All rights reserved.

What's next?

Follow our new articles via RSS, follow us on Twitter and


submit to your favourite social networking site:

This entry was last modified January 6, 2013 at 12:21 pm and is filed
under Site Design . You can follow any responses to this entry through the
RSS 2.0 feed. You can skip to the end and leave a response. Pinging is
currently not allowed.

Website Navigation Was Mentioned Here:


1. Website Design Mistakes
2. Website Testing
3. Free Web Hosting VS Paid Web Hosting
4. Better Usability Through Consistent Design

[Home] [HTML Basic Tutor] [HTML Basics Simplified]


Custom Theme by Accrete Web Solutions
Copyright © 2005-2018 Web Page Mistakes Entries (RSS)
and Comments RSS).

You might also like