DOCTYPE Explained
What is DOCTYPE and why do I care?
The DOCTYPE declaration is the first line of code in any web document. It tells the browser what type of markup you wrote. Declaring one but coding for another may result in errors or inconsistencies across the spectrum of browsers. I’ve offered a few downloads that you can set as blank starting documents, automating a few lines of code that you’ll potentially type hundreds of thousands of times.
What Are The Different DOCTYPEs?
- Strict: Does not contain any presentation code such as the <FONT> tag – it is purely structural.
- Transitional: Allows presentation code, but does not contain frame-related markup.
- Frameset: Allows presentation code and contains frame-related markup.
How Do I Choose What DOCTYPE to Declare?
- Strict: You are an adept web geek, perhaps a seasoned veteran of the Browser Wars; your markup is lean and your CSS is tight. You might be thinking ahead to accessibility or dynamic layouts.
- Transitional: You are unsure what to choose; you think you might commit a faux pas and include presentation code in your markup. You might be supporting older code (the horror!).
- Frameset: For when you cannot avoid using frames. In this mode the FRAMESET replaces the BODY element.
What Do They Look Like?
The very first line in any of your pages should be one of the following:
<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Strict//EN”
“http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd”>
<!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 Frameset//EN”
“http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd”>
Validating Your Page
The first step in eliminating rendering errors and cross browser battles is to ensure that your document is valid code (of the specified DOCTYPE). Paste your code or URL into the W3C validation service and go from there.
Downloads
Most HTML editors and development environments will allow you to specify the blank starting documents that are used as templates when you create a new file. Download these three HTML pages and set them up in your editor to be sure your DOCTYPE is declared correctly every time without manually typing it.
More Reading About the DOCTYPE:
Believe it or not, it’s possible to geek out on the DOCTYPE even more. Explore the links below to learn about such highly exotic nuances such as DOCTYPE switching, other DOCTYPE declarations and more.
- Recommended DTD’s @ W3C
- Fix Your Site With the Right DOCTYPE! @ A List Apart
- Beyond DOCTYPE: Web Standards, Forward Compatibility & IE8
- The HTML DOCTYPE Tag @ W3Schools
- DOCTYPE Explained @ The O’Reilly Web DevCenter
Connect With Me
