My introduction to XHTML (Extensible HyperText Markup Language) is designed for users of my free HTML templates who want to learn about the language used to code all of my templates. XHTML replaces HTML 4.0, and has been called HTML5.0, although almost all experts prefer to use XHTML.
The World Wide Web Consortium (W3C) proposed the XHTML standard back in 2000 with the intention of unifying HTML with the new XML standard. Documents in popular software such OpenOffice are saved in XML format, as are RSS feeds and sitemaps for blogs and websites. Merging these two standards seems logical given the way people are starting to use the Internet.
Monday, October 15. 2007
An Introduction To XHTML
As the Internet evolves and 'Web 2.0' becomes a reality, applications making use of the next generation XHTML are already appearing such as Google Apps, the service that allows a web browser to become a word processor, spreadsheet, or any other software application. Further progress will see open standards becoming more prevalent, allowing more and more people to share information without having to use closed file formats.
Reasons for Using XHTML?
Future proofing your webpages through the adoption of XHTML and CSS (Cascading Style Sheets) means content developed today will still be capable of being indexed and read or viewed by future generations. By separating content from code, browsers of the future will not need to interpret stylistic constructs, instead, alternative style sheets can be developed that conform to newer technology such as wider screens and subscription services.
As mentioned above, content is styled using the CSS files, and the elegance of this enables PDA's, mobile phones, game consoles, and other Internet capable devices to supply their own stylesheet and still display the information for the user. HTML 4.0 documents are often not compatible with these devices.
The SEO industry are big supporters of XHTML, and many cite their increased search engine rankings with the separation of form from content by converting webpages to XHTML and CSS. My own experiments with other websites suggest this is in fact correct, although I believe this is less because of the separation of form and content, and more because the resulting page code is much smaller allowing the content to stand out more from the surrounding HTML.
How to Use XHTML?
Structurally, XHTML looks very similar to HTML and converting from one to the other doesn't involve much effort. Here is an example XHTML page, it's quite simple for the purposes of explanation.
<html>
<head>
<title>The XHTML Times</title>
</head>
<body>
<h1>Main Heading </h1>
<hr />
<img src="images/logo.png" alt=”Corporate Logo” />
<p>Today's news is brought to you by the number 3. </p>
</body>
</html>
Looking at the tags used in our sample XHTML page, notice that all are written in lower-case. XML documents are case sensitive, meaning that title and TITLE are different tags even though in HTML they are seen as the same, and whilst it isn't an issue now, most browsers being capable of using either case, we should assume that in the future this might not be the case.
Notice also that all tags are ended with a '/', including the <img /> and <hr /> tags. The break '<br />' tag would be treated the same way. All tag attributes also require quotation marks around the quantifier.
Another major change brought in with the introduction of XHTML is consistency in the hierarchy of tags, for example block level tags such as a &ly;div id=””> must precede an inline tag such as <p>. Furthermore, tag order is considered important. Valid XHTML documents do not allow mixing the order of tags, so as an example
<p> This is my <b>paragraph</p></b>
will no longer pass validation. Instead, the semantically correct version
<p> This is my <b>paragraph</b></p>
must be used. We'll cover validating XHTML paragraphs a little later.
DocTypes Used in XHTML Pages
The HTML, XHTML, and CSS protocols are managed and maintained by the World Wide Web Consortium (W3C), and they have conveniently agreed that converting to a strict interpretation of XHTML might not be desirable or feasible for all webmasters, so a transitional protocol is recognised as well.
The various DocTypes are transitional and strict, and are specified at the very top of all XHTML pages. Omitting the DocType may lead to unpredictable results from modern browsers. Transitional XHTML allows webmasters to continue to use some HTML tags such as <center> whereas in the strict implementation these are not permitted. Here are the DocTypes;
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
Validating Your XHTML
Earlier I mentioned validating your XHTML pages. The W3C offer a service that allows you to provide the URL of your page and their software will analyse it for compliance with either transitional or strict XHTML.
A similar site also tests your CSS for validity.
Reasons for Using XHTML?
Future proofing your webpages through the adoption of XHTML and CSS (Cascading Style Sheets) means content developed today will still be capable of being indexed and read or viewed by future generations. By separating content from code, browsers of the future will not need to interpret stylistic constructs, instead, alternative style sheets can be developed that conform to newer technology such as wider screens and subscription services.
As mentioned above, content is styled using the CSS files, and the elegance of this enables PDA's, mobile phones, game consoles, and other Internet capable devices to supply their own stylesheet and still display the information for the user. HTML 4.0 documents are often not compatible with these devices.
The SEO industry are big supporters of XHTML, and many cite their increased search engine rankings with the separation of form from content by converting webpages to XHTML and CSS. My own experiments with other websites suggest this is in fact correct, although I believe this is less because of the separation of form and content, and more because the resulting page code is much smaller allowing the content to stand out more from the surrounding HTML.
How to Use XHTML?
Structurally, XHTML looks very similar to HTML and converting from one to the other doesn't involve much effort. Here is an example XHTML page, it's quite simple for the purposes of explanation.
<html>
<head>
<title>The XHTML Times</title>
</head>
<body>
<h1>Main Heading </h1>
<hr />
<img src="images/logo.png" alt=”Corporate Logo” />
<p>Today's news is brought to you by the number 3. </p>
</body>
</html>
Looking at the tags used in our sample XHTML page, notice that all are written in lower-case. XML documents are case sensitive, meaning that title and TITLE are different tags even though in HTML they are seen as the same, and whilst it isn't an issue now, most browsers being capable of using either case, we should assume that in the future this might not be the case.
Notice also that all tags are ended with a '/', including the <img /> and <hr /> tags. The break '<br />' tag would be treated the same way. All tag attributes also require quotation marks around the quantifier.
Another major change brought in with the introduction of XHTML is consistency in the hierarchy of tags, for example block level tags such as a &ly;div id=””> must precede an inline tag such as <p>. Furthermore, tag order is considered important. Valid XHTML documents do not allow mixing the order of tags, so as an example
<p> This is my <b>paragraph</p></b>
will no longer pass validation. Instead, the semantically correct version
<p> This is my <b>paragraph</b></p>
must be used. We'll cover validating XHTML paragraphs a little later.
DocTypes Used in XHTML Pages
The HTML, XHTML, and CSS protocols are managed and maintained by the World Wide Web Consortium (W3C), and they have conveniently agreed that converting to a strict interpretation of XHTML might not be desirable or feasible for all webmasters, so a transitional protocol is recognised as well.
The various DocTypes are transitional and strict, and are specified at the very top of all XHTML pages. Omitting the DocType may lead to unpredictable results from modern browsers. Transitional XHTML allows webmasters to continue to use some HTML tags such as <center> whereas in the strict implementation these are not permitted. Here are the DocTypes;
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
Validating Your XHTML
Earlier I mentioned validating your XHTML pages. The W3C offer a service that allows you to provide the URL of your page and their software will analyse it for compliance with either transitional or strict XHTML.
A similar site also tests your CSS for validity.
Trackbacks
Trackback specific URI for this entry
No Trackbacks
