You are on page 1of 1

What are the types of Website Navigation?

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.

1. 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.

2. VERTICAL SIDEBAR NAVIGATION 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.

3. 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.

4. 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.

5. HAMBURGER NAVIGATION MENU The hamburger menu is most often seen in mobile web design. With this style, the
navigation items are often listed horizontally on larger screen sizes and collapse behind a hamburger button on smaller
screen sizes. When visitors click on this three-line icon, a vertical drop-down or horizontal pop-out appears with the
navigation links. This type of design is ideal for mobile apps or sites where real estate is limited.

6. FOOTER NAVIGATION MENU A footer menu is typically paired with — and expands upon — a horizontal navigation
bar. If a visitor doesn’t find the nav link they’re looking for in the header, they can scroll down to the bottom of the page
for more options.

You might also like