Welcome, to the digital home of Keefe Tang

This is where I keep my opinions, code snippets & things I refer all in one place. If you have any questions feel free to drop me a line, if you don’t, how about subscribing to my feed.

what is doctype?

You always hear it—always start with strict doctype—but what is doctype? doctype is short for Document Type Definition or mostly referred to as dtd and it appears at the very beginning of the (x)html document in order to identify the content of the document as conforming to the particular dtd specification.

dtd provides a list of the elements, attributes, comments, notes, and entities contained in the document. It also indicates their relationship to one another within the document. In other words, a dtd is the grammar of an xml or html document, it tells applications like your browser or online code validator what type of markup you’ve coded into the page.

Syntax

Below is the doctype for xhtml 1.0 Strict & the syntax for doctype for comparison. 

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

 
  <!DOCTYPE [Top Element] [Availability] "[Registration]//[Organization]//[Type] [Label]//[Language]" "[URL]">
  1. [Top Element] – Indicates the top level element type declared in the dtd.
  2. [Availability] – Indicates if the identifier is a publicly accessible object (PUBLIC) or a system resource (SYSTEM) such as a local file or url. (x)html dtds are specified by PUBLIC identifiers.
  3. [Registration] – Indicated by either a “+” or “-”. A plus symbol indicates that the organization name that follows is iso-registered. A minus sign indicates the organization name is not registered. The ietf & w3c are not registered iso organizations and thus use a “-”.
  4. [Organization] – This is the “OwnerID”—a unique label indicating the name of the entity or organization responsible for the creation and/or maintenance of the artifact (dtd, etc.) being referenced by the doctype. The ietf & w3c are the two originating organizations of the official (x)html dtds.
  5. [Type] – This is the “Public Text Class”—the type of object being referenced. There are many different keywords possible here, but in the case of an (x)html dtd, it is “dtd”.
  6. [Label] – This is the “Public Text Description”—a unique descriptive name for the public text that is being referenced. If the public text changes for any reason, a new Public Text Description string should be created for it.
  7. [Language] – This is the “Public Text Language”—the natural language encoding system used in the creation of the referenced object. It is written as an iso 639 language code. (x)html dtds are usually written in English—“EN”.
  8. [URL] – This is the optional explicit url to the dtd being referenced.

why specify a doctype?

Because it defines which version of (x)html your document is actually using, and this is a critical piece of information needed by browsers or other tools processing the document. Tools such as the markup validator needs it to check the syntax of your (x)html or they won’t know what document it is checking.

Most importantly, modern browsers need that to determine the type of document it is dealing with. When a browser don’t know what document it is dealing with, it will fallback to quirks mode, browsers will attempt to guess at which language the document was written in and pages will be rendered much slower compared to the standard mode and often in error.

doctype list

The list of doctype are much more than what we normally use, w3c have the full list of doctype available to use. Some of the ones we normally use are.

html 4.01

Strict, Transitional & Frameset.

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

xhtml 1.0

Strict, Transitional & Frameset.

 
  <!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">

xhtml 1.1

 
  <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"  "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">

html 5

HTML 5’s doctype have a much simpler syntax.

 
  <!DOCTYPE html>