Roll up those sleeves again; it's time to get cracking. You're going to sketch out just what your Web site will look like. Use pen and paper or any computer drawing tool (including your word processor). The goal here is to plot out your site in a diagram format. A site diagram shows everything your site is going to have, along with the relationships between objects.

At this point, your site diagram serves as the blueprint for your site. After you've finished your initial construction, your site diagram can serve as a tool for visualizing or modifying your site. It can even be repurposed to give your visitors a bird's-eye view of your content and to provide an alternate method for them to navigate your site.

The first thing you put on your site diagram is the homepage. Your homepage is the entry point to the whole site. If your site diagram uses the inverted tree model, such as a family tree, the homepage should be at the top of the page. Draw a large box for your homepage, and give it a label ("homepage" works, but you can also give it the same name as your site). From the homepage, a visitor should be able to logically navigate to any page on the site.

It takes some practice to think of Web sites as inverted trees, and you may make some mistakes. This is where either an eraser or Web site diagramming software that allows you to move pages around comes in handy. See the sidebar, "Need a Site Diagramming Tool?" for more information about where to find such software. Also, many of the software programs available for designing Web sites, such as Microsoft FrontPage, feature a built-in site-diagramming tool. Visit the Web Style Guide Creating site diagrams Web page for information about and illustrations of site diagrams.

One of the benefits of using a tool such as FrontPage is that the program creates the pages for you as you diagram the site. All that's left for you to do is to fill them with content.

Even with all of the software available to help you create your site diagram, sometimes it helps to use a pencil and paper at this stage. The important part is to have a plan for how the various types of content on your site will link together.

Don't worry if you don't know yet how to create the code to execute your ideas. In this lesson, we're learning how to use the concept of the site diagram to plan out your site.

What's Next?

So, now you've written your Web site's mission statement, you've created a list of content, gathered your content, and diagrammed your site. Pretty good for one lesson. Lesson 2 shows you how to use the various Web designer tools to make that content shine.

Before moving on, please complete the brief lesson quiz and assignment. Now is also a good time to visit the course Message Board and discuss your site diagram with your classmates and the instructor.