The key differences between HTML and XHTML
In February of 1999 the World Wide Web Consortium (otherwise known as the W3C) released the specifications for XHTML version 1.0, and by January 2000 it became the W3C’s recommended format, replacing HTML 4.01. XHTML, or Extensible Hypertext Markup Language, is a hybrid between XML and HTML.
XHTML might best be described as a stricter version of HTML. HTML has typically been a very forgiving language; you can build a web page using technically invalid HTML and still have it display properly. For example, the following code is badly written HTML but will still work in all browsers...
<html>
<head>
<title>Do Not Code Like This</title>
<body>
<p>This page uses bad HTML because it doesn’t include the closing tags.
<p>See, the ending “paragraph” tags are missing, and so is the closing “head” tag.
<p>You will see pages like this all over the web.
</body>
</html>
Here are the main differences between the two languages:
-XHTML must include closing tags
The above example would NOT work in XHTML. Even elements that normally do not have a closing tag in HTML, like the line break tag <br> and the image tag <img> must close in XHTML. This is accomplished by adding a slash to the end of the tag; <br> becomes <br /> and <img src="file"> becomes <img src="file" />. Closing tags are vital in XML to indicate separate elements, and XHTML is designed to work hand in hand with XML.
-XHTML tags must be lowercase
No longer can web developers use a mix of <BR> and <br> tags. Because XML is case-sensitive (unlike HTML), XHTML must include only lowercase letters in its tags. This includes tag attributes, such as the "src" attribute in the image tag. And, speaking of attributes...
-XHTML attributes must be fully stated and include quotation marks
Several HTML attributes can be minimized, meaning that HTML coders can use a bit of shorthand to describe them. For example, if you want to use HTML to draw a horizontal line without shading you can use the tag <hr noshade> and be done with it. In XHTML the attribute must be fully described, which means you would write the tag out as <hr noshade="noshade" />. The quotation marks around the descriptor are also a requirement; in XHTML, <img src=file> won't work.
-XHTML elements must be nested
HTML writers can get away with scrambling nested element tags without affecting the final result, as you can see in the below example…
<p><b>This bold element is supposed to be nested inside the paragraph element, but the closing tags are the wrong way around. Not a problem in HTML!</p></b>
In XHTML, elements must be nested correctly, just as they are in the following code...
<p><b>This bold element is correctly nested inside the paragraph element. Hooray for XHTML!</b></p>
HTML developers may find the new restrictions annoying, but a stricter requirement for website coding is becoming increasingly vital. Mobile devices with internet capability have become extremely common, and such devices simply don't have the capacity to make allowances for bad code. And as websites become more dynamic, they must work with other languages such as PHP, Java and XML. Badly written HTML will lead to unstable and buggy interfaces. Web developers would be well advised to clean up their code now, rather than waiting for the inevitable crash.
XHTML might best be described as a stricter version of HTML. HTML has typically been a very forgiving language; you can build a web page using technically invalid HTML and still have it display properly. For example, the following code is badly written HTML but will still work in all browsers...
<html>
<head>
<title>Do Not Code Like This</title>
<body>
<p>This page uses bad HTML because it doesn’t include the closing tags.
<p>See, the ending “paragraph” tags are missing, and so is the closing “head” tag.
<p>You will see pages like this all over the web.
</body>
</html>
Here are the main differences between the two languages:
-XHTML must include closing tags
The above example would NOT work in XHTML. Even elements that normally do not have a closing tag in HTML, like the line break tag <br> and the image tag <img> must close in XHTML. This is accomplished by adding a slash to the end of the tag; <br> becomes <br /> and <img src="file"> becomes <img src="file" />. Closing tags are vital in XML to indicate separate elements, and XHTML is designed to work hand in hand with XML.
-XHTML tags must be lowercase
No longer can web developers use a mix of <BR> and <br> tags. Because XML is case-sensitive (unlike HTML), XHTML must include only lowercase letters in its tags. This includes tag attributes, such as the "src" attribute in the image tag. And, speaking of attributes...
-XHTML attributes must be fully stated and include quotation marks
Several HTML attributes can be minimized, meaning that HTML coders can use a bit of shorthand to describe them. For example, if you want to use HTML to draw a horizontal line without shading you can use the tag <hr noshade> and be done with it. In XHTML the attribute must be fully described, which means you would write the tag out as <hr noshade="noshade" />. The quotation marks around the descriptor are also a requirement; in XHTML, <img src=file> won't work.
-XHTML elements must be nested
HTML writers can get away with scrambling nested element tags without affecting the final result, as you can see in the below example…
<p><b>This bold element is supposed to be nested inside the paragraph element, but the closing tags are the wrong way around. Not a problem in HTML!</p></b>
In XHTML, elements must be nested correctly, just as they are in the following code...
<p><b>This bold element is correctly nested inside the paragraph element. Hooray for XHTML!</b></p>
HTML developers may find the new restrictions annoying, but a stricter requirement for website coding is becoming increasingly vital. Mobile devices with internet capability have become extremely common, and such devices simply don't have the capacity to make allowances for bad code. And as websites become more dynamic, they must work with other languages such as PHP, Java and XML. Badly written HTML will lead to unstable and buggy interfaces. Web developers would be well advised to clean up their code now, rather than waiting for the inevitable crash.
This site needs an editor - click to learn more!
Related Articles
Editor's Picks Articles
Top Ten Articles
Previous Features
Site Map
Content copyright © 2023 by Elizabeth Connick. All rights reserved.
This content was written by Elizabeth Connick. If you wish to use this content in any manner, you need written permission. Contact
BellaOnline Administration
for details.
