Quackit Logo
Google
     web developers reference      
  Home > XHTML > XHTML Tutorial
Home

 

 

 

XHTML Tutorial

This XHTML tutorial will show you how to code your pages using XHTML. If you already know HTML, this XHTML tutorial should be an absolute breeze!

There are only a handful of differences between HTML and XHTML. Fortunately, they are all minor, which makes it much easier to convert your website from HTML to XHTML. Just, don't forget to declare the document.

Here are the main things to remember when writing XHTML:

  • Must have a DOCTYPE declaration
  • All XHTML tags are lower case
  • Close all tags (even empty elements)
  • Attribute values must be quoted
  • Minimization is forbidden
  • The id attribute replaces the name attribute
  • The script element must have a type definition
  • Documents must conform to XML rules

Must have a DOCTYPE declaration

All XHTML documents must have a DOCTYPE declaration. The document must include the usual html, head, title, and body elements.

Example:

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

All XHTML tags are lower case

Wrong

<A HREF="xhtml/xhtml_tutorial.html">
XHTML Tutorial</A>

Right

<a href="xhtml/xhtml_tutorial.html"> XHTML Tutorial</a>

Close all tags (even empty elements)

Wrong

<img src="pix/xhtml_tutorial.gif">

Right

<img src="pix/xhtml_tutorial.gif" />
(Note that the XHTML specification does not require a space before the "/" but this is required to conform with current browsers).

Attribute values must be quoted

Wrong

<img src="pix/xhtml_tutorial.gif" width=250 height=50 border=0 />

Right

<img src="pix/xhtml_tutorial.gif" width="250" height="50" border="0" />

Minimization is forbidden

Wrong

<option selected>

Right

<option selected="selected">

The id attribute replaces the name attribute

Wrong

<img src="pix/xhtml_tutorial.gif" name="xhtml_tutorial">

Right

<img src="pix/xhtml_tutorial.gif" id="xhtml_tutorial">

The script element must have a type definition

Wrong

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

document.write("XHTML Tutorial from <b>HELL!</b>");

</script>

Right

<script>

<![CDATA[ document.write("XHTML Tutorial from <b>HELL!</b>"); ]]>

</script>

Documents must conform to XML rules

No improper nesting etc

Wrong

<b><i> This text is bold and italic</b> </i>

Right

<b><i> This text is bold and italic</i></b>

XHTML books you might like:

Printer friendly version

About Quackit | Terms of use | Contact Quackit

© Copyright 2000 - 2003 Quackit.com