Building Dynamic Web Sites:Part I

From EDM2
Jump to: navigation, search
Building Dynamic Web Sites
Part: I II III IV V

By Chris Wenham

Problem number one with modern graphical web page editors is that they are disgustingly immature. Front Page, Page Mill, Homepage Publisher and others are good for static pages created by novices, but offer the same benefits and advantages to professional builders that a pair of boxing gloves would offer to a watchmaker. Editing HTML by hand is not the same as building graphics pixel by pixel, because HTML is a High Level Language - it's supposed to be easy to learn and edit "raw".

In the middle ground, somewhere between efficiency and instant gratification, somewhere between speed and flexibility, and somewhere between static and dynamic, is the hybrid method; prototyping in your favorite HTML editor - whatever that may be - and enhancing its usefulness later with the help of an HTML Preprocessor to create a dynamic web site that can be changed automatically or semiautomatically to incorporate new content on a regular schedule. In this series of articles I'll explain how to use one such HTML Preprocessor in OS/2, with real-word examples of how it was used at a major OS/2 web site.

The idea behind a preprocessor is this: During the authoring of a web page you add shortcut macros into the code, such as "<$Title>" for the tag that defines your site's title image -- which may appear on every page. In another file you've defined what "<$Title>" and other shortcuts mean, using complete "<img src=...>" tags with all the widths and heights and sources and alternate texts you need. Later, before you put the page online, you run the source page through the preprocessor - which generates a finished web page ready to go on the web server.

You can also tell it to include other separate HTML files, such as common headers and footers, navigation bars, news clippings and more. These are also processed, so you can put shortcuts and include even more files in them too - building up as elaborately as you like.

The end result is a template based system that gives you maximum flexibility and power.

It gives you the power to change everything on your site with lightning speed, making it dynamic and interesting to your visitors. For whenever you need to update the site's look with new graphics: you just edit one file where you have defined all your shortcuts and tell the preprocessor to regenerate your site. No more search and replace, and no more hours of click and drag trying to replace all the images, one by one in a WYSIWYG editor.

The next clear advantage to this approach, of course, is the ability to build a template of your main page and have the preprocessor "pump in" news headlines and other updates by including other files into the finished page. If you have a news ticker program that can save the latest headlines, wrapped in a hyperlink to a text file, then you can include it. The same goes for a recent files listing, newest links, a "Tip of the Day", etc.

If this is starting to remind you of a particular OS/2 site you may have visited before, it's no coincidence. The OS/2 Supersite was built exactly this way, and this series of articles is going to teach you how to do the same thing for your site. It won't matter if you run the server yourself or rent space from someone else (like your ISP). You can run a dynamic site over a temporary dialup connection if you need to.

We'll start you off by introducing you to the particular HTML Preprocessor we're going to use. This one is written in Rexx by Dennis Bareis and is remarkably simple to use. It's free, and you can download it from his home page using the link at the bottom of this article.

To generate a finished web page you simply type HTMLPP source.it on the command line, and wait for it to pop "source.html" into the same directory. Alternately you could name the output file and directory more explicitly by typing HTMLPP source.it /OUTPUT:pages\index.html.

Other preprocessors in use today are the "Server-side includes", usually recognized by the "SHTML" extension in the URL. These are processed by the server a split second before the page is sent to you, allowing it to include up-to-the-second news. They're popular for interactive pages that allow visitors to record their comments at the bottom of an article. You can see an example of this at Slashdot.org.

On a more advanced level are database driven sites, which store all their content in a database such as DB2 or Oracle, injecting stories and content into template files as they get called by the visitor. Usually these setups will have a caching system too - to keep popular pages around for a while in finished form and reduce the computing load. News.Com is a classic example of this technique in action. You can usually detect these systems at work by the even more complex URLs that point to them, such as this example:

 http://www.news.com/Rumors/0,29,,00.html?st.ne.rum.idx.gif.a

At the moment, database driven sites like these are just a wee bit out of my league, so I won't be covering them in this series. Once I get a handle on them, expect me to write about it here.

That does it for the introduction. In the next issue of OS/2 e-Zine! I'll walk you through our first example and show you how to effortlessly maintain two different versions of your web page (A Netscape enhanced one with plenty of goodies, and a plain version for WebEx and Lynx surfers) without going mad.

HTML Preprocessor version 98.125
by Dennis Bareis
download from Dennis Bareis's home page (ZIP, 85K)
Registration: Freeware