Creating The Flow Chart Storyboard your site map

Why?  Because of the nature of their design, web sites don't lend themselves to traditional, linear outlines.  Instead, create a simple site map with a flow chart. Your topmost box will be your splash page.  Identify the major areas of your site.  Identify the areas subordinate to each main area. Be careful to keep similar areas parallel in the flow chart.  Use the flow chart to get a sense of the framework of your site and the relative importance of the various elements of your site.

What is it?  A flow chart, or storyboard, is an illustration of the relationships among the various individual files (i.e., web pages) that constitute your site. The storyboard will be a picture of the levels of your site.  You might want to base your storyboard on your sentence outline.  You might want to start with a blank sheet of paper and Post-It notes: write the titles of topics and subtopics on the Post-It notes and experiment with their arrangement on the blank sheet.  You can use the organization chart software that comes with Microsoft Word to create a storyboard.  High-end web page editing software can also help you create your storyboard.

A Simple Storyboard Site Map  For this site you are likely to want a home page with links to the major sections of your site.

Moving On  As you develop the individual pages in each area of your site, you will add boxes subordinate to each of the boxes listing the main areas of your site  Use the flow chart to keep track of your navigational structure.  Each page should also link back to its parent page.  Each child page should also link back to its parent and its aunts and uncles.  In addition, all pages should contain your address file (i.e., an address to contact you as author of the site and a Last Update date) and a link to your home page.  Remember that your storyboard structure must reflect the structure of your web site and your web site should take advantage of the nonlinear structure of the web itself.

Incorrect Storyboard  Sometimes, however, an early storyboard will project a linear view of the web site, a view that implies that the visitor will be directed to view your files in a particular order.  Here is a storyboard that implies that a site section is to be viewed in a linear fashion:

Correct Storyboard  But in a typical well-designed web site, a section of the site has a cover page. From that cover page, the site visitor can access any of the other pages related to that subject.  Here is what such a storyboard would look like:

Check for Understanding