All About The HTML Doctype

About This Snippet
So, what is a Doctype? A Doctype is the first line in an HTML, XHTML or XML document which informs a web browser as to what kind of document to expect. This subsequently instructs a web browser as to how to render the document. It would be remiss to not go into some history as to how the Doctype came into existence, but more on that later (see “Geeking Out” below).

Some things to keep in mind:

The Doctype is supported in all major browsers (think: Chrome, Edge, Firefox, Safari and Opera).
It technically is not an HTML tag, even though it has similar syntax.
The older HTML 4.01 Doctype took on multiple scopes (I.e. strict, transitional or frameset) which either permitted or disallowed specific behaviors.
Similar to HTML, the Doctype is case-insensitive, but often is notated in all-caps (I.e. DOCTYPE).

The Snippet
For HTML5 use:

<!DOCTYPE html>

(Note: This Doctype is the simplest and most common. It is used for most HTML based applications.)

For Transitional HTML 4.01 use:

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

(Note: This Doctype is legacy and permits both presentation and deprecated elements, while disallowing the use of framesets.)

For Frameset HTML 4.01 use:

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

(Note: This Doctype is legacy and permits both presentation and deprecated elements, while also allowing the use of framesets.)

For Strict HTML 4.01 use:

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

(Note: This Doctype is legacy and forbids the use of presentation and deprecated elements, as well as framesets.)

For Final HTML 3.2 use:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 3.2 Final//EN">

(Note: This Doctype is legacy and identifies a document adhering to the HTML 3.2 standard)

For Transitional XHMTL 1.0 use:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

(Note: This Doctype is the XML equivalent of HTML 4.01 Transitional, it requires the use of well-formed XML while also possessing similar features made available with HTML 4.01 Transitional.)

For Strict XHTML 1.0 use:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

(Note: This is the XML equivalent of HTML 4.01 Strict, it requires the use of well-formed XML and adheres to a strict XML specification.)

Geeking Out
Older Doctypes, such as those for HTML4, XHTML and earlier would require what was called a Document Type Definition (DTD), but with the advent of HTML5, this no longer became necessary and was simplified. So, why do we need a Doctype and how did it come into existence? Well, in the early “wild west” days of the Internet, there were somewhat loose standards in place for web browsers to follow in rendering an HTML document (Think HTML 3.2 and earlier). Although specification existed, the manner in which it was implemented wasn’t necessarily consistent from web browser to web browser and this had its affect on how web pages were rendered.

In building out web pages, there were all sorts of quirks that existed and it created a real hassle for early web developers to engineer a web page that could take on a visual aesthetic consistent across web browsers. Sometimes there would be issues where characters would wrap when they weren’t supposed to; issues where certain properties would be adhered to or recognized in one web browser, but not in another (E.g. from that era, Microsoft Internet Explorer versus Netscape Navigator versus Quarterdeck Mosaic).

This landscape of “standards” discontinuity created a real hassle to be reckoned with when building out websites. Although, the Doctype existed all the way back to HTML 2.0, in practice, the Doctype was rarely used in the early days of Web Development. This pattern changed in the mid to late 1990s with the commercialization of the Internet and the introduction of HTML 3.2. With these transitions, it became more common practice to begin including a Doctype in an HTML document.

Moreover, in the late 1990s XML was introduced. Its presence more broadly necessitated web browsers to differentiate the type of document being handled. XML specification had its influences on HTML 4.01 with its attention on the document being well-formed, having stricter rules to adhere to. With this, came the advent of XHTML, which essentially was HTML having been reformulated to adhere to the stricter standards and disciplines of XML. This influence continued throughout the 2000s, up until the point that HTML5 was drafted, specified and published.

SnippetNinja provides articles with snippets on various topics. These articles are written to facilitate education and learning in technology. Click here to read more about SnippetNinja and the content provided on this site.