Webmaster's tutorial: Analyzing website Organizing website Developing website Implementing website Maintaning website
Welcome to the Web - Rocketface(R) Workshop Webmaster's Tutorial - "How to Design a Website" Rocketface(R) Home - Welcome to the WebHow to Design a Website - Webmaster's Tutorial StartRocketface(R) Webmaster's Workshop
Rocketface®Workshop Webmaster's Tutorial Index Webmasters Article Archive Sitemap Privacy About
Rocketface®: Webmater's Workshop
  • How to Design a Website
  • About Domain Names
  • About Web Hosts
  • Free Web Hosts
  • Private Web Hosts
  • Types of Websites
  • Building a Website
  • Analyze Website
  • Analyze Audience
  • Analyze Content
  • Website Design Tips
  • Website Journal
  • Effective Communication
  • Target Audience
  • Demographics
  • Website Goals
  • Organize Website
  • Website Basic Layout
  • Webpage Design
  • Website Navigation
  • Website Structure
  • Website Sections
  • Website Theme
  • Webpage Layout
  • Website Content
  • HTML Editors
  • White Space
  • Develop Website
  • Sitemap Construction
  • Webpage Construction
  • Website Assembly
  • Website Construction
  • Typography - Fonts
  • Typography - Style
  • Typography - Layout
  • Website Graphics
  • Website Templates
  • Implement Website
  • FTP Website
  • Fine Tuning Website
  • Upload Organization
  • Ftp Checklist
  • User Interaction
  • Maintain Website
  • Website Promotion
  • Marketing Website
  • Viral Marketing
  • Content
  • Product Sales
  • Affiliate Programs
  • OnLine Services
  • Optimize Website
  • Keywords
  • The SEO Process
  • Website Traffic Analysis
  • Increasing Website Traffic
  • Links Tracking
  • Link Baiting
  • ROR RSS Sitemap Generator
  • Summary
  • Resources
  • Types of websites
  • Hex codes
  • Toolbox for webmasters
  • Free template downloads
  • Optimize your website
  • Resources
  • Glossary
  • Newsletter
  • Feedback
  • Main Site Index
  • Article Archive


  • Something a little different
    XtraAstrology - Exploring the arcane
    moonGROW - Moon phase gardening





    Website Navigation
    The basic principles and practices of website navigation design

    Design your website navigation for your target audience

    Website navagation for your visitorsWe've discussed who you have decided your target audience will be. Now, ask yourself what kind of information will they will be looking for and what questions will they will be asking. In order to develop a strong navagation scheme you will need to know these things.

    Once our visitors intrests are understood we need to help them find the information and the answers, that they are seeking, by the shortest route possible. This means organizing your website navagation in such a way that this information is only two clicks away. Header, navbar and footer links should be directly linked to main content areas of your site (i.e. one click). The main content areas of your website should then link directly to the information that your visitor is seeking (i.e. second click).


    Avoid having too many links

    Have you ever visited a website where you keep clicking on links, hoping you are going to find that information you're looking for, only to be led to more pages of links. It gets frustrating and visitors often leave without finding what they were looking for. That is not good for you or your visitor.

    Your navigation scheme should reflect your website structure

    The answer is to have a clean, simple website structure and navigation scheme that is as clear and obvious as possible. You should always make it clear for your visitors how they can get between topics easily and always provide a means for them to go back from where they started. Make an outline of your website and go from there.

    See: How to Develop a Website Outline

    The three main website navigation models

    There are many schools of thought on the best website navigational design. I don't believe there is any one ''best'' design; Your navigation model depends on your website and its content and is often a combination of two or more designs. We will examine three different website navigation methods and see how they work. They are; linear navigation, database navigation and hierarchical navigation. See below.

    Linear Navigation

    Linear Website Navigation

    Linear Navigation: Moving in a straight line through a website

    Database Navigation

    Database Navigation

    Database Navigation: Moving in and out of website content areas

    Hierarchical Navigation

    Hierarchical Navigation

    Hierarchical Navigation: Moving up, down and around a website

    As I said earlier, many websites are a combination of navigational models and you will have to determine which method works best for your webpages. It is important to have a clear idea of your navigational system before you organize your website. Help your visitors find the information they need with the least number of clicks. This will also serve you in creating your website structure.

    Note: you don't want to put a direct link to everything on your website on any single page. Your website links should progress through several levels branching out as they go. Too many links to choose from and your visitors often won't know what to click on.

    Use your sitemap for a secondary navigation source

    Your sitemap is an excellent navigation tool. The good thing about a sitemap is that it provides your visitor with direct access to anything on the website. But, in order for your sitemap to function as a navigational tool it is necessary for your visitors to be able to access it easily. Provide a link to your sitemap on every page on your website. The sitemap should be your secondary means of navigation, not the primary one.

    See: A Beginners Guide to Making a Sitemap

    Designing your website navigation bar (navbar)

    There are no certain rules about how and where to put your navigation bar. Many webmasters put it along the left side of their webpages. Some put it on the top. Occasionally a website will put it on the right side, forcing the visitor to look in that direction. Whatever works best for your website and its contents should be your approach to placing your navigation bar.

    When deciding on the placement of your nav bar you should consider the effect it will have on the space you will have available for your content. Navigation bars can take up a lot of space that could otherwise be used for content. This is why it is advisable to use links only to your main topics and branch out from them on following pages.

    See: Professional Webpage Layout

    Design your navigation links around a theme

    Every website should have some type of theme - a way of giving your site an identifying look.This can be through the use of a unique logo, a particular color combination or a recognizable idea such as gardening or pets.

    Your theme should be considered when designing your navigation scheme. For a professional look it is imperative that you blend your navagation components into the layout of your webpages. Develop a theme and work it into the way that you display your navigation links. (i.e. icons,bullets,colors,etc.)

    It's also important to note that you should always include a text-only copy of your navigation links, as some people surf with images turned off or even with text-only browsers. Page headers and footers are a logical place to include your text-only links.

    See: Website Navigation and Theme

    Website Navigation and Layout

    Sitemaps and SEO
    For those who don't devote too much time on the SEO of their site - this is a good place to start. By submittíng a sitemap to various search engines, you are telling them that you exist and what pages your site has to offer the World Wide Web.
    How to Make Easy Website Navigation
    Navigation is how visitors get around your site. If your navigation is unclear then your visitors will get frustrated and go away.
    Navigational Options for Your Website
    There are many types of navigation methods to choose from. You must carefully consider the layout of your site so you can choose the system that will work best.
    Web Site Navigation Best Practices
    A great user experience will bring visitors back. Navigation is a key element in the user experience.
    Developing a Theme for your Website
    Every website should have some type of theme or a way of giving your site an identifying look. When visitors come to your website they should be presented with an experience that they will remember.
    Website Navigation and Theme
    Have you ever visited a website where you keep clicking on links, hoping you are going to find that information you're looking for, only to be led to more pages of links.
    Tips for Improving Website Navigation
    In order for visitors to find the right information, a website's navigation path needs to be clear.
    Professional Webpage Layout
    The layout of your webpages says a lot about you and your message. Good webpage layout is the key to a successful website.
    Web Site Design Layout - Five Common Elements
    Your web site design layout largely depends on the type of website you're building. A sales page, for example, has different requirements than a landing page, and a landing page has different requirements than a niche web page.
    Web Page Design Ideas - How to Use Graphics Creatively
    Keep your web site design simple, and never lose sight of what you want your visitors to do when they arrive.
    Website Design - 3 Pointers For Color You Must Consider
    The correct use of color in your website design is paramount to ensure your site is not plain and uninteresting or on the other spectrum too busy, glaring and difficult to look at for a period of time.
    Creating a Basic Web Design Template
    A "template" is simply a design format which you can apply to all (or most) of the pages in your web site.
    Website Optimization - Optimizing your websiteMarketing Website - Marketing your websiteWebsite Managment - Managing your websiteWebsite Design - Designing your websiteRocketface(R) Webmaster's Article Archives


    Back Next



    Copyright© 1999 - 2010
    Rocketface® Graphics
    Rocketface® Workshop Analyze Organize Develop Implement Maintain Site Map Index