Web Site Maintainability

By Vince Barnes

As you design and write your website, you become very familiar with the structure you use, the layout of the various pages and the manner in which you tied them all together. Time goes by; you add a little more here, a little more there and sooner or later your site has grown into something huge. The trouble is, after a while your memory of those early details fades; you forget what this was for, what that should be linked to, why these are here instead of there. Now, when you make a small change, you run the risk of all sorts of things falling apart! You have entered the "Website Maintenance Nightmare"! Please don't let this happen to you!

There are three golden rules to help avoid the nightmare, related to consistency, structure and annotation.

First, be consistent! If you use one method and style throughout your site, you will have only one method and style to remember (or to relearn!) This does not mean that everything has to look the same. It means that you should apply consistent styles and use a consistent method throughout. For example, instead of applying font styles to each piece of text on your pages, you would be more certain of consistency by applying a style sheet to all your pages and keeping your styles in it. If you don't know how to do that and are just starting out, don't worry for now - just remember it's something you're going to want to do. If you need to find out more right now, check out the tutorial at http://www.htmlgoodies.com/beyond/css.html

Another example is the use of frames. If you decide to use frames, use the same frame structure throughout. It's not wise to use a frames page here and tables there, accomplishing a similar layout. Choose one, and use it throughout. Again, if you are new to site design, just hang on to this thought. When you have gone through the tutorials, you will have encountered both frames and tables. A little experience will give you a feel for the virtues of each and you'll be able to make your choice. The trick here is to stick with a consistent method. This of course, does not mean that you should not use both frames and tables. It means you should not use both to accomplish the same thing. For example, don't create a table on one page to hold a menu on the left side of your page (like the one on the Goodies site) and hold it in a frame on another page. As you develop pages, you will know when you are encountering something similar to something you have already done. When you do, do it the same way (or, if you have found a better way, change every instance to the new way!)

The structure of a site is usually determined by the nature of its content. The trick here is to create a folder (directory) structure that matches the content structure. For example if you are creating a photo album and have different page sets for each year, keep the sets in folders named for each year. Remember to use consistent names such as /1999/family and /2000/family and you will be able to match your site navigation to your folder structure. It is also a good idea to ensure that you don't crowd out a directory. Keeping certain files separated helps. For example, if you use Server Side Includes to help with consistency (a very good idea - see http://www.htmlgoodies.com/beyond/ssi.html) keep all your "include" files in a folder named ssi - be sure to include the path in references to them! I also like to keep images in a folder of their own, along with the pages that reference them. For example, the folder /John contains pages about John, and the folder /John/Pics contains the images used in those pages. Jane's pages and pictures would be in /Jane and /Jane/Pics. (Note also that UNIX/Linux systems are case sensitive - they see Jane and jane as different things; Windows systems are not (by default) case sensitive - they see Jane and jane as the same.)

Annotation is simply the use of comments. Don't get caught in the trap of thinking that comments only explain your methods to strangers for them to copy. The "stranger" who will learn from the comments is most likely going to be you, a little while after you wrote the comments, when you have forgotten why and how you accomplished something but now need to change it. Trust me, you will thank yourself for leaving yourself notes! This holds especially true for programming in such languages as JavaScript, PHP and Perl. Things have a tendency to wind up with names that seem brilliantly enlightening when written, and virtually meaningless a few of months later!

If some of these notions don't make much sense to you at this point, don't be concerned. Try to keep the concepts in mind though, consistency, structure and annotation -- you will be your own best friend if you do!

Having read all of this series through to this point, you have completed the Non Technical Introduction and are now ready to start coding!  We hope that you now feel more comfortable with the notion of developing a web site and that the concepts are no longer alien to you.  The next step is to start on our Primers.  You'll find them in the contents index links on the left of our web site pages.

I wish you the best of luck and hope that you enjoy your website development experiences and find it to be a satisfying venture.


Go to
The Non-Technical Intro


Return to HTML Goodies Home Page


Sign up for our free newsletter and more

on the left side of this page!


Make a Comment

Loading Comments...

  • Web Development Newsletter Signup

    Invalid email
    You have successfuly registered to our newsletter.
Thanks for your registration, follow us on our social networks to keep up-to-date