USF Student laughing while working on laptop

Navigation Options

Main navigation (top-level links)

There are two basic options for main navigation on the new USF site. The choice of an option for each individual school, college, or office site should be made on the basis of what is most appropriate for that site's content.

Vertical Navigation

1. Vertical, grouped navigation on left side

Most of USF's school and college sites use this navigation method (sample right). In this navigation type, the top level links of a site are grouped into general descriptive categories (which are not links themselves).

Pro:

  • This is a more usable and easily scanned way of presenting site navigation; general categories allow users to quickly find what they're looking for, without having to navigate dropdown menus. It has been called the "warm and fuzzy" navigation type because of the ease of use it offers.
  • This is the closest in nature and effect to the way navigation is organized on the USF homepage. Sites with vertical grouped navigation will express a closer family resemblance to the USF homepage.

Con:

  • This navigation layout requires more reorganization of a site's existing content than some of the other navigation types; for this reason, it's only explicitly recommended for schools and administrative units that have undergone a content review as part of the Web redesign process.
  • Dropdown menus cannot be used with this navigation approach.
  • Sites with more than 16-18 main links should not use this navigation style. These sites should use horizontal navigations with dropdowns to make these lists more manageable for users.

 

2. Horizontal navigation with dropdown menus

This navigation type (sample below) is used by some schools and administrative offices; in most cases, those that had similar dropdown menu-based navigations in the previous USF site. The method is a conventional dropdown system: links are grouped as in the previous type, but with a much larger number of total links divided into more categories. Users navigate these menus by mousing over the categories to view the list of links.

Horizontal Navigation

Pro:

  • Dropdown menus make it easy to manage sites with a large number of links, and let website users link directly to the content they're looking for.
  • In many cases, sites that used the horizontal navigation on the previous USF site can migrate directly to the new system with minimal change to their information architecture.
  • This type of site navigation can be especially appropriate for sites directed at internal audiences, who need quick access to particular information and don't need to be directed on a path through the site, or exposed to key messaging. (For example: an office that indexes a large number of policies and procedures might prefer this navigation type.)

Con:

  • If users are able to immediately access a large number of pages with one click from anywhere, it's harder to control the site's messaging. So sites driven by persistent messaging and marketing communications may find this layout challenging to their goals.
  • Dropdown navigation by its nature takes time to get used to; audiences have to explore various menus to find the content they're looking for. For this reason, it's important that the navigation headers be carefully chosen to minimize confusion.

 

Vertical Non-Grouped Left Navigation

3. "Office" navigation left side, vertical, non-grouped.

This navigation method (sample right), which is intended for administrative offices only, requires the least amount of change to existing navigation.

In the course of the migration of USF's site from its previous CMS to its new one, there may not be the opportunity to review and reorganize each site's navigation. So this version of the site navigation is available as a fallback.

Pro:

  • This navigation type imposes very few, if any, limitations on the types of page lists that can be presented.

Con:

  • It is the least "stylish" of the site navigation options — though a perfectly reasonable option for sites where its use is appropriate.
  • Dropdown menus cannot be used with this navigation type.

 

Inside page navigation (sub-page, second- and third-tier links)

Inside page navigation (sample left) will always appear in the right margin of the site design.

There should be no more than two levels of subnavigation on inside pages of the USF site. If a site is supporting more than two levels of navigation, its content may need to be reorganized or it may actually be more appropriately considered an office (and thus deserving of its own top navigation). However, in cases where three tiers of navigation is unavoidable, a treatment may be provided after consultation with Web Services staff.

 

Special inside navigation for academic departments

Academic departments have their own unique navigation treatment (sample right), used in conjunction with a lead photo. This treatment unifies USF's academic departments while allowing wide variation among individual sites. Like other interior page navigation, it is always positioned on the right; as prospective students and other visitors navigate among various departments and Web sites while exploring USF, they have to know where to look for navigation (or rather, how to navigate without looking).

This treatment is identical in behavior to the other inside page navigations; it simply has a background-color scheme which compliments its lead photo.

Next page: Color options »