Improve Site Performance Increase Site Traffic Monitor Site Uptime Webmaster Resources NetMechanic Home Looking For Help? Partner Programs Privacy Policy Contact Us Press Room
NetMechanic Home LOGIN | HELP | ABOUT US | PRODUCTS | SITE MAP
NetMechanic Menu
Over 52 Million Web Pages Tested!     
 
Positioning tips.
search engine optimization story search.
Search for:


Your Email:

I would like to receive my newsletter in:
HTML format
Text format


Increase traffic.
Volume 8 (2005)
   September
   June
   April
   March
   January

Volume 7 (2004)
   November
   September
   July
   June
   May
   April
   March
   February (Part 2)
   February
   January (Part 2)
   January

Volume 6 (2003)
   December
   November (Part 2)
   November
   September
   August (Part 2)
   August
   July (Part 2)
   July
   June (Part 2)
   June
   May (Part 2)
   May
   April (Part 2)
   April
   March (Part 2)
   March
   February (Part 2)
   February
   January (Part 2)
   January

Volume 5 (2002)
   December (Part 2)
   December
   November (Part 2)
   November
   October (Part 2)
   October
   September (Part 2)
   September
   August (Part 2)
   August
   July (Part 2)
   July
   June (Part2)
   June
   May (Part 2)
   May
   April (Part 2)
   April
   March (Part 2)
   March
   February (Part 2)
   February
   January (Part 2)
   January

Volume 4 (2001)
   December (Part 2)
   December
   November (Part 2)
   November
   October (Part 2)
   October
   September (Part 2)
   September
   August (Part 2)
   August
   July (Part 2)
   July
   June (Part 2)
   June
   May (Part 2)
   May
   April (Part 2)
   April
   March (Part 2)
   March
   February (Part 2)
   February
   January (Part 2)
   January

Volume 3 (2000)
   December (Part 2)
   December
   November (Part 2)
   November
   October (Part 2)
   October
   September (Part 2)
   September
   August (Part 2)
   August
   July (Part 2)
   July
   June
   May
   April
   March
   February
   January

Volume 2 (1999)
   December
   November
   October
   September
   July
   June
   May
   April
   March
   February
   January

Volume 1 (1998)
   December
   November
   October
   September

 

HTML Tip:
Declare Your DOCTYPE

by Larisa Thomason,
Senior Web Analyst,
NetMechanic, Inc.

  
May 2003
Vol. 6, No. 9
 • Promotion Tip
 • HTML Tip
 • CSS Tip
  

You've carefully written and edited your HTML code, validated your style sheets, and painstakingly debugged your JavaScript code. But the page STILL doesn't look right! You could swear that some browsers are completely ignoring parts of your code.

Well, maybe they are. Do you know what your DOCTYPE is and what it's doing?

Yes, You DO Need A DOCTYPE!

A DOCTYPE (also called a DTD) is short for "document type declaration." It's a good idea to always explicitly declare the DOCTYPE at the beginning of your HTML or XHTML documents because the browser uses that information to properly to display the page elements and attributes in your code.

An incorrect or incomplete one can break your page display in some browsers.

More recent, standards-compliant browsers like Mozilla, Internet Explorer 6.x, and Netscape 6.x and up rely on a proper DOCTYPE definition to display Web pages. It's particularly important if you're coding in XHTML instead of basic HTML 4. Opera is much less forgiving because it always displays pages in standards compliant mode. It catches - and displays - mistakes that other browsers overlook. That's what makes it such a good browser for testing.

A missing DOCTYPE isn't a fatal error. Your page will still display in the browser, but maybe not how you expect. An incorrect DOCTYPE definition will often send the browser into something called "quirks mode."

Back To The Past In Quirks Mode

Quirks mode is an unusual thing. The browser forgets much of what it knows about World Wide Web Consortium (W3C) standards, CSS compliance, and the most recent Document Object Model (DOM). Instead, it renders the page according to the rules set by older browser versions like Explorer 4 or even Netscape 4.7.

It's as if your big screen TV were to suddenly begin showing nothing but black and white reruns of 1950's TV shows - in the size of those early televisions (approximately 9-10 inches).

The big problem: each current browser and browser version acts differently in quirks mode. A technique that looks fine in Explorer 6 may not display at all in Netscape 6 - even though it looks fine in Netscape 7. Since you can't predict what browser or operating system visitors may be using, you really can't predict what type of page display they'll get in quirks mode.

Browser Photo helps you find the problems because it shows you actual screen shots of your page in 16 different browsers, browser versions, and operating system combinations. But once you find the problems, you'll still need to fix them.

In some cases, that means adding or correcting your DOCTYPE so that the browser knows which version of HTML you want to use and how strictly you want to adhere to the standards.

Finding The Correct DOCTYPE

Many HTML editors automatically insert a DOCTYPE when you create a page. However, it isn't always the DOCTYPE you expect - or want.

For instance, HomeSite 4.5 automatically inserts this DOCTYPE:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">

Which is fine for pages written using HTML 4.0 that include some formatting tags like FONT, B, and I. But you'll need to modify the DOCTYPE whenever your design uses HTML 4.01, XHTML, or you create a frameset.

The W3C provides this listing of valid DOCTYPEs. It's pretty comprehensive, but most often you'll choose between just two, so we'll list them here:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

This is the "transitional" definition. You're telling the browser that you want to use HTML 4.01 standards to render the document, but that you may decide to slip in some deprecated tags for formatting instead of using only CSS for presentation. Deprecated tags are those that are marked for deletion in future versions of HTML/XHTML.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd">

The "frameset" mode also lets you use deprecated tags like FONT and CENTER and it adds the necessary support to help the browser render the frameset correctly.

Place your DOCTYPE definition at the very beginning of your Web page - even before the opening HTML tag. Type it very carefully! DOCTYPE definitions are capital-letter sensitive. The cut and paste method is far safer than typing it by hand at the beginning of each page.

The proper DOCTYPE could save you hours of frustration and debugging time. Isn't that worth the small effort it takes to add a single line of code to all your Web pages?



Rate This Tip:
Not Useful Useful Very Useful   
 
NetMechanic Tools
HTML Toolbox
Browser Photo
Server Check
Search Engine Starter
Search Engine Tools
GIFBot
Newsletter
HTML Tutorial and Tips
Search Engine Tutorial
Accessibility Information
Browser Problem Tutorial

Company Info
Products
About Us
Contact
Advertise
Link To Us
Jobs
Privacy Policy
Partner Programs
Press Room
RSS Feed
Support
 



Powered by Overture!

 
     
 
   
 
     


Keynote Home
Copyright © 1996-2010,
Keynote NetMechanic
All rights reserved.