Pa2sw0rd HTML – XHTML
XHTML is HTML written in XML format.
What is XHTML?
- XHTML stands for Extensible Hypertext Markup Language
- XHTML is almost identical to HTML 4.01
- XHTML is a stricter and cleaner version of HTML
- XHTML is HTML defined as an XML application
- XHTML is a W3C recommendation published in January 2001
- XHTML is supported by all major browsers
Why use XHTML?
Many pages on the Internet contain “bad” HTML.
The following HTML code works perfectly fine if viewed in a browser (even though it doesn’t follow HTML rules):
<html>
<head>
<meta charset="utf-8">
<title>This is non-standard HTML</title>
<body>
<h1>Non-standard HTML
<p>This is a paragraph
</body>XML is a markup language that must be correctly tagged and well-formed.
There are a number of different browser technologies in the tech world today. Some run on computers, while others might run on mobile phones or other small devices. Small devices often lack the resources and power to interpret “bad” markup languages.
So – by combining the strengths of XML and HTML, XHTML was developed. XHTML is HTML reformulated as XML.
The most important differences compared to HTML:
Document structure
- XHTML DOCTYPE is mandatory
- The XML namespace attribute in <html> is mandatory
- <html>, <head>, <title>, and <body> are also mandatory
Element Syntax
- XHTML elements must be properly nested
- XHTML elements must always be closed
- XHTML elements must be lowercase
- XHTML documents must have a root element
Attribute syntax
- XHTML attributes must be lowercase
- XHTML attribute values must be enclosed in quotes
- XHTML attribute minification is also prohibited
<!DOCTYPE ….> is mandatory
XHTML documents must have an XHTML DOCTYPE declaration.
The <html>, <head>, <title>, and <body> elements must also be present, and the document must be assigned an xml namespace using the xmlns attribute within <html>.
The following example shows an XHTML document with the minimum required tags:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta charset="utf-8">
<title>Document Title</title>
</head>
<body>
Document Contents
</body>
</html>XHTML elements must be nested properly
In HTML, some elements can be nested without each other, like this:
<b><i>Bold and italic text</b></i>In XHTML, all elements must be nested properly within each other, like this:
<b><i>Bold and italic text</i></b>XHTML elements must have a closing tag
Error example:
<p>This is a paragraph <p>This is another paragraphCorrect example:
<p>This is a paragraph</p> <p>This is another paragraph</p>Empty elements must contain a closing tag
Error example:
Line: <br> Horizontal Rule: <hr> Image: <img src="happy.gif" alt="Happy face">Correct example:
Lines:<br /> Horizontal Rule:<hr /> Image: <img src="happy.gif" alt="Happy face" />XHTML elements must be lowercase
Error example:
<BODY> <P>This is a paragraph</P> </BODY>Correct example:
<body> <p>This is a paragraph</p> </body>Attribute names must be lowercase
Error example:
<table WIDTH="100%">Correct example:
<table width="100%">Attribute values must be enclosed in quotes
Error example:
<table width=100%>Correct example:
<table width="100%">Property shorthand is not allowed
Error example:
<input checked>
<input readonly>
<input disabled>
<option selected>Correct example:
<input checked="checked">
<input readonly="readonly">
<input disabled="disabled">
<option selected="selected">How to Convert HTML to XHTML
- Add an XHTML <!DOCTYPE> to your page
- Add the xmlns attribute to the html element of each page.
- Change all elements to lowercase
- Close all empty elements
- Change all attribute names to lowercase
- Add quotes to all attribute values
IT Resource Hub » HTML – XHTML
