Web Site Navigation and Design

It seems that one of the hardest things to get right in web design is creating proper layout and navigation. Sometimes a web site will be very rich in content, except that traffic will suffer due to poor navigational structure. In other words, navigation has become one of the key ingredients in developing sustainable, long-term traffic to your site.

Your site tree:

Often before you even get into the graphical aspects of your site, it is useful to think about the content that you will have for your site and brainstorm possible navigational schemes, otherwise known as site trees. These trees describe the way in which your site branches out into articles, products and services, and any other additional sections you may have. You would be surprised how different tree layouts can be created, but not all are created equal.

As an example, let's say that you have a site that has the following pages:  

• Home page
• About us
• Products
• Services
• Contact
• Clients
• News

Generally speaking, the root of your website will be your home page or index page which serves as the main landing destination of your visitors. From here, they should be able to easily reach many parts of your site, often within 2 clicks or less, and be able to return to your home page with ease. Depending on the size and nature of your site, you may need to create 'deep' links, (3 or more clicks away from your homepage), but they should only be used for very specific information. As an example, there is no reason why the 7 pages listed above shouldn't be accessible from your home page, as they are very broad categories.

Content Layout

What is essential in laying out your content is that from every portion of your site your visitors should know where they are (through the use of titles and graphics), where they can go (using navigational and contextual links), and how they can get back (either to previous pages or back to the home page).

Once you have developed your site tree it's time to think about where to place your links. There two most popular are header links and sidebar links. Many sites use a combination of these two. Others use only header links.

Drop down menus can also provide readers an easy way to get to a number of different pages in one click. This is particularly useful when you have a variety of content, as it saves people from 'drilling down' through multiple pages to get to a variety of content. This also helps you avoid the problem of deep links, pages which are three or more clicks from your home page.

One of the best ways to provide a way back to the home page is to place your company logo in the top-left left corner of every page in your site, and have it link to your home page. Not only is the logo a well-known way of getting back to the index page of a website, but it also allows you to consistently brand your identity throughout your site. It's important to remind your readers that the pages and content were created by you!

For top and sidebar navigation links, try to stick to common names that people are used to. You will have the opportunity to get into more detailed subjects within your content, but it is often better to provide your readers with easily recognizable buttons and names which they are able to intuitively understand.

Anchor links can also be a useful way to contextually link to other pages in your site. If you have a paragraph that alludes to another product or service, you can simply anchor link some text in that paragraph like this. While this is a common way to link to other sites of interest, it's also a great way to link to other pages within your site. These shouldn't really replace your header or sidebar links, but serve as a supplemental means of navigation.

Adding a good site map will place the finishing touch on your site. Site maps are a summary of the entire layout of your site, and often use text links to allow your reader to get to any part of your site. Readers who are searching for something specific in your site will sometimes refer to site maps.

Graphics

Eye-catching graphics, when combined with a strong layout and structure will ensure that your visitors stay a while. It is also one of the ways you can separate yourself from the competition, as there are many websites out there with very standard layouts and just a few short paragraphs.

Do not underestimate unique photo stills when designing your website. When integrated properly, they can be one of the most effective ways of personalizing a web design. Photos and graphics are sure to add visual eye-candy to your information and content.

And of course, a well-designed logo is a must! It should be one of the first things your reader sees when entering your site. It can also be useful to have your logo integrated into a banner-style graphic and add it to your header for a more integrated feel.

When it comes to graphics however, you should be careful that you don't overdue things. Bandwidth intensive video may turn away some of your potential visitors due to slow loading times etc. Because of this, you are often better to go with simple flash animations that will spice up your website without placing unnecessary demands on your readers' computers and connections.