XHTML vs. HTML

 

I know that many people still use HTML 4.01, but with the introduction of XHTML and unending browser updates, it is becoming less popular in favour of this new web standard. This tutorial is just an introduction to XHTML.

Firstly though, what is XHTML?

XHTML is pretty much the same as HTML with several small differences. It stands for Extensible HyperText Markup Language. It is a combination of HTML and XML. As it is a web standard, all new browsers support it and eventually, it will replace HTML.

So why use XHTML?

Well, there is an ever-growing number of badly formed documents and many browsers on things such as PDAs and phones cannot interpret these. XHTML requires well-formed documents because XML is a markup language which needs to have everything marked up properly. Therefore, XHTML documents can be used on all browsers with XML support.

What are the some of the most important differences between XHTML and HTML?

Tag names and attributes must be in lowercase. For example,

<BODY>

would be incorrect as XML is case sensitive. Therefore, it treats

<BODY>

and

<body>

as seperate tags.

Also, all elements must be closed. For example,

<li>…</li>

Tags which don’t have a closing tag such as

<img>

and

<input>

must also be closed. This is done by adding ” /” to the end of it, for example,

<img src=”image.jpg” alt=”This is an image” />

Line breaks and horizontal rules must also be closed, so correct examples of these would be:

and

<hr />

All elements must also be properly nested. Some elements can be nested incorrectly in HTML, for example,

<b><u>…</b></u>

However, this is not the case in XHTML. The correct version is:

<b><u>…</u></b>

The values of attributes must be quoted. For example,

<img src=image.gif height=100 alt=Image />

is incorrect. In XHTML, it must be:

<img src=”image.gif” height=”100″ alt=”Image” />

The name attribute is now replaced by id. However, the name and id tags should be used together in order to operate on older browsers, e.g.

<img src=”image.png” id=”logo” name=”logo” />

This was just a very basic introduction to XHTML. For more information, visit the w3schools site. (www.w3schools.com)

You may also like...