EE Logo Twitter Logo Facebook Logo Linked In Logo

August 27, 2010

How about them DOCTYPES


Document Type Definitions (DTD), also known as DOCTYPES, are markup declarations of web standards designed to increase cross-browser compatibility. Unfortunately, there are many options to choose from and very few details on the web of what exactly they do and how they differ. As you may have noticed, most DTDs reference the website w3.org (W3Schools). This is because W3Schools is backed by a large community and is considered to lead the web development industry and define its standards.

When utilizing a DTD, your browser will render in standards mode instead of the default backwards-compatible quirks mode. Quirks mode should only be used on websites written for older browsers. One of the biggest differences between quirks mode and standards mode is the quirks’ rendering of CSS in Internet Explorer as compared to other browsers. The Internet Explorer rendering, known as the Internet Explorer box model bug, differs from the W3C standards being that the content, padding and borders are within a specified width or height. W3C standards, on the other hand, define padding and borders as an addition to the specified width or height of the content. This issue has been resolved in the standards mode of Internet Explorer 6 and greater. Other notable quirks include browser differences in the vertical alignment of images and the ability of tables to inherit the CSS default font styles.

Your DTD should be the very first thing on the HTML page preceding the <html> tag without any leading white space. When picking a declaration you must choose between using an HTML or XHTML declaration. XHTML is very similar to HTML and is to help the transition to a new generation of mark-up languages. XHTML looks just like HTML except that it enforces syntax rules such as case sensitivity and that elements are properly closed. There is not much benefit of using XHTML markup over HTML other than that it is XSL ready, easier to maintain, and is ready for the future.

Generally, all new sites should aim to use a Strict DOCTYPE. A Strict DOCTYPE encourages and helps enforce the separation of structure and presentation as it excludes presentation attributes and elements. Also, using a Strict DOCTYPE ensures that browsers use their strictest, most standards complaint rendering modes. A Transitional DOCTYPE, however, is designed for older sites to make the transition to modern ways. The Transitional DOCTYPE permits the use of deprecated legacy markup such as <font>, <iframe>, and <u>. A full list of supported markup elements for the different DOCTYPES can be found here.

For a great list of available DOCTYPE declarations you can visit the W3School’s HTML <!DOCTYPE> Declaration page. When picking a declaration, be sure that it contains a full URL and that the URL actually works. There are many websites that post declarations that use relative paths or have a .dtd URL that longer works. You can test this by visiting to the URL address in your browser.

No Comments »

No comments yet.

RSS feed for comments on this post.

Leave a comment

Spam protection by WP Captcha-Free

© 2012 Einstein's Eyes