25 - XHTML

 XHTML is Extended Hyper text Markup Language. As the name itself speaks, it extends the functionalities of HTML.

HTML is a very flexible mark up language whereas XHTML is a well formed language.

Why is it developed?

XHTML was developed to increase the interoperability of HTML (how HTML works with other systems) and to make it more extendible. And also to eliminate bad HTML files, because HTML is lenient as it parses and executes any HTML file (even if it does not follow HTML syntax)

XHTML or XML is a stricter version of HTML and is “well formed”.

Well formed means it strictly follows the rules specified in its specification.

Both HTML and XML have lot of similarities and a lot of differences but at the end of the day, both complement each other because they were designed to meet different goals.

XML is designed for describing data and HTML for displaying data.

But when we learn a new language it is always recommended to compare it with the language you already know, because that speeds up the pace and you will remember it for forever.

Some of the differences between HTML and XML are given below in tabular form for your reference,

S.no

HTML

XML

1

HTML focuses mainly on the representation of data, its font, format etc

XML focuses on what is the data and how it needs to transported and stored.

2.

HTML is a mark up language

XML is used for creating standardized specifications for custom mark up languages. That means we can define and develop new mark up languages.

3.

It is a presentation language

It is neither presentation nor programming language.

4.

HTML is case insensitive

XML is case sensitive

5.

Tags are predefined

We can create our own set of tags.

6.

HTML is used for designing a web page to display.

XML is used to transport data between the application and database.

7.

HTML does not preserve white spaces

XML preserves white spaces.

8.

Not Strict

Very Strict.

9.

Closing tags are optional. Some of the tags may be left unclosed.

Closing tags are mandatory. Each tag must be closed.

10.

HTML is static, can handle pre formatted data only.

XML is dynamic, the data is transported. The user can request for any data on the database.

11.

Attribute values may or may not be quoted.

Attribute values must be quoted.

 

<! DOCTYPE >

The first line of the XML document must be Doctype declaration. It is mandatory.

The namespace of the xml must be specified within html tag.

The following is the format of a simple xml document.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
 <html xmlns=http://www.w3.org/1999/xhtml>
  <head>
   <title>
     Title of the document
   </title>
  </head>
  <body>
    ……
  </body>
</html>

An example XML program

<?xml version="1.0"?>
<Book>
  <Details>
    <TITLE>The Da Vinci Code</TITLE>
    <Author>Dan Brown</Author>
  </Details>
  <Details>
    <TITLE>Five point Someone</TITLE>
    <Author>Chethan Bhagath</Author>
  </Details>
</Book>

The output of the above program would be

 You would be amazed because the output is nothing but the code we have written. Yes, xml does nothing with the data it just stores the data. Here, we have created our own tags like Book, Details, Author etc.

The browser does not know how to render these tags because we have created our own tags. They are displayed as it is until we format it and specify how to display each tag. Using CSS we can add such information. We have to link the style sheet file using href attribute.

    <?xml-stylesheet type="text/css" href="book_style.css"?>

An example program which demonstrates this,

<?xml version="1.0"?>
<?xml-stylesheet type="text/css" href="book_style.css"?>
<Book>
  <Details>
  <TITLE>The Da Vinci Code</TITLE>
  <Author>Dan Brown</Author>
  </Details>
   <Details>
  <TITLE>Five point Someone</TITLE>
  <Author>Chethan Bhagath</Author>
  </Details>
</Book>

book_style.css

Book
{
background-color: #ffffff;
width: 100%;
}
Details
{
display: block;
margin-bottom: 30pt;
margin-left: 0;
}
TITLE
{
color: #FF0000;
font-size: 20pt;
}
Author
{
color: #0000FF;
font-size: 20pt;
}

The output of the above program would be,

This is an introductory brief to XML. You can view Tutorial on XML for more information.

Like us on Facebook