3

When thinking about setting up a website using WordPress and the CMS an important point to consider is how you want visitors to find their way around the site’s content. When setting up a writing a blog the navigation part is usually quite simple: You have your posts in chronological order on the home/main page and set up a couple of other pages for static content. Blog navigation tends to use categories and/or tags to find the content the reader wants. Internal links are also popular in blogs to get readers to access more of the content.

The first item of business is to think of what content is going to be on your site and how you want it organized. One of the easiest and most basic tools for website navigation is a site map. Grab a blank piece of paper and draw a site map of how your new site will be organized. If your site map looks like a tree with many branches, your site needs a ‘hierarchical’ navigation structure. If your site map ends up with groups of content your navigation will be ‘global’.

Hierarchical navigation allows your readers to drill down into the website to find the information they need. Navigation aids should allow them to go from page to page further into more detailed information. A bread-crumb trail would be nice so they can go back some levels and take another branch.

With global navigation your site visitors will be looking for a destination of content. It is like leaving town. There are towns in several directions but the visitor is only interested in travelling to one and will navigate in that direction.

After you get an idea how your content lays out, visit some websites that are in the same business or category as your new site. Take a close look on how their navigation scheme works. Take some notes on ideas you like and the things that confuse or annoy you. These notes will help you set up better navigation for your own site.

There are several ways to add navigation to your website. We have already discussed two:

  1. Site map. I have found myself using the site map of several websites recently to find the content I was really interested in.
  2. Bread-crumb trail. This form of nav only works if your visitor starts at the home page then drills down for content. It can be helpful if your site has type of organization.
  3. Side bar menu. The most common in website design, especially on the left as we read left to right. Care must be taken to not get the sidebar too wide.
  4. Top menu. Works if you do not have too many menu items. With pull-down options makes site navigation pretty quick. The top menu is also a good place for the Home, Contact and Site Map links even if you have a more involved side bar menu.
  5. Imbedded links. Do not forget this old blogging standby. Imbedded links help you spread large amounts of related content over several pages or too give your visitors quick access to additional information.

I have a couple of final notes. If you are setting up a do-it-yourself WordPress website (i.e. not a designer or programmer) take a close look at how the themes you are interested in handle navigation. I once had too discard several themes I really liked because the top bar menu would not hold the names of all the links I wanted. Also, we offer a nifty CMS Navigation plugin that will allow you have easily have bread-crumb, pull down and side bar menus with related content.

3 Responses to “Website Navigation Design”

    • SitePress plugin doesn’t support drop-down menus with depth greater than one. The reason is, this creates a serious usability issues. Site admins usually are the only ones capable of using such elaborate drop down navigation. Most other users don’t find it so easy to use drop-down menus and then scroll-out menus.

      When your site navigation becomes complex enough, this is when the sidebar should kick in. The sidebar navigation created by SitePress will add all the secondary navigation details showing visitors what’s available below the primary pages.

  1. Hey, the plugin is great. I am using it right now, but it lacks some feature I really need : mix pages and categories.

    For example, have a breadcrumb like this : Home > Page > Sub-Page1 > Category > Post
    And then the navigation sidebar would be :

    Page
    – Sub-page1
    — Category
    — SubSubpage
    – Sub-page2
    — SubSubpage
    — SubSubpage

    Do you think it is possible ?