Skip to a section in this page: The main navigation, the secondary navigation, or the main content.


In The Deep

One of the challenges we face at kor group when designing sites for large institutions such as colleges, is reducing the amount of navigational levels.

The ideal scenario is to reduce the overall depth of the site as much as possible. By reducing a site to 3 or 4 levels, it creates a more user-friendly experience. However there are times that organizational structure or the sheer amount of information that must be housed requires a deep site. As with everything in web design, there are are numerous solutions to this challenge. In our research of this subject, we came across the brilliant posts by Brad Frost, Luke Wroblewski and Paul Boag. Of particular interest are the options shown that move away from traditional nav-bars or drop-down menus. Here are three of the most interesting:

Breadcrumbs Only
In this approach the user navigates the site using in-body links instead of a traditional navigation bar. The site breadcrumbs help the user identify their location and go back through their pathway. As Paul Boag points out, the much celebrated is a great example of this solution. The con of this solution is that is does not allow the user to jump branches of the navigation tree.

In these sites, the intention is for the user to utilize the search feature to guide them to the specific content they seek. Not to be confused with a no-nav approach, the search-first site may still have some basic navigation but it’s primary mode is the search tool. This technique can be seen a lot in e-commerce sites and uses a behavior users are familiar with in their use of Google and similar sites.

Micro Sites
Breaking a large site in to a group of smaller micro-sites is a great solution as is reduces the number of levels that would be required if all information was housed in a single mega-site. This solution is best suited to an institution or entity that has some very distinct buckets of information. An often cited example is and the sub-sites used for the different products (news, sport, TV, etc.). In addition to helping solve the deep navigation challenge, it also allows for slight variances in the UI between micro sites. For example, a college may want to adjust the visual theme slightly for it’s graduate programs verses the undergraduate offering.

Leave the first comment

Add your two cents