5 Types of Website Navigation to Consider

Navigation is a key element of any website—it’s how the user gets from section to section, and to specific content. Most website navigation nowadays follows a handful of specific formats that, because they're familiar, won't leave your site visitors confused about how to access your content.

Horizontal Text

Horizontal text-based navigation is probably the most common style found online. This type of navigation consists of a horizontal list of the sections of the site, generally named in one or two words each. It can either be created with graphics or straight HTML text, both of which can have rollovers for a bit of user interaction.

Sub-Menus

In some cases, you may want to present the user with the depth of information, even without a drop-down menu. Having a sub-menu below main navigation titles takes up more room, and is less conventional, though it does allow visitors to clearly see what is available and get where they want.

You'll often see this style confined to the bottom of the page, where the real-estate requirements for the menu aren't as significant. In fact, many companies, including Microsoft, pair a horizontal text menu at the very top and a sub-menu system at the very bottom of certain consumer-facing webpages.

Vertical Text

Vertical text navigation is also quite common and is often used for sites requiring a longer list of button bar items, expandable navigation, or for titles of longer length. Vertical navigation is most commonly found along the left side of the webpage, though right side navigation can be effective if designed properly or if for secondary navigation. Vertical navigation is often used for a second button bar, such as for sub-sections of a major section found in a horizontal bar at the top of the page.

Drop-Down Menus

Drop-down menus are often used along with horizontal navigation, and allow the user to jump not just to the main sections of the site, but also to many of the key sub-sections. Sites with a lot of content can certainly benefit from drop-downs, as they eliminate a click to your content.

Icons or Graphics

Integrating icons or other graphics into your navigation can create an intuitive interface. The user will associate the icons with the content they represent, creating an even clearer approach to a button bar. A set of navigation icons should be created in a consistent style with each other and the site as a whole, as they should improve the site design rather than create a distraction. It should also be clear what they represent. Adding icons just to make a design look better may not serve the best interests of the site.