XHTML stands for Extensible HyperText Markup Language. HTML is loose
in terms of application; but XHTML is aimed to be strict in order to
match the requirements of XML, where everything must be marked up correctly.
XML contains data that HTML will display it. XHTML is HTML containing some
XML codes. The new rules in XHTML could be summarized as:
The XHTML document must:
- contains one root element, i.e. <html>,
- be in lowercase,
- always be closed, even for the empty elements as <br>, <hr>, <img>, ... and
- correctly nested, like <b><i> ...</i></b> not <i><b> ...</i></b>
- have attribute values quotted, like <font color = "red"></i>
- have no minimization, like not <option selected>, but <option selected="selected" />
- have not name attribute, but an id attribute, like
<img src="goldMouth.gif" id="gold" />
- have a dtd elements for DOCTYPE declaration.
DTD stands for Document Type Definitions, that define three XHTML documents:
STRICT for strict and hard markup, TRANSATIONAL, the most common used with CSS
(Cascading Style Sheets), and FRAMESET when using Frames.
2. Example:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
</head>
<body>
<b>This is an xhtml document</b>
<br />
<p><em> An xhtml document must:</em></p>
<ul>
<li>contain a root element, that is <html>. The elements with the tags <head>, <body>, ...
are called the children of the root element.</li>
<li>be in lower case</li>
<li>be closed even for the empty elements that can also start
with />, like:
<ul>
<li><b /></li>
<li><hr /></li>
</ul>
</li>
<li> nested correctly</li>
<li> have attribute values quotted, like <font color = "red"></i>
<li> have no minimization, like <option selected="selected" /></li>
<li> have not name attribute, but an id attribute, like
<img src="goldMouth.gif" id="gold" /></li>
<li> have a dtd element
</ul>
<br />
<p><i> Always an extra space before the "/" symbol</i></p>
<hr />
<img src = "goldMouth.jpg" alt = "Gold mouth with Corto Maltese, by Hugo Pratt" />
</body>
</html>
The output is given within an iframe witout border, as follows:
When using language attribute "lang", include it also for XML, like this:
<div lang="en" xml:lang="en">In English</div>
3. The validator:
An HTML document can run with some errors; whereas an XHTMl document
must be strict. www.w3.org makes the rules and states about the validation
of an XHTML document. W3C standing for World Wide Web Consortium validates
HTML and CSS documents in order to standardize things in the web world.
Some machines with their related programs can figure out some bad HTML
programs like PCs and mobiles phones, but not all like for
hand held computers. This organisation
set documents well written, then well executed. To validate a document, it
must have as the first line the W3C DOCTYPE declaration :
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
One can test an XHTML With The W3C Validator, using the following
form:
Input your url web page address in the box below to get validated or try the present one:
Or go to: jigsaw.w3.org to to validate any
HTML document.
To assure that it has been created an interoperable Web page, we
may display the following icon on that validated page:
Obtained by the following used HTML:
<p>
<a href="http://validator.w3.org/check?uri=referer"><img
src="http://www.w3.org/Icons/valid-xhtml10-blue"
alt="Valid XHTML 1.0 Transitional" height="31" width="88" /></a>
</p>
4. To recap:
An XHTML documents must have a DOCTYPE declaration,html,
head, title, and body tags.