|
The navigation style of your site is closely related to your site's overall design. You want your navigation to fit with your page grid, stick to your color scheme, and be presented in complementary and readable fonts.
But most of all, your navigation should help visitors get to the information they want from your site simply and quickly.
Whether you use images or plain text, the navigation links that guide visitors come in four varieties primary, secondary, permanent, and functional though you may see all four only on a large site like Amazon.com.
A single-page site won't have any navigation (since there aren't any other pages to link to) and a small site might only have a few main links and a permanent "Contact Us" link at the bottom of every page.
The primary navigation should be the most prominent kind of navigation in your design. It identifies the six to eight main sections of your site, even if a section is just one page.
The secondary navigation differ; from section to section and provides links to supplemental pages below the main page of a primary link. If you have a lot of secondary navigation, your site may not be a "small site." Large sites may even have tertiary (or third-level) and fourth-level navigation.
On a small site, some of your main site areas (primary navigation links) might have sub pages that require secondary links for navigation and some that don't. Don't feel compelled to create additional secondary pages for sections that don't need them just because other sections have them.
Also, avoid the tendency to make every page on your site a primary navigation link. For example, if you have a "Contact Us" link, you probably don't need one that says "Map & Directions." Those navigation links can go on the contact page.
Likewise, you can make an "About Us" or "News" page home to links to your latest news releases, as well as information about your intern program or recent awards you've won, rather than making each one a primary link of its own.
The permanent navigation contains small and easy-to-get-to links that don't fit into the primary structure of the site but need to be on every page things like "Site Map," "Contact Us," and the like. The functional navigation includes links for special sections or actions on your site, such as search results or a shopping cart. Your website may not have any functional navigation.
Where you place your site's navigation is less important than keeping it in the same place throughout your site. Basing your site design on a grid or template ensures that your navigation maintains a consistent location.
The top of the page is the safest and most common place for primary navigation. Permanent navigation might sit above it or perhaps at the bottom of the page with your copyright notice.
Many sites use the classic "inverted L" design, so-called for the top bar and left-hand sidebar placement of primary and secondary navigation. The scheme is common among large sites and offers small sites with big plans room to grow.
Many sites without the need for extensive secondary navigation follow the "inverted L" format but leave one leg of the "L" empty of navigational elements since it does show the company name. Top navigation bars provide quick access to the main sections of your site.
Tabs are a popular variation on the top navigation bar found on many small sites. Navigation bars, while limited by the horizontal width of the screen, can be expanded with JavaScript- or Java-based drop-down menus for secondary navigation, if necessary. Sidebar placement of primary navigation offers arguably more room, especially for sites with longer navigation phrases.
Other ways to enhance your site's navigation include breadcrumb links and icons. Breadcrumb links show a link-based path through the site's structure to the current page. They give visitors a way to jump one or more levels up in the site's structure. Breadcrumbs are most effective in deep sites with lots of sub- and sub-subpages.
Icons are commonly used and commonly misused as enhancements to a site's navigation. Notoriously cryptic and open to interpretation, icons are best used sparingly for familiar website actions, such as an envelope icon for a contact form or shopping cart for reviewing order contents. Icons are always themselves enhanced by text labels that explain the resulting action.
Action Steps
1. Your navigation should help visitors get to the information they want from your site simply and quickly.
2. The primary navigation should be the most prominent kind of navigation in your design.
3. Don't feel compelled to create additional secondary pages for sections that don't need them just because other sections have them.
4. Avoid the tendency to make every page on your site a primary navigation link.
Important Points
- The navigation style of your site is closely related to your site's overall design.
- Basing your site design on a grid or template ensures that your navigation maintains a consistent location.
- Other ways to enhance your site's navigation include breadcrumb links and icons.
[ More Website Tips ]
|
