May 9, 2008, 10:52 pm

Website Design

XHTML Syntax

At the beginning of the source for this web page I have written this:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">

Why is this required?

The short answer is validation. W3C have set the standards for XHTML. After a year of applying a transitional form of XHTML, I have migrated to a strict version. To ensure that this web page conforms to the standards set by W3C, a parser (included as part of an XML-enabled browser) uses a DTD (Document Type Definition) held on a W3C server. A DTD specifies XML syntax, the rules for the language. Any failure to correctly adhere to these constraints will mean that the page cannot be classed as XHTML. A failure to validate, results from markup that is not "well formed".

Basic rules

W3C provide a full listing of required syntax, but here are few tips based on my experience of writing XHTML.

Most tags should be closed, so if you write a <p> tag, you must match it with a closing tag </p>
There are some exceptions to the above, e.g. empty elements, such as those used for insertion of images or line breaks. These are written differently to HTML. They must be terminated correctly and must be written like this:
<img src="../images/header_design.gif" width="597" height="75" alt="John McSweeney - Website design" />
<br />
<hr />
<link rel="stylesheet" type="text/css" href="../css/simple.css" />
Note, there is a space just prior to the /> characters.
Alternative text must be supplied to an image using the alt attribute
<img src="../images/header_design.gif" width="597" height="75" alt="John McSweeney - Website design" />
You cannot mix upper and lowercase in your tags
<p><P> is invalid, tags must be in lowercase <p><p>
All attribute values must be placed in double quotes ""
This would be invalid syntax, <div id=rightcontent>
as is <div id="rightcontent>
you must write <div id="rightcontent">
Declaring JavaScript requires a type attribute and"text/javascript" value in the <script> tag. Also the language attribute is no longer valid for XHTML strict. One cannot write
<script language="JavaScript" type="text/javascript">
One must now write
<script type="text/javascript">

</script>
All elements must be correctly nested
<li><code>//--></li><code> is incorrectly nested
<li><code>//--></code></li> is correctly nested

Validation

You can validate any of your pages by going to http://validator.w3.org/ where you will be presented with a choice of either supplying a URI or choosing a file residing on your computer.

Tutorial

For an XHTML tutorial go here.

An article on XHTML by Jeffrey Zeldman can be found here.

Next page » Design Software

Previous page « Introduction to XHTML