Information Architecture for the Web: Information Architecture

Just as your home needs doors and windows to gain entry, your website needs quality navigation.

When a user interacts with your website, they are navigating. Regardless of whether people will be browsing the website or using a search tool, planning is critical. The navigation elements such as buttons, directories, and indexes must all be focused on helping the users fulfill their information needs.

Context

It's essential that your user is oriented within the page and website. They should always know where they are located in your cyberworld. The information hierarchy should be clear and consistent to help them build a mental model of the organization scheme. In other words, the user should know the layout of the house so they can easily move between rooms.

Try Keith Instone's Navigation Stress Test. He asks three basic questions: Where am I? What's here? Where can I go?

Jump into the middle of a website. Can you get back to the home page? Select a random page. Can you figure out where you are in relation to the rest of the website? Are the links descriptive? Can you tell where the next page will lead?

Navigation Systems

Navigation systems can be embedded, supplemental, or advanced.

Embedded Navigation

Embedded navigation systems are integrated into the context of the site to help users understand where they are and where they can go.

Global (site-wide) navigation systems. These are intended to be present on every page of a web site such as a navigation bar at the top of each page.

Local navigation systems. These enable users to explore the immediate area such as local navigation systems. They provide access to subsites within the main web site such as a bar along the left-hand side of the page.

Contextual navigation. These links are specific to a particular page, document, or object such as "see also" links.

Ask yourself:

Are textual or graphical navigation bars better?
Where do the navigation bars belong on a page?
Should you use textual labels or icons?
Should you use frames?

Supplemental Navigation

Supplemental navigation systems exist outside the content-bearing pages and provide alternative ways to access information.

Sitemaps. These present a "bird's eye view" of the top few levels of the information hierarchy. This broad view of the content and facilitates provide easy access to the content.

Site indexes. These provide direct access to content through keywords or phrases. Normally organized alphabetically, they work well with users who know the name of the item they are seeking.

Guides. Tours, tutorials, and micro-portals focused on a specific audience, topic or task provide customized linear navigatin. They often introduce new users to the site's content and functionality. These tools should be kept short, easy to exit, and designed to answer questions.

Wizards. These systems assist users in specialized tasks.

Search. Searching systems are also part of the navigation.

Advanced Navigation

With the introduction of Web 2.0 additional options are available for making your website dynamic.

Personalization and Customization. Many websites allow users to select what content they wish to have presented at a particular time. MyYahoo is a popular example.

Visualization. People like to visualize the website. Some people use metaphors , while others use themes or graphic organizers. Grokker is an example.

Social Navigation. Options such as forums, comments, tags, profiles, and other elements allow people to more easily find each other and engage others online.

Navigation Ideas

As you design your navigation keep the following ideas in mind:

Control. Give users control over their navigation. Provide tools so visitors can decide where they'd like to go.

Consistent. Keep the navigation consistent throughout the website so people will know where to look.

Status. Be sure to let make users aware of their current status. A good navigation system gives the visitor a clue as to what page they are currently on. On option is to simply unlink the text link so it isn't underlined or in the link color. You can also fade an icon or unlink it as well.

Suggestions. Provide help and suggestions so users know their options and what they might do next.

Match Theme. After planning out your site, use your overall impression to decide if your site navigation should be casual and friendly, technical and serious, businesslike or goofy. Find a visual theme that represents the overall content and carry that throughout the site.

Logic. Using simple text and graphical icons that represent different section or simple buttons with word labels is easy and obvious for the end user.

Compact. Keep the primary navigation system in a compact package, at the top of the page, the bottom, or off to the side. If the page is long, put the navigation system at the top and bottom. Use both graphical buttons and text links for those who don't or can't display graphics. It's always a good idea to have more than one way to navigate.

Access. Every section of the website should be available within 3 clicks.