XHTML tips

Some information that might help you understand XHTML and use it in your next web project.

Some information that might help you understand XHTML and use it in your next web project.

Why use XHTML?

  • XHTML works in any browser that supports HTML4 so there should be no issues with backwards-compatibility.
  • XML parsing software exists in many forms. Since XHTML documents are valid XML documents, writing software to do things such as transforming them to other formats, making changes to many documents at once, etc. should be easier.
  • XML is increasingly being looked at as a better alternative to HTML for devices other than your normal web browsers. By putting in the small effort required to use XHTML now, your site should be accessible by more devices as they start appearing. Also, the fact that your documents are valid XML will make it easier to convert them to other XML formats dynamically depending on what type of device is attempting to access your site.

XHTML Implementation Hints

Convinced that you should be using XHTML? Well, if your current web pages validate as good HTML then moving to XHTML should be a breeze. HTMLTidy may be able to convert all of your documents for you without any problems. If you’re starting from scratch or would like to know what’s involved in going from HTML4 to XHTML, this list of hints may help.

  • First of all, you need to declare that this is an XHTML document at the top of the page. To be honest with you, I’d just recommend copying/pasting the first 2 lines of this page’s XHTML source. If you don’t have the declaration at the top of you documents, you won’t get very far in your new goal to have the W3C Validator certify your document as “valid XHTML”.
  • Everything in your tags must be lowercase. Use lowercase in your CSS too.
  • All tags must be closed. For example, instead of just using the <li> tag at the start of a list item, you must also put a closing </li> at the end. In cases where there’s nothing to put between the opening and closing tag (like the <br> tag for a linebreak), you’ll open and close it in the same tag like so: <br /> (putting a space before the slash ensures that older browsers will still use the tag)
  • A rule of XML is that you can’t have incorrectly nested tags. In other words, <p><b>word</p></b> is wrong and should be written like this instead: <p><b>word</b></p>
  • Attribute values have to be quoted. This <table cellspacing=3> doesn’t work anymore. The 3 needs quotes around it. You should’ve been doing this anyway.
  • Any attributes in a tag have to have a corresponding value, so <option selected> needs to be written like this <option selected=”selected”>
  • In tags where you would have a name=”something” attribute, try to put a corresponding id=”something” attribute in there as well.
  • Use a separate file for your stylesheets. Don’t put the CSS in your HTML or XHTML files. It’s just better that way, trust me.
  • When you have an ampersand (&) in a URL, it should be written as & It doesn’t look right but all browsers understand it. In fact, this has been in the URL specification for a long time.
  • The <script> tag is a little different. Instead of putting language=”javascript” in the script tag, you should be putting type=”text/javascript”. The value is a mime type now because the language= thing was too inconsistent between different browsers. Also, an XHTML or XML validator might complain about some of the characters that you have in your javascript so when you need to put javascript in your pages (which hopefully isn’t too often), you should probably just do it the way I do. To see the code I use, check out this blog post with my javascript template
  • Look at the source of any page on rahji.com or any other site that uses XHTML if you want to see how to do something. Look at other people’s stylesheets for help, too.