Essential HTML Meta Data

Doctype

Doctype isn't technically a Meta attribute, but this is still a relevant time to discuss it. What Doctype does is tell the web browser what HTML or XHTML specification you used to code your web page. There are several options here, namely HTML Strict, HTML Transitional, and HTML Frameset, and the same three options for XHTML, giving a total of six choices.

So which one should you choose? Well, everything you see on this site adheres to the XHTML Transitional specification. This is a good choice, because it adheres to the vast majority of the latest standards, while still giving you access to some useful properties which haven't yet been replaced with pure CSS

You should use the XHTML Frameset document type if you have coded HTML frames into your page. Frames are a way to divide up your page into separate windows, but there are much better ways to achieve this type of layout, namely by using CSS. You won't find any reference to frames on this site because it is much better to stick to CSS instead.

If you are following the examples on this site then you should always use an XHTML specification rather than a plain old HTML specification; old HTML won't recognize half of the things we have learned on this site because we have been learning the newer, and better, XHTML. Therefore just avoid using an HTML document type completely.

Ok, now we've covered all of that, how do you go about declaring a document type in your HTML web page?

A Doctype declaration consists of two small lines of HTML - the first to tell the web browser what specification you are using, and the second to tell it where it can find the rules of this specification. For XHTML Transitional (the one we've been using on this website), the declaration is as follows:

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

That all looks a bit complicated but we don't really need to understand how it works; we just need to put it at the very top of our HTML web pages, above everything else, even the opening <html> tag. Incase you were wondering, the letters DTD, which appear several times in the Doctype declaration, stand for Document Type Declaration - obvious when you think about it!

If you want to use the XHTML Strict Doctype then you need the following code:

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

If you want to use any of the other Doctypes then you'll have to find them elsewhere because I refuse to print them :P But seriously, you really should be using the Strict or Transitional Doctypes whenever possible.

Meta Content-Type

The Meta content-type attribute is used to tell the web browser what character set should be used to display the web page. The character set simply describes how to interpret the code into letters and symbols. If you specify the wrong content-type you may end up with the wrong symbols being displayed on your web page.

Although web browsers will almost always display content properly without specifying the Meta content-type, it is now considered a required element, and seeing as we are trying to conform to the latest standards, it makes sense to include it. Don't worry if you don't fully understand it, just try to remember to include this in your <head> section:

<Meta http-equiv="content-type" content="text/html; charset=ISO-8859-1" />