w3resource

DOCTYPE HTML 4.01 tutorial

What is DOCTYPE?

Document Type Declaration or DOCTYPE declares which version of HTML is being followed by the document in question. Each version of HTML has its own set of rules, exclusions and inclusions. If an HTML document follows the rules specified in a particular version of HTML, then it is called valid HTML document. It is always a good practice to design valid HTML pages. An invalid HTML page, fails to be read properly by a search engine, causing it a unpopular website.

In HTML version 4, there are three types of DOCTYPES can be used: strict,transitional and frameset.

In this tutorial, we will discuss all these categories with adequate examples to help you to understand how to declare a doctype in an HTML page and how a valid HTML page looks like. We will also see how to check the validity of an HTML page. But before that, we will discuss the doctype itself, rather than categories of doctype.

DOCTYPE comes at the top of an HTML document. all other elements come after it. In an HTML page, doctype declaration can come once only.

Here is a graphical representation of different sections of a Doctype declaration:

Pictorial presentation of HTML DOCTYPE

Click here to see the enlarged image.

dtd diagram

Example of HTML doctype declaration

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head><title>w3resource tutorial</title></head>
<body>
<h1>we are learning html</h1>
<h2>we are learning html at w3resource.com.</h2>
<p>This section covers the introduction to html</p>
<p><a href="/index.php">Look here to get a list of the topics covered in
w3resource.com</a></p>
</body>
</html>

In this example HTML code, at the top of the document, doctype is being declared.

We will see now, what are the different parts of the doctype means (each of the keywords mentioned in the left hand side of the : delimiter expresses a placeholder or field which may vary according to the declaration, and the description given on the right hand side of the : delimiter states about what does that field or place in the doctype declaration mean):

">HTML: This indicates the top level element type declared in the Doctype declaration.

Since this is an HTML document, so the top-level element is <html>.

PUBLIC: This indicates whether the identifier is a publicly accessible object (PUBLIC) or a system resource (SYSTEM) such as a local file or URL. HTML/XHTML DTDs are specified by PUBLIC identifiers, where as XML DTDs can be PUBLIC or SYSTEM.

- : 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 and W3C are not registered ISO organizations and thus use a "-".

W3C: This is the "OwnerID" - a unique label indicating the name of the entity or organization responsible for the creation and/or maintenance of the DTD referenced by the DOCTYPE. The IETF and W3C are the two originating organizations of the official HTML/XHTML DTDs.

DTD: 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 HTML/XHTML DTD, it is "DTD" - a Document Type Definition.

HTML 4.01 Transitional : This is the "Public Text Description" - a unique descriptive name for the public text (DTD) being referenced. If the public text changes for any reason, a new Public Text Description string should be created for it.

EN: 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 (uppercase, two letters.) HTML/XHTML DTDs are usually (always?) written in English ("EN".)

URL: This is the optional explicit URL to the DTD being referenced.

HTML 4.01 strict doctype

This is strict version of HTML 4.01 doctype. HTML 4.01 Strict Doctype does not allow presentational attributes to be written within HTML Elements.It also does not support inclusion of Frames.

Example of HTML 4.01 strict doctype

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

HTML 4.01 strict doctype declaration does not allow frameset, target link to be included in the HTML document.

HTML 4.01 transitional doctype

HTML 4.01 Transitional is a derivative of HTML 4.01 Strict doctype declaration, allowing users to use certain elements and attributes which are not allowed to be used in strict doctype.

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

This is a doc type declaration for transitional doctype declaration.

HTML 4.01 frameset doctype

HTML 4.01 Frameset is a derivative of HTML 4.01 Transitional doctype declaration, allowing users to use frames. In an HTML document using Frameset doctype, body element is replaced by frameset element.

Here is how you can declare a frameset doctype in an HTML document.

Example of HTML 4.01 frameset doctype

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

HTML 4.01 Validation

If your HTML document contains HTML codes according to the rules specified by w3c, then your HTML document is called as a valid HTML document.

w3resource always encourage you to write valid HTML codes. Infact all the pages of w3resource.com are valid xhtml 1.0 pages.

There are several ways to check if your HTML code is valid.

If you search using "w3c validation ", it takes you to the validation service offered by w3c. There are three ways to check if your HTML code is valid in w3c validation service.

1) You can provide the url of your HTML document.

2) You can directly input the HTML code to be validated.

3.) You can upload the HTML file and check validation

w3c validation service not only checks if your HTML code is validated, but also offers suggestions to rectify if any portion of your HTML code is not satisfying the validation.

Previous: HTML comments
Next: HTML html tag and element

Test your Programming skills with w3resource's quiz.



Follow us on Facebook and Twitter for latest update.