To Temple College Class  logo R. Craig Collins > Web Page Design > Doctype and Meta head tags

doctype and Meta head tags © R. Craig Collins, 2005/6

If you are using an HTML editor, not doubt you have seen that it adds a doctype and meta tags to your file. These tools simply tell you browser what to expect in the way of HTML (doctype), and at the very least, the language the page was created in (one use of the meta tag).

The practical use in this class is that frames are much more advanced than basic HTML, so you should include a frame doctype.

DocType

According to new HTML standards, each HTML 4.x document requires a document type declaration. The 'DOCTYPE' begins the HTML document and tells a browser or validator which version of HTML to use in checking the document's syntax.

The following DOCTYPEs are commonly used:


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
This declares the document to be HTML 4.01 Strict. HTML 4.01 Strict is a trimmed down version of HTML 4.01 that emphasizes structure over presentation. Deprecated elements and attributes (including most presentational attributes), frames, and link targets are not allowed in HTML 4 Strict. By writing to HTML 4 Strict, authors can achieve accessible, structurally rich documents that easily adapt to style sheets and different browsing situations. However, since many browsers lack full support for style sheets, HTML 4 Strict documents may look bland on older visual browsers such as Netscape Navigator 3.x.

Newer browsers such as Internet Explorer 5 for Mac, Netscape 6, and Mozilla use a standards-compliant rendering for HTML 4 Strict documents. These browsers use a 'quirks' mode for most other document types to emulate rendering bugs in older browsers.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
This declares the document to be HTML 4.01 Transitional. HTML 4 Transitional includes all elements and attributes of HTML 4 Strict but adds presentational attributes, deprecated elements, and link targets. HTML 4 Transitional recognizes the relatively poor browser support for style sheets, allowing many HTML presentation features to be used as a transition towards HTML 4 Strict.

Newer browsers such as Internet Explorer 5 for Mac, Netscape 6, and Mozilla use a standards-compliant rendering for HTML 4.01 Transitional documents that include the URI of the DTD in the DOCTYPE. These browsers use a "quirks" mode to emulate rendering bugs in older browsers if the URI is omitted:

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

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd"> This declares the document to be HTML 4.01 Frameset. HTML 4 Frameset is a variant of HTML 4 Transitional for documents that use frames.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
This declares the document to be XHTML 1.0 Strict. XHTML 1.0 Strict is an XML version of HTML 4 Strict.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
This declares the document to be XHTML 1.0 Transitional. XHTML 1.0 Transitional is an XML version of HTML 4 Transitional.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">
This declares the document to be XHTML 1.0 Frameset. XHTML 1.0 Frameset is an XML version of HTML 4 Frameset.

Meta

Aside from describing the character set used (language the web page was created in),
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> for English,
many search engines use the meta tag, nested in the <HEAD> to find data to include in the search engine database.

There are many variations
<meta name="description" content="your info">
Which allows the search engine to capture a description you create, and
<meta name="keywords" content="your info">
Which allows the search engine to capture keywords you designate.

Some Search engines simply take the first 25 words or so that appear on your page.

There are other <META> tags, as well, such as
<META http-equiv="PICS-Label" content='(PICS-1.1 [set by ratings bureau]r (n 0 s 0 v 0 l 0))'>
Which allows the browser to detect parental control ratings (See RSACi), and
<META HTTP-EQUIV="REFRESH" CONTENT="x; URL=y">
Which allows you to automatically jump to another page 'y' after 'x' seconds.
(You could even force the current page to be reloaded...)