Wednesday, October 27, 2021

Using the DOCTYPE Tag

Having trouble with your Web pages? Can’t get them to display correctly in
your browser? It might be that your page is a little “quirky.”

There are several reasons why Web pages do not display properly, such as omitting
a required end tag, improperly formatting a table, JavaScript errors, CSS errors,
incorrect server requests, etc. Often, these errors happen because Web developers
do not take the time to validate their work. In other cases they are a result
of a lack of knowledge regarding the proper formatting and coding of Web pages.

Even if you take care of all these errors, something else may be causing your
Web pages to display incorrectly or even not at all: failure to use a <DOCTYPE>
statement or, if used, failure to use the right one.

A large number of Web pages don’t use the <DOCTYPE> statement
(Interestingly, many of them are Web development sites). Does it really make
a difference? For the most part, not much. But if you want to make sure your
Web site renders correctly in various browsers, then it’s best to use it. You’ll
also need it if you plan on validating
your Web pages.

The Modes

In an effort to contend with Web pages written for older browsers, the newer
browser versions (Mozilla-based browsers, Netscape 7, Windows Internet Explorer
6, Mac Internet Explorer 5, Opera 7, and Safari) have two types of presentation
modes: standard and quirks. Using the standard mode,
the browser tries to follow W3C recommendations. When the browser goes into
quirks mode, it’s trying to emulate an older version of the browser.
This could cause the browser to ignore your page’s style sheets and render the
page unusable (Mozilla and Safari also have a third mode: almost standards
, which mainly pertains to the vertical sizing of tables).

What Is It?

The <DOCTYPE> declaration tells the browser what version of
(X)HTML is being used so it will know how to display the page. The declaration
may also provide a link to a text file (i.e., the
loose DTD
) which the browser uses to obtain further information. It’s similar
to having a tune-up done on your car. In order to perform it correctly, the
mechanic must know the make, model, and year of the car. He must also know how
many cylinders the engine has and its horsepower. Once he knows this, he can
move forward and properly tune the engine.

The Specs

The W3C HTML 4.01 and XHTML 1.0 specifications state that the <DOCTYPE> is required in all documents.

The W3C sets the specifications for common protocols used on the Web. This
helps to ensure that each Web site is accessible to the various user agents
(browsers/viewers/readers). Technically, there are no standards regarding Web
site development in relation to coding. There are only “specifications,"
or, as the W3C calls them, “recommendations." These specifications, however,
are seen by most Web developers, as well as the creators of user agents, as
being on a par with standards. Most of the current browsers (i.e., Firefox,
Opera, Safari) are beginning to closely follow the specifications.

If you follow the recommendations, your Web pages (for the most part) will
work correctly. If they don’t, it’s easier to get help when you are following
the rules instead of having to explain the way that you did it. If the specs
are not followed, it’s more of a hit-and-miss game. You’ll need to figure out
what works and what doesn’t. Then you’ll have to recheck all of your Web pages
on all of your Web sites each time a new browser hits the streets to make sure
that your non-standard code works in it.


The <DOCTYPE> declaration must be the very first thing in
your document, before the <html> tag. Then, when the browser
begins to load the page, it knows how to treat the code within the page.

There are three different document types for HTML 4.01: Strict, Transitional, and Frameset. The Strict type is used with Cascading Style Sheets and helps to ensure clutter-free coding.


The Transitional type is used when HTML presentational features are included in the document instead of in a style sheet. This is done to accomodate older browsers that don’t support CSS.

<!DOCTYPE HTML PUBLIC “-//W3C//DTD HTML 4.01 Transitional//EN”

The Frameset type is used in documents that have frames.

<!DOCTYPE HTML PUBLIC “-//W3C//DTD HTML 4.01 Frameset//EN”

The same three document types are also used in XHTML 1.0:

<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Strict//EN”

<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN”

<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Frameset//EN”

Since the <DOCTYPE> declaration is actually a comment tag,
it won’t confuse older browsers that don’t understand the statement.

Additional Information

Popular Articles