Extreme HTML Optimization

XHTML

XHTML, the marriage of HTML with XML, requires a more strict approach than HTML does. In XHTML, documents must be "well-formed." This is a new concept introduced by XML. Essentially this means that all elements must either have closing tags, or be written in a special form. Also, all elements must nest properly.

Element Nesting

Do this:

<p>This is an emphasized <em>paragraph.</em></p>

Not this:

<p>This is an emphasized <em>paragraph.</p></em> 

Closing tags are not optional in XHTML and can quirk up CSS on some browsers.

Empty Elements

Empty elements like <br> and <hr> must either have an end tag or end with />. For example:

<br /> or <hr></hr>

Note the extra space after the br. This is not required, but allows older browsers to properly parse these new self-closing XHTML tags.

Attributes Must be Quoted and Complete

All attributes must be quoted and complete. XHTML does not support attribute minimization, so instead of "checked" XHTML requires "checked='checked'".

Lower Case

As XHTML is case-sensitive, all tags and attributes must be lower case.

Even with these restrictions most of these tips can be used with XHTML. It is up to you how far you go. Note also that newer browsers like Netscape 6 require clean, properly nested HTML to function properly with dynamically-written external JavaScripts. See JavaScripting Netscape 6: No More Sloppy Code for details. Now, with those caveats out of the way, let's do some EHO.