Untangling Spaghetti HTML

Untangling Spaghetti HTML
=========================
by Sunil Tanna, EBookCompiler.com

When I was first learning to write computer programs, one of the
most important points that was drummed into me was that it's
never a good idea to write great chunks of computer code that are
repetitions of earlier code. The reason is simple: when it comes
time to update the code, you'll have a tough time making the same
change in each copy, and you'll have an even tougher time making
sure that each changed copy has been modified in the same way.

Why this digression into programming lore? If you create web
sites , there is a good chance that, at least most of the time,
you don't think of your HTML files as "computer code". You
probably think of them as content, documents, my writing...
etc. But the truth is they are. You need only open an HTML file
in a plain text editor, and you can see the HTML language.

So the question is, can the same spaghetti problem arise with
HTML code? If you've been a webmaster for a while, you probably
already know the answer... absolutely. The typical web site
contains lot of repeated elements.

For example, you may have the same heading or footer on each
page. You might have a search box or banner code on each page.
You might have the same menu down the side.

Updating all these multiple copies of the same HTML code in
different files quickly gets tiresome. Even if you haven't
encountered the update-problem yet, as your projects grow larger
and larger, you soon will.

HOW TO AVOID SPAGHETTI?

One answer is the various "include" mechanism that HTML
technologies provide:

1. Server Side Includes (SSI)

This technology is implemented on many web sites, and basically
allows you to include a common fragment of HTML code (stored in
a separate file) into as many HTML pages as you want. The
advantage is that instead of updating each file individually, you
only need update the common fragment once.

Here's how:

* On most web servers, you simply rename your HTML files (the
ones that are doing the including) with a .shtml extension.

* Where you want to include the common fragment of code use a
line like:

[!--#include file="fragment.html" --]

IMPORTANT: Because some email programs don't display greater-than
and less-than signs properly, I've used square brackets, but when
you copy this line make sure to change the brackets to
greater-than and less-than signs. If you prefer to see the code
online, (and displayed correctly), go to:
http://www.suniltanna.com/spaghetti.html

2. ASP Includes

For NT web servers, in .asp pages, you can the exact same include syntax
as for SSI.

3. PHP Includes

If your web site supports PHP (a script language that runs on the
server), another way to achieve the same thing is to use the PHP
include command.

Here's how:

* Rename your HTML files (the ones that are doing the including)
with a .php extension.

* Where you want to include the common fragment of code use a
line like:

[?php include 'fragment.php' ; ?]

IMPORTANT: Again the same point about the brackets applies.
If you prefer to see the code online, (and displayed correctly),
go to: http://www.suniltanna.com/spaghetti.html

NO THROUGH ROAD HITHER?

Right, so this all sounds fantastic, problem solved?

Not so fast... While these are powerful techniques they also have
drawbacks and limitations:

1. Most web design programs don't know anything about these types
of includes. This means you have to work in a text editor on
the raw HTML code, manually chopping up your files into
fragments, and inserting the include commands into the HTML
code. Worse yet, once you've done it, it's quite possible your
web design program won't allow you to make any further
changes.

2. For the web server based technologies (SSI, ASP, PHP), firstly
not every web site supports these facilities, and secondly,
they do put extra processing load on your web server. For most
small sites, the extra load is not going to make a difference,
but if you have a very busy site, it could be the straw that
broke the camel's back.

3. Even if you can live with the first two problems, there's
still some major issues: Includes can help resolve the
spaghetti problem on new projects, but what about projects
you've already completed and want to update? What about if
you plan on using Includes, but didn't realize at the start
that something was a common fragment? What about if the
fragment of code you want to replace was something that's too
small to bother including every time (like a font name, or a
single-word spelling-mistake, or an affiliate link)?

So, at best, Includes can help, but they are far from a panacea.

AN ALTERNATE APPROACH...

If I finished the article at this point, you'd probably think I
had merely told you (or reminded you!) about a nagging problem,
but left you with no solution.

Fortunately there is one, and it's a good one. At the beginning
of this piece, I reminded you that HTML files are really text
files containing HTML computer code. This means you can use
text-editing tools to manipulate individual files, or better yet,
all your files in one go.

A good Find and Replace program will update all your files easily
and very quickly. Better yet, you don't need to be a programmer,
and you don't need to understand the intricacies of the HTML
language - it's easy enough for anyone. Another advantage is that
unlike editing files manually, there is no possibility of it
making a mistake on page number 342 of 427.

While there are many Find and Replace programs on the market,
it's best to get one that is specifically designed for HTML
files. For this reason, I'd recommend Alias Find and Replace,
which you can get from:
http://www.aliassoftware.com/

This is a nice Windows-based program with a lot of powerful
features, but is also easy to use. There's even a free trial
download, so you can try out the program at no risk.

Once you've got the program, you can use it to make global
changes across all (or a selection of) your HTML files, stick
with plain HTML (and never worry about the spaghetti issue
again!), or use it as a stepping stone towards the Include
method.

A FINAL THOUGHT

What many people don't realize when they first create a web
site, is that as much or more work can go into updating it,
as in writing in the first place.

Updating can be particularly painful (and time consuming) if you
don't plan ahead, and you do everything manually. So plan ahead,
use the techniques and tools I've shown you in this article, and
you'll be surprised how much easier the update process can be.

-----------------------------------------------------------------
Copyright, S. Tanna, webmaster and publisher of EBookCompiler.com
Create your own E-Books that you can give away free to drive
massive traffic to your web site, or sell for profit. Download a
FREE copy of the software today at: http://www.ebookcompiler.com/