Item 46. Tidy Up Your HTML | Effective XML: 50 Specific Ways to Improve Your XML

Converting HTML to XHTML often exposes and corrects bugs in web pages that you didn't realize were there, especially if you didn't test each page in several dozen browsers. It also makes it much easier to write software to search or modify the pages. And it makes it much easier to write software that processes the pages. For example, I converted my Cafe au Lait and Cafe con Leche web sites to XHTML solely so I could use a simple XSLT stylesheet to generate RSS feeds. The alternative to moving the pages to XHTML would have been installing a complicated, database- backed content management system that completely changed my workflow.

There are three steps to converting HTML to XHTML.

Add the appropriate document type declaration.
Validate the resulting document.
Fix any bugs the validation uncovers.

In practice, this is an iterative process that normally requires several repetitions before you finally produce valid XHTML. However, the process is worth it. I find that this almost always produces better pages and better results in web browsers.

There are three document type declarations you can use, shown below.

 <!DOCTYPE html      PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"      "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <!DOCTYPE html      PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"      "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <!DOCTYPE html      PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN"      "http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">

The first DTD is appropriate for pages that do not use frames or deprecated markup. The second, transitional DTD, should be used if the page contains lots of deprecated presentational markup like font and center tags. The third, frameset DTD, should be chosen if the page uses frames. You may want to point to a local copy of the DTD instead of the main one on the W3C web server.

Besides adding the DTD, there are a number of changes you're likely to have to make when converting a web page from regular HTML to XHTML.

Add a default namespace declaration xmlns="http://www.w3.org/1999/xhtml" on the root element.
Add end tags to typically unclosed elements such as p and li .
Rewrite empty elements such as br and hr with empty-element tags.
Convert all tag and attribute names to lower case.
Put quotes around all attribute values.
Move inline elements such as strong and code from outside to inside block-level elements such as div , p , and h1 .