XHTML Syntax Rules

These guidelines will help you write Web pages that conform to the XHTML 1.0 transitional document type definition and that are compatible with current browsers.

Documents must be well formed

All elements must be nested within the <html> root element. Sub elements must be in pairs and correctly nested within their parent element.

Root element namespace

The root element of the document must designate the XHTML namespace using the xmlns attribute. The namespace for XHTML is defined to be http://www.w3.org/1999/xhtml.

For example:

<html xmlns="http://www.w3.org/1999/xhtml">

 

Mandatory tags in all XHTML pages

These tags must be defined in all pages:

<html><head><title></title></head><body></body></html>

 

Title element must be first element in header

This is wrong:

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="pragma" content="no-cache" />

<title>Handle Banner Request</title>

</head>

 

This is correct:

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<title>Handle Banner Request</title>

<meta http-equiv="pragma" content="no-cache" />

</head>

 

All XHTML elements should be in lower case

For example:

<table> not <TABLE>.

All attributes should also be in lower case

For example:

<table width="544" border="0" cellpadding="0" cellspacing="0">

 

All attributes must have values contained by single or double quotation marks

This is wrong:

<table width=544 border=0 cellpadding=0 cellspacing=0>

 

This is correct:

<table width="544" border="0" cellpadding="0" cellspacing="0">

 

When possible, avoid multiple spaces or line breaks within an element's tags

Subject to line length constraints the W3C makes this recommendation because different user agents may treat white space and line breaks differently.

For example:

Do not write this:

<tablewidth="544"

 border="0"

cellpadding="0"

cellspacing="0">

 

Write it like this:

<table width="544" border="0" cellpadding="0" cellspacing="0">

 

All nonempty elements must have a closing tag

For example:

<p> ... </p>

 

Empty elements must also be closed (with syntax for HTML compatibility)

Leave a blank space before the self-closing '/' in empty element tags.

For example:

<img src="logo.gif" alt="Logo" border="0" width="189" height="23" />

<br />

 

Elements must be nested correctly

For example:

<p><b>This is correct</b></p>

<p><b>This is not correct</p></b>

 

Attribute minimization is forbidden

This is wrong:

<dl compact>

<input checked />

<input readonly />

<input disabled />

<option selected />

<frame noresize />

 

This is correct:

<dl compact="compact">

<input checked="checked" />

<input readonly="readonly" />

<input disabled="disabled" />

<option selected="selected" />

<frame noresize="noresize" />

 

The id Attribute replaces the Name Attribute

HTML 4.01 defines a name attribute for the elements a, applet, frame, iframe, img, and map. In XHTML the name attribute is no longer used and the attribute id is used instead.

To preserve compatibility with HTML browsers, use both attributes as in the following example:

<img src="home.gif" alt="Return to home" border="0" id="home" name="home" />

 

Replace ampersands in attribute values with character entity

This is wrong:

<input type="button" value="Bob & Alice" />

This is correct:

<input type="button" value="Bob &amp; Alice" />

<img /> tag must have the alt="" attribute

This is really an HTML 4.0 requirement. Because XHTML 1.0 is based on HTML 4.0, this is required.

This is wrong:

<img src="btn_next.gif" height="20" width="100" border="0" />

 

This is correct:

<img src="btn_next.gif" alt="Next" height="20" width="100" border="0" />

 

Handle special characters in JavaScript

Special characters like < and & in scripts may be treated as start of markup by XML parsers. Also entities such as &amp; and &lt; will be recognized as entity references. To avoid this, the W3C specification suggests that you wrap the content of the script within a CDATA marked section so that it can be ignored by the XML parser.

Example according to the W3C:

<head>

<title>Script Test</title>

<script type="text/javascript" language="javascript">

<![CDATA[

function HomePage(){parent.location="/home/index.html";}

]]>

</script>

</head>

<body onload="HomePage()"></body>

 

However, when sent as HTML, the Java Script parsers in current browsers do not understand the CDATA keyword and may cause a syntax error. The solution is to comment out the CDATA keywords as a Java Script comment:

<head>

<title>Script Test</title>

<script type="text/javascript" language="javascript">

//<![CDATA[

function HomePage(){parent.location="/home/index.html";}

//]]>

</script>

</head>

<body onload="HomePage()"></body>

 

This should be used instead of the technique to comment out the scripts for browsers that do not support JavaScript using <!-- and //-->.

Summary: To comment out lines to the HTML parser <!-- --> is used. To write comments inside <script></script>, the // is used so it will be ignored by the JavaScript parser. To make the CDATA section invisible to the JavaScript parser, but visible to the XML parser, you use // <![CDATA[ and //]]>.

Location of scripts

Scripts must be located either between the <header></header> or between the <body></body> tags.