G UIDELINES O F W EB D ESIGN   
Ten Stages in the Life of a Web Site

B Y  A N T J E   H A R T M A N N 

The following list contains some useful steps in the implementation of a Web Site. Depending on circumstances, these stages may not follow in sequential order, but overlap and iterate in the spiral fashion common to modern software development. This list does not claim to be complete or new, but rather represents an accumulation of different guidelines, findings, and my personal experience in implementing Web pages. Above all, have fun - a good Web site is meant to be fun for you and your audience!

What is the Content? Specify what information you want to provide, why, and for whom. Who is your audience and why are they interested in your information? Keep the content short and relevant - don't 'babble'.
What is the Structure? Divide your content into individual pages and specify a structure that can be extended for future additions. It may help to start with a hierarchical structure and later add cross-references. Try to keep each page short - this is not a printed article and people don't like to scroll. If there is a good reason to keep a page long, add a substructure of anchors to jump to individual sections and back to the top.
Prototype! Before turning to the computer, 'paint' your pages with pen and paper. Put each page on a separate sheet of paper and consider the flow of navigation between them. Make sure the pages and their navigation make sense and are easy to use for your audience. If possible, ask others to look at them and try it out.
Define a Template. Define a common 'look and feel' for all your pages and create a template. In particular, you want to provide standard navigation facilities and feedback about the current location within your site structure. Remember that visitors may not enter your site through your main page. Include a 'logo' of your site in the same, prominent position on each page, as well as information when the page has last been updated. Provide an easy feedback facility for your readers.

For example, a commonly used template is to keep the logo in the top left corner of each page, a navigation bar along the left side, and feedback concerning the current location on the top. If your site is very large, you might want to identify sub-sites and provide separate templates for them.
Design your Pages. When defining the design of your pages, remember the 'KISS'-rule ("Keep It Simple Stupid").
  • Include pictures, animations, specified fonts and colors only where necessary and relevant. Make sure they enhance the understanding and readability of your pages rather than obtruding it.
  • Keep the file size of all pages small so they are quick to download. (There are a number of good guidelines on how to minimize images and animations, see links below.)
  • Provide alternative text for all images.
  • Don't use Java Applets unless necessary and provide an explanation for non-Java-capable browsers. The same holds for scripting languages such as VB Script or Java Script.
  • Avoid using frames, if you can, or else provide an alternative for text-only browsers. A lot of the functionality of frames can be achieved with other means. For example, include the navigation bar in your template instead of a separate frame.
  • Remember that the Web is not "WYSIWYG" ("What You See Is What You Get") and your pages may look different on different systems.
Where will your Pages Live? Specify an implementation structure for all parts of your site. Create sub-directories and access files with their relative location or through an alias (for example, always use "../images/picture.gif" or "/alias/picture.gif" instead of "c:/myweb/images/picture.gif"). Use meaningful names for your directories and files. Depending on the information you provide, your audience, and the facilities of your Web server, you might want to create pages dynamically from a database (using tools such as ColdFusion), using server APIs (ISAPI, NSAPI), or with the help of CGI scripts.
Implement your Pages. You can use graphical HTML generation tools, or a plain text editor to implement your pages. However, if you use a graphical tool, make sure you are sufficiently familiar with the HTML standard to verify the code produced by the tool. You can also use additional tools to automatically verify your HTML (see links below). If your editor supports this, create a template page and use it to specify the individual pages so that any change to the template will automatically be reflected in all pages. If you do not have this functionality, create a template page first and copy it to create each individual page. Don't forget to update changes to the template in all pages.
Test your Pages! Once you have implemented the pages, test, test, test! Make sure the site is visible and navigable in all browsers and resolutions your audience might use. (Try it by actually looking at them!) Test how long your pages need to download, not through your network but over the Internet! Have others navigate through your site and observe them carefully. Heed any problems or comments they may have! Verify each and every link to make sure they are correct.
Upload the Pages. Upload your pages and all required files with the correct directory structure to your Web server (for example, using an FTP link to your provider). After uploading, go through all the pages on the Web server and make sure all links still work correctly. Provide external links and information to your site through the use of search engines, directory services, and so forth.
Update your Site! The Web is a dynamic medium and as such should provide dynamic information. To keep visitors interested in your site, you need to regularly update its content. Provide an easy facility for visitors to recognize what has been updated or added (for example, use "new" icons). You need to ensure that all pages and links still work, particularly links to external sites. If you move your pages, provide a redirection facility for external links to them. If possible, provide an archive of older information that might still be relevant to some visitors.
Additional Resources