By developing a visual outline of your site, you will be saving yourself a lot of time. It's much easier to erase a few boxes and lines than it is to delete and rebuild pages in a Website that is already under construction. By getting your concept down on paper beforehand, it will save you many hours of work in the building phase.

Paper is just as Good as a Computer.

Once your site's goal is defined, start sketching out the structure of your site. You need a medium that is quick and flexible and lets you be creative.

Drawing sketches with a pencil and paper is one way to do it. Another way is to use index cards pinned to a wall. You write up an index card for each Web page, note what will the content on each card, and then arrange all the cards in some kind of hierarchy or sequence.

If you have an easy to use computer diagramming tool that will draw boxes for pages and lines for hyperlinks, then this will work fine. You don't need to spend a lot of time trying to make "great artistic" and "technically accurate" drawings. Just a rough layout is all you need. Something that will help you visualize what your site will look like. You're not going to publish these drawings in a book.

When making a site Layout, there are four key elements:

A Map of the pages.
The Connections between the pages.
Developing a Common page layout.
The Content of the pages.

How To Layout Your Site:

1, The Map
In sketching your layout, the first thing you need to do is Draw a Map of your site.

A Simple Site Layout Drawing using paper. You will definitely have a Home Page, and probably a Contact Us Page and About Us or What We Do Page. You might also have Q&A, Products, Glossary, Guest Book and/or More Information pages. If you are creating a personal or family Website, then you might have a Photo Album, Talents, Recent Events, Kids, Pets, Vacations, or Interests pages. All you need is a simple box to denote each page.

2. The Connections
The second task is to Connect the boxes (pages) with lines (hyperlinks) to show how you will be able to move from one page to another. Some pages might only be accessible from one or a couple of pages, while other pages, like the Home page, might have links to a majority of the pages.

3. A Common Page Layout
Next, you need to Decide on a Common Page Layout.
Pencil and paper will again come in handy because it will be easy to compare different layout sketches side by side.

A common Page Layout is helpful for three reasons:

You won't have to design multiple layouts for multiple pages, which would take a lot more time.
Different layouts on different pages can be confusing to your visitors, not to mention annoying.
Having consistency on your site will give it a much more professional look.

Some of things you'll want to consider as you work on your page layout:

How do you want to navigate through the site? Will you use buttons or text? Where will they be on the page, will they be placed horizontally along the top or stacked vertically on the side (preferably the left side)?
Will you have a common Header or Footer that will be present on each page?
What Fonts you will use for Headings and Body text?
What will be your Color Scheme?
Do you have any company requirements, logos, or mottos that need to be included in the site?
Do you need to specify any Legal Requirements such as a Copyright notice, Terms and Conditions, Disclaimer, Privacy Statement or Guarantee?

Also be thinking about the structure you will use to arrange everything. Will you use tables to define your page layout, thereby placing elements inside table cells. This layout method helps maintain the relative position of your page elements when the site is viewed using different browsers.

NOTE: Not all Web Browsers will display your site the way you designed it. Check out your Web pages with different browsers and this might require you to go back and make some changes based on the results you see.

A Handy Tool to convert MSN Favorites to IE7 Favorites:

Here's the location of a tool that you can use to convert your MSN Favorites list to a format that can be imported into your IE7 (Internet Explorer) Browser. I used it to transfer my MSN 9 Favorites to IE7 (Beta 3) and it worked just fine.

4. The Content
Finally, once you've defined your layout, you need to develop your Content. The content includes four items:
Text (the wording) you will have on each page, any Hyperlinks to other pages or other sites, Interactive Buttons, and Graphics (photos, drawings and clip art)

I'd recommend developing your Text in a simple word processor. High end word processors like WordPerfect or MS Word will add special characters to your text that can cause you layout headaches later on when you insert the text into your web page.

Use a simple word processor like Window's WordPad. If you save your text as a "Text Document" (.txt type), WordPad will not add these special control characters. When you type out your text in WordPad, don't add special formatting like bold and underline because when you save it as .txt, all of this formatting will be removed.

The control characters used for things like Bold, Italic, Underline and Paragraph Formatting in a word processor are not the same as the HTML tags that are used in a web page to format text, so if you format your text before you insert it into your web page, there's no telling what it will end up looking like. Even if you use an "Export or Convert to HTML" function, it's likely that the conversion will not be seamless and you'll still probably have to clean things up.

Once your text is worded pretty much the way you want it, then cut and paste it from WordPad into your web page and then do your formatting.

If you write out your text on paper, then you can format it as you type it into your web page or do the formatting after you've entered all of your text.
For Hyperlinks, just write down the text you will be using on your layout and then make a note of where that hyperlink will take you.
For Interactive Buttons, just draw a circle, square or some shape to note where the button will be, jot down any text that will be inside the button, and then note what the button will do.
And finally, for your Graphics on your sketches, all you need to show is a box with a few words of explanation as to what it is. You can develop and acquire your graphics as you are doing your actual site construction.

Content - Content - Content

Use a simple word processor to develiop your web site text. Don't worry about your content being exactly the way you want it before you start to build your site. Most Websites are constantly being updated, so trying to nail down every minute detail for every page in advance will be very difficult.

Just get your content close. Then go ahead and start building your site and add in your content as you go. You can be flexible in order to be creative.

More likely than not, you will end up adding many new pages as you progress because, if you are like me, new ideas and new topics that you want to include will "come to you" every time you work on your site And remember, the search engines like new content. This will help your search rankings.

If your reason in setting up a website is strictly to try and make money on the internet, and you don't want to write your own content, but would rather hire someone to do it for you, there are places where you can have this done.

Check out my topic on Buying Content to see what your options are.

OK, Let's get started on that Website Design!

Click the Tutorial Next button one more time for the Course Completion.