DIFFERENCE BETWEEN HTML AND XHTML

HTML (Hyper Text Markup Language) was created in the early 90′s as a way to describe web pages. It was easy to read,write and understand it.You can apply styles and use different layouts to display the data in a formatted way in an html file. XML (Extensible Markup Language) was created to store any type of data we want. The data that is displayed in an html file could come from an xml file. In simple, HTML displays the data while XML holds the data. A few years after XML, the W3C (the governing body of HTML) decided they should make a new version of HTML that was proper XML.

There is no big difference between XHTML and HTML. HTML, is an application of SGML (Standard Generalized Markup Language) and allows an web designer to omit certain tags and use attribute minimization i.e., a “bad” HTML. The XHTML (Extensible HyperText Markup Language) is an application of XML. It does not permit the omission of any tags or the use of attribute minimization.
Today’s market consists of different browser technologies, some users run Internet on computers, and some run Internet on mobile phones and hand helds. The later do not have the capacity to interpret a “bad” markup language.
Therefore – by combining HTML and XML’s strengths, we got a markup language that is useful now and in the future – XHTML.

The Most Important Differences between HTML and XHTML:

1. XHTML elements must be properly nested.
In HTML, some elements can be improperly nested within each other and it might display exactly as you intended.
Eg:<strong><em>Here’s some bold and italicized text</strong></em>

In XHTML, all elements must be properly nested within each other.
Eg:<strong><em>Here’s a valid XHTML version of bold italicized code</em></strong>

2. XHTML elements and empty elements must always be closed.
This example is valid HTML:
<p>This is a paragraph.
A break: <br>
A horizontal rule: <hr>
An image: <img src=”happy.gif” alt=”Happy face”>

This is Equivalent in XHTML:
<p>This is a paragraph</p>
A break: <br />
A horizontal rule: <hr />
An image: <img src=”happy.gif” alt=”Happy face” />
IMPORTANT:To make your XHTML compatible with today’s browsers, you should add an extra space before the “/” symbol.

3. XHTML elements must be in lowercase.

Instead of using uppercase like this
<BODY>
<P>This is a paragraph</P>
</BODY>
use lowercase for Eg
<body>
<p>This is a paragraph</p>
</body>

Some More XHTML Syntax Rules:
1. Attribute names must be in lower case.
Eg: <table width=”100%”>

2. Attribute values must be quoted.
eg:<table width=“100%”>

3. Attribute minimization is forbidden.

Eg: <input disabled=“disabled” />
<option selected=“selected” />

4. The id attribute replaces the name attribute.
Note: To interoperate with older browsers for a while, you should use both name and id, with identical attribute values, like this:
Eg: <img src=”picture.gif” id=”picture1″ name=”picture1″ />

5. The XHTML DTD defines mandatory elements.
All XHTML documents must have a DOCTYPE declaration.
This is a minimum XHTML document template:
<!DOCTYPE Doctype goes here>
<html xmlns=http://www.myseda.com/>
<head>
<title>Title goes here</title>
</head><body>
</body></html>
Note: The DOCTYPE declaration is not a part of the XHTML document itself. It is not an XHTML element, and it should not have a closing tag.

Here is what people usually do . . .

Declare your pages to XHTML This way, the browser knows how to read them.
Then, run your pages through the W3C XHTML Validator to make sure you code is correct. Also, make sure you are use proper web design principles say like

  • To use CSS (Cascading Style Sheet) for formatting and layouts.
  • Avoid using tables for designing layout.
  • Do not use old tags like <font>.

Leave a comment