Ms P's WebSite Design - Step 3: Navigation

WebSiteDesign
Homepage

Tutorial:
1-Identity
2-Users
3-Navigation
4-Layout
5-Content
6-Graphics

ExtraFeatures
Top 10 Tips

Create a user-friendly navigation scheme

     A well-planned website provides quick and easy access to information pages--that's navigation. Plan navigation before pages are created. Your website may start small, but imagine the complexity when you have webpages for information, webpages for instruction, student project webpages, and webpages for various programs, activities, and organizations. Establish a navigation plan now to ensure that viewers quickly get what they need, and that you can quickly insert new pages of content.

     A homepage need have only five or six links -- ten links on a homepage is the most we can expect people to comprehend at a time, so grouping information is essential. Provide efficient travel through your website--the real test of navigation is what happens below the homepage. [NOTE: There are exceptions, like websites devoted to news, topical information, or outside links. These "technical" sites can provide more links since their users want to scan the full range of available information to find a specific piece. The BroncoNET homepage is set up that way.]

  1. Define groups of pages as determined by user needs (Step 2) and create a site map of these initial group pages. Use MS FrontPage or even MS Word to create a simple outline, then, use it, change it, add to it as ideas are generated for new pages. (You can save the outline as HTML so a site map page is ready for linking and publishing.)
     
  2. Choose a template for the homepage based on the hierarchy of subpages.
    For a homepage with many links (6-10), but few links (1-5) off 2nd-level pages:
    Use a unique homepage and a unique template for each group of subpages. Each sub-level template has a distinctive identity and icon carried through to all its group sublevel pages (for example, school business pages use school mascot, student pages use pencils, events pages have yellow stars, clubs have notepads, parent pages use apples).

    For a homepage with few links (1-6) but numerous support pages (6+) within each 2nd-level group:
    Use a unique homepage, a unique template for all 2nd-level navigation pages, and then two or three different 3rd-level templates. All 3rd-level subpages under a particular 2nd-level page are the same template, but 3rd-level groups are different. A good example of this option is CFB's Mary Grimes Education Center website.

    Whichever option is used, have subpage templates use similar layout, so viewers maintain a sense of place on the website.
     
  3. Provide links back to higher-level pages in addition to the homepage link. Don't expect viewers to return to the homepage and then re-click through the same intermediate pages. They won't; they will leave your website. Consider a header or footer in the same place on every page showing a chain of navigation: Homepage-->2nd level-->3rd level-->this page, with each one a link. Big sites like Microsoft do this, since linking back to intermediate pages in a chain is essential for good Web navigation. Even if everything else is entirely different, the header or footer provides consistent identity and ease of navigation.
     
  4. Enhance navigability by consistently using specific icons for each homepage link -- teacher homepage, school homepage, or district homepage. In addition to a school homepage link, teacher pages should also have a link back to the particular school page that their own page is linked from. 

     Integration is especially challenging as a school or district site becomes larger. Coordinating department pages, school pages, and teacher pages with district pages calls for use of headers, footers and icons to make our navigation schemes apparent and easy to use.

     Once navigation is established and links are created on your templates, addition of content will go very quickly. The time taken to plan navigation cannot be overemphasized. The greatest frustration of website management is spending time redoing pages of a poorly planned website. Viewers don't tolerate frustration--they simply leave your site and do not return.

WebDesign
Resources

Copyright-free images and links to Image sites
AnimatedIcons
AnimatedPics
AnimatedText
Backgrnd-Border
Background-Dark
Background-Lite
Books/Library
C-FB Logos
ClipArt-Medsize
Curriculum
Dots,etc
HorizLines
Icons

More ImageSites

Back to Ms P's page

Link toBroncoNETHomepage

© B Paciotti, 2005