HTML vs XHTML

One of the first steps in developing a web site is deciding whether to use HTML 4.01 or XHTML 1.0. HTML is a much looser language than XHTML creating a larger potential for bad coding practices and unpredictable markup. This can create issues when parsing or manipulating the HTML code, compared to XHTML, which is an XML-ready language with very strict coding practices, and much more consistent coding rules and tags.

This doesn’t mean XHTML is better. Strict coding guidelines can be implemented for HTML, but browsers are much more forgiving of typos and missing tags with HTML.

The W3C has also stopped development on XHTML 2.0 and is directing it’s resources to HTML 5.0. This means XHTML will never grow beyond it’s current capabilities. HTML 5 will be the future language of the Internet, so using HTML now will provide better future compatability.

Another benefit of HTML is avoiding the MIME issue. All versions of IE, including 8, don’t support the XHTML specified MIME type application/xhtml+xml. Instead IE reads the page as text/html and will render the page if it follows the HTML compatibility recommendations. Web developers have been calling on the IE development team to implement the W3C specfications, but the team decided against it during the development of IE7.

Once the language is decided, developers have to decide on implementing a ’strict’ or ‘transitional’ version of the language. With either HTML or XHTML the strict version has deprecated elements and attributes, while the transitional version will allow those elements and a looser interpretation of the rendering rules.

All web pages must have a valid DTD (Document Type Definition) on the first line of the page in order to control the rendering mode of all modern browsers. The DTD or DOCTYPE describes the language used and the strict or transitional version.

All modern browsers have two basic rendering modes: quirks and standards. All modern browsers will render in standards-compliant mode if a valid DTD appears as the first line of code in a page. Obviously, standards provides the most predictable results and similar rendering amongst browsers. It should always be the benchmark designed for, unless you are dealing with legacy code that requires deprecated elements or attributes.

Both the strict and transitional versions of the DOCTYPE will cause the browser to use standards mode, but a typo in the DOCTYPE will cause quirks mode to be used. In IE6, the inclusion of an xml declaration will trigger quirks mode even if the DOCTYPE is correct.

Quirks mode in IE6 will cause the browser to revert to IE 5.5 rendering mode and IE7 quirks mode will do the same since it will render in IE6 quirks mode.

One easy way to tell if a browser is using quirks or standards mode is with a short JavaScript code:

function testRenderMode() {
alert(document.compatMode);
}
You can also add the preceding code to a bookmark by right clicking here for easy access.

Thanks to Ingo Chao for the link and information about quirks mode.

Did you enjoy this post? Why not leave a comment below and continue the conversation, or subscribe to my feed and get articles like this delivered automatically to your feed reader.

Comments

No comments yet.

Leave a comment

(required)

(required)