Website Construction

The website construction phase is the phase during which the bulk of your work is done assuming your website is fairly large. Hopefully the steps you have taken earlier in the process will keep you from needing to make any major changes to your web site from this point on.

Complete Prototype

To start this website construction phase you will want to build a minimum working prototype. Do not add all features unless they are required for a prototype or they should be reviewed by others before going final. Any unique features should be added at this time. For example, if your website posts tutorials, add one or two tutorials so viewers will get the idea how the website will work, but do not create all pages unless it is necessary.

If you are using what you see is what you get tools, like Microsoft FrontPage you may not have much technical control at this point. If you are using FrontPage, you must still set proper META tags. If you are writing your own HTML pages, you will want to be sure and do the following correctly the first time:

Use the correct DTD declaration for your documents. Doing this can prevent validation and web crawlers from searching your site. As of this writing, if using XHTML (recommended), it should be:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN">
As of this writing, if using HTML 4.01, it should be one of the following:
- <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> - For use in normal documents.
- <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN"> - For use in documents that have frames defined in them.
- <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"> - For use in documents that adhere strictly to the standard.
Most of the time you should use the transitional DTD declaration for HTML. Be sure to use the proper case as shown above in the declaration. I believe the "DOCTYPE HTML PUBLIC" may be in upper or lower case but be sure it validates early during the construction process if you change case.
Use Cascading Style Sheets (CSS) to control your text colors, fonts, and other colors on your pages. This will enable you to make changes more easily in the future. One style sheet can control things like header colors and fonts, various special text classes, and much more on all your pages or on all or several pages in one directory. This will also have the advantage of keeping your website with a more uniform look and feel.
Set your meta descriptors and title properly when you create the page as follows:
- Description - This discription is normally used by search engines to help categorize your content and may be used to describe your page to users so it is very important. Normally I make the description and title the same. I normally make the description the name of the document followed by a dash and the title of the current page as follows:
  <meta name="description" content="The CTDP Web Site Creation Guide - Construction">
- Keywords - These words are used to help crawlers match your content to the subject. These key words should show up in your page content. Keywords seperated by commas are separate keywords. Keywords separated by spaces show up as one word. If someone wants to search on "web site construction" this page is likely to show up (except it is in a frame). An example for this page is:
  <meta name="keywords" content="web site creation, web site construction">
- The title should be appropriate for your content, and I use the same title and description as follows:
  <title>The CTDP Web Site Creation Guide - Construction</title>
Use XHTML Standards to save upgrading later. The following rules apply:
- The XHTML document must be well formed. - All elements must be ended and nested properly including the HR tag which should appear as:
  <hr />
- Tags must be in lower case letters.
- Values of attributes must be in quotes.
- Attributes may not be minimized.
- A DTD Declaration with head and body elements must be present in the document. The DTD can be Strict, Transitional, or Frameset (for Frames).
- The name attribute is replaced by the id attribute.

See the CTDP HTML Guide for more information about CSS, XHTML, and document type definitions.

Get More Opinions

With the basic working prototype completed, it is best to get more opinions about the site functionality, look, and feel. This way, if more changes are required, only the skeletal prototype will be reworked. This is the last time external opinions about the websight are sought prior to submitting applications for web site awards.

Make Adjustments and Complete Site Functionality

Make any required adjustments to make the site pleasing to users, then add all material and functionality to the site. Once done, check every page to be sure it works properly. This should be done with more than one web browser.

Additional Construction to Aid Promotion

Create a map file for your site that has links to every important page that you may want search engines to search. The purpose of this page is to allow search engines to crawl all important pages on your site since many only crawl one layer deep.
Possibly create pages that contain search phrases to help people find your site. Some people call these pages a "doors" page or "gateway" page to your site. This page would be a descriptive page about your site or a site section.

These types of pages should be well integrated into your site and if not done correctly may cause your site to be penalized by search engines. I have abandoned the idea of a specific gateway page on my site but choose to determine key phrases that relate to the site, then integrate those phrases into appropriate documentation or site section pages.

Whether you use a gateway page or integrate key phrases into pages on your site, the page should contain the favorite search phrases several times on your page. The phrase or keyword should be up to about 2% of the words on your page. If you make the keyword or phrase appear too many times, you may get penalized by search engines. I recommend your page title and a header contains the key phrase. The key phrase should also be included in your keywords meta tag. Construction steps:
1. Select search phrases that are appropriate to the site or section you are going to create a doors page for. You should try to do some research on the internet to determine the popularity of the search phrase or search word. It may be necessary to pay a subscription to some sites that sell key word search information. The search information may not only include single words, but include word combinations such as "networking documentation" or "how to build a web site".
2. Determine how many times to user the phrase on your page. Use the phrase on the page two to about thirteen times depending on the content and size of the page. Remember to not exceed too high of a percentage of the overall words on the page so your site is not penalized. One way to get good example pages for the type of page you should build is to search the internet using your key phrase or word and look at the pages that are ranked the highest. Determine how many times the phrase or word appeared, whether the phrase is in the page title and how many headers contain the phrase.
3. Use your keyword or phrase in the page title, and a header near the top of the page. If the phrase is used in the page HTML META title or main header or near the top of the page, it will count more to the search engine. Place the keyword combination in your meta tag such as:
  <meta name="keywords" content="web site creation, web site construction, how to build a web site, promtion, web promotion">
  Keep characters in lower case. Remember however that some search engines may penalize your site if your keyword density is too high.
4. Determine content of the page that will get as many keywords used as possible and create it. Use somewhat repetitious language but don't overdue it enough to make it annoying. For example if you are writing a tutorial about widgets and you know "widget tutorial" is a popular search phrase, name your introduction page "Widget Tutorial". Make your main header contain that phrase. As you are describing what will be in your tutorial, say things like "this widget tutorial will describe" rather than saying "this document will describe".

Website Creation Tutorial Contents Page