XHTML Introduction
Last Updated :
10 Jan, 2024
XHTML or EXtensible HyperText Markup Language is a mix of HTML and XML, very similar to HTML but stricter. It’s like a rulebook for creating web pages that browsers easily understand. Unlike HTML, you have to be careful and follow the rules exactly. Most browsers support it. Just think of it as a more precise way to write web code.
History
It was developed by the World Wide Web Consortium (W3C) and helps web developers transition from HTML to XML. With XHTML, developers can enter the XML world with all its features while still ensuring backward and future compatibility of the content. The XHTML family includes three document types; the first is XHTML 1.0, which was recommended by W3C on January 26, 2000. The second is XHTML 1.1, which was recommended by W3C on May 31, 2001.
The third is XHTML5, a standard used for developing an XML adaptation of the HTML5 specification. An XHTML document must have an XHTML <!DOCTYPE> declaration.
Elements of XHTML:
<!DOCTYPE> |
Used to declare the Document Type Definition (DTD), specifying the rules for the markup language, ensuring proper rendering in browsers. |
<html> |
Encloses the entire HTML or XHTML document, serving as the root element. |
<head> |
Contains meta-information about the document, such as the title, character set, linked stylesheets, and other essential elements. |
<title> |
Nested within the head section, specifies the title of the document, displayed in the browser’s title bar or tab. |
<body> |
Encloses the content of the web page, including text, images, links, and other HTML elements. It represents the visible part of the document displayed in the browser. |
When creating an XHTML web page, it is necessary to include a DTD (Document Type Definition) declaration. There are three types of DTD which are discussed below:
Transitional DTD:
It is supported by the older browsers which do not have inbuilt cascading style sheets supports. Several attributes are enclosed in the body tag which are not allowed in strict DTD.Â
Syntax:
<!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">
Example: In this example we will see the code for writing an XHTML document with an example.Â
html
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "DTD/xhtml1-transitional.dtd">
<head>
<title>Transitional DTD XHTML</title>
</head>
<body bgcolor="#dae1ed">
<div style="color:#090;font-size:40px;
font-weight:bold;text-align:center;
margin-bottom:-25px;">GeeksforGeeks</div>
<p style="text-align:center;font-size:20px;">
A computer science portal</p>
<p style="text-align:center;font-size:20px;">
Option to choose month:
<select name="month">
<option selected="selected">January</option>
<option>February</option>
<option>March</option>
<option>April</option>
<option>May</option>
<option>June</option>
<option>July</option>
<option>Augusy</option>
<option>September</option>
<option>October</option>
<option>November</option>
<option>December</option>
</select>
</p>
</body>
</html>
|
Output:
Â
Strict DTD:
Strict DTD is used when XHTML page contains only markup language. Strict DTD is used together with cascading style sheets, because this attribute does not allow CSS property in body tag.Â
Syntax:
<!DOCTYPE html
PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
Example 2: In this example we will see the code for writing an XHTML document with an example for strict DTD.Â
html
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "DTD/xhtml1-strict.dtd">
<head>
<title>Strict DTD XHTML</title>
</head>
<body>
<div style="color:#090;font-size:40px;
font-weight:bold;text-align:center;
margin-bottom:-25px;">GeeksforGeeks</div>
<p style="text-align:center;font-size:20px;">
A computer science portal</p>
<p style="text-align:center;font-size:20px;">
Option to choose month:
<select name="month">
<option selected="selected">January</option>
<option>February</option>
<option>March</option>
<option>April</option>
<option>May</option>
<option>June</option>
<option>July</option>
<option>Augusy</option>
<option>September</option>
<option>October</option>
<option>November</option>
<option>December</option>
</select>
</p>
</body>
</html>
|
Output:
 
Â
Frameset DTD:
The frameset DTD is used when XHTML page contains frames. This DTD is identical to the HTML 4.01 Transitional DTD except for the content model of the HTML element.
Syntax:
<!DOCTYPE html
PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN"
"DTD/xhtml1-frameset.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
Example 2: In this example we will see the code for writing an XHTML document with an example for frameset DTD.
html
<?xml version="1.0" encoding="UTF-8"?>
xml:lang="en" lang="en">
<head>
<title>Frameset DTD XHTML</title>
</head>
<frameset cols="30%, 20%, *">
<frameset rows="40%, 30%, *">
<frame src="gfg.html" />
<frame src="gfg1.html" />
<frame src="geeks.html" />
</frameset>
<frameset rows="40%, 60%">
<frame src="g4g.html" />
<frame src="g4g1.html" />
</frameset>
<frameset rows="20%, 20%, 30%, *">
<frame src="geeksforgeeks.html" />
<frame src="geeksforgeeks1.html" />
<frame src="geeksforgeeks2.html" />
<frame src="geeksforgeeks3.html" />
</frameset>
</frameset>
</html>
|
Output:
Why use XHTML?
- XHTML documents are validated with standard XML tools.
- It is easily to maintain, convert, edit document in the long run.
- It is used to define the quality standard of web pages.
- XHTML is an official standard of the W3C, your website becomes more compatible and accurate with many browsers.
Benefits of XHTML:
- All XHTML tags must have closing tags and are nested correctly. This generates cleaner code.
- XHTML documents are lean which means they use less bandwidth. This reduces cost particularly if your web site has 1000s of pages.
- XHTML documents are well formatted well–formed and can easily be transported to wireless devices, Braille readers and other specialized web environments.
- All new developments will be in XML (of which XHTML is an application).
- XHTML works in association with CSS to create web pages that can easily be updated.
Difference Between HTML and XHTML:
| HTML or HyperText Markup Language is the main markup language for creating web pages |
XHTML (Extensible HyperText Markup Language) is a family of XML markup languages that mirror or extend versions of the widely used Hypertext Markup Language (HTML) |
| Flexible framework requiring lenient HTML specific parser |
Restrictive subset of XML which needs to be parsed with standard XML parsers |
| Proposed by Tim Berners-Lee in 1987 |
World Wide Web Consortium Recommendation in 2000. |
| Application of Standard Generalized Markup Language (SGML). |
Application of XML |
| Extended from SGML. |
Extended from XML, HTML |
Like Article
Suggest improvement
Share your thoughts in the comments
Please Login to comment...