Jessett.com home  

html

html tag library
html editors
hex colors
forms
xhtml

home > html > xhtml

xhtml

xhtml version 1.0 combines html with xml. This will eventually help enable the standards required for creating web pages that work on a variety of platforms, from the usual browsers to mobile phones.

xhtml improves html by using the rigidity of an xml application. The result is cleaner mark up, which is both easier for you to maintain and quicker for the browser to process. xhtml uses the same tags as html, and is viewable by current browsers.

xhtml is the next stage in the development of the Internet. By changing to xhtml , you can enter the xml world, while maintaining backward and future compatibility.

There are a few guidelines to follow to change your existing html documents to xhtml.

change your existing html documents to xhtml

  1. Documents must be well formed (i.e. correct)
  2. All opening tags must have a closing tag
  3. All tags must be written in lower case
  4. Tags that don't have a closing tag in html must have a closing forward slash
  5. All attribute values must be quoted

documents must be well formed (i.e. correct)

  1. It must validate against one of the three DTDs
  2. The root of the document must be <html>
  3. The root of the document must state the xhtml namespace:

    <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" Lang="en">

  4. There must be a DOCTYPE declaration in the document prior to the root element. The public identifier included in the DOCTYPE declaration must reference one of the three DTDs:
  5. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "DTD/xhtml1-strict.dtd">

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "DTD/xhtml1-transitional.dtd">

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" "DTD/xhtml1-frameset.dtd">

  6. Tags must nest correctly and not overlap.

    <p>normal text <i>italicized text</i> normal text</p>

not:

<p>normal text <i>italicized text</p></i>

back to top

all opening tags must have a closing tag

<p>text goes here</p>
<p>text goes here</p>

not:

<p>text goes here
<p>text goes here

back to top

all tags and attribute names must be written in lower case

<h1>text goes here</h1>
<form>...</form>

not:

<H1>text goes here</H1>
<FORM>...</FORM>

back to top

tags that don't have a closing tag in html must have a closing forward slash

<img src="/graphics/image.gif" />
<br />

not:

<img src="/graphics/image.gif">
<Br>

back to top

all attribute values must be quoted

<table width="100%" border="0" cellspacing="0" cellpadding="0">

not:

<table width=100% border=0 cellspacing=0 cellpadding=0>

back to top

example of an xhtml document

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:Lang="en" Lang="en">
<head>
<title>xhtml web page</title>
</head>
<body>
<p>Text to go here</p>
</body>
</html>

css and xhtml documents

  1. Follow the cascading style sheets level 2 recommendations
  2. css style sheets for xhtml should use lower case element and attribute names

dreamweaver and xhtml

Currently, Dreamweaver 4 does not allow easy editing of xhtml documents. However, this article from A List Apart explains how you can configure Dreamweaver to create valid xhtml documents. It also links to the Macromedia Dreamweaver exchange where you can download an extension to manage xhtml within Dreamweaver.

http://www.alistapart.com/stories/dreamweaver/

further information