The Many Faces of a Navigation Diagram

Aside from whatever method is used to reach an understanding about a site’s navigation, there are many ways to present the final result. I’ll review the ones I’ve been able to work with in the past.

Horizontal site map

A simple site map is a regular hierarchical representation of a website’s navigation with no symbols apart from straight horizontal lines connecting each page in the diagram. This model works better for sites with many categories and a short level of depth.

Vertical site map

Another way of presenting a normal site map diagram is in a vertical presentation, which works better for sites that have greater depth.

Three-dimensional diagrams

This type of diagram isn’t really one that will bring added value to the project. It can be considered, though, for executive presentations in order to sell an idea.

One way to do this is using the Dynamic Diagrams model, which I tried out for my thesis once.

Application maps

Hagan Rivers was the one to show me the way to use application maps for presenting a website’s navigation. It is a lot more practical than using site maps since it takes advantage of the available space, and its symbology is very straight forward.

Garrett’s visual vocabulary

An interesting and complex approach to information architecture visual vocabulary is presented by Jesse James Garrett. It may be taking it one step ahead to talk about information architecture, but it is a very complete way of explaining all of the content involved in any website.

What method of diagramming are you using today?