In the HTML document, you must have come across the <!DOCTYPE html> declaration at the start of the HTML document. It is always used at the start of an HTML or XHTML document. It is used to inform the browser that HTML elements are contained inside the given document.Â
It also instructs the web browser about the version of HTML the page used inside the document. It ensures that the page is parsed in the same way by different web browsers. Let us know about the significance of Doctype in HTML documents in this article.Â
What is DOCTYPE HTML?
An HTML or XHTML document begins with <!DOCTYPE> declaration used to inform the browser that the given document contains HTML elements. The declaration of DOCTYPE varies based on different versions of HTML. In HTML5, we can easily declare doctype elements at the beginning of an HTML document by using the given syntax.
| Doctype HTML |
| <!DOCTYPE html> |
The Doctype is not a tag or HTML element. It only passes the information to the web browser. The <!DOCTYPE html> element syntax is supported on multiple browsers, such as Chrome, Safari, Opera Mini, Mozilla Firefox, Bing, etc.
DOCTYPE HTML: Key TakeawaysÂ
Check out some of the important highlights mentioned below.
- In HTML5, the doctype element is declared with <!DOCTYPE html>.
- It is supported on different web browsers, such as Chrome, Safari, Opera Mini, Mozilla Firefox, Bing, etc.
- The doctype element is used to specify the version of the HTML document contained inside.
- The HTML doctype is case insensitive.
- The DOCTYPE declaration must be used in the first line of code in the HTML document.
- It is also known as Document Type Declaration (DTD).
- The <!DOCTYPE > is not a tag or element. It is used to inform the browser about the document type.
- It does not contain a closing tag. It must not contain any content inside.Â
Format of HTML Document ElementsÂ
Check the table below for the structure of the HTML Document given below.
| Doctype HTML Format |
| <!DOCTYPE html> Â Â //Used to tell the type of document to the web server
<html> <head> <title> Document HTML Type </title> </head> <body> </body> </html> |
Is Doctype HTML Case Sensitive?Â
The <!DOCTYPE> declaration is not case-sensitive. Hence, you can write it in lowercase and the browser will recognize it as an HTML doctype declaration. But we should use capitalized doctypes as used in the official documents.Â
| Doctype HTMLÂ |
| //All of these given syntaxes are valid.
<!DOCTYPE html>Â Â Â Â Â Â Â Â Â Â Â Â Â Â Â Â Â Â Â Â <!DocType html> <!Doctype html> <!doctype html> |
Older HTML Documents Declaration
In earlier HTML documents, the declaration of DOCTYPE was a little more complicated to tell the web browser that the type of document inside is HTML.Â
1. DOCTYPE HTML 4.01 Strict
The DOCTYPE in HTML 4.01 is placed at the top of the HTML document. The URL inside the Doctype declaration consists of all elements and attributes used in the document. The strict part does not allow any deprecated elements and attributes.
| <!DOCTYPE HTML PUBLIC “-//W3C//DTD HTML 4.01//EN” “http://www.w3.org/TR/html4/strict.dtd”> |
2. DOCTYPE HTML 4.01 TransitionalÂ
This doctype element 4.01 is also placed at the top of the HTML document. The URL reference represents the elements and attributes used inside the document. Also, the loose part means that it allows some of the deprecated elements or attributes.
| <!DOCTYPE HTML PUBLIC “-//W3C//DTD HTML 4.01//EN” “http://www.w3.org/TR/html4/strict.dtd”> |
3. DOCTYPE HTML 4.01 FramesetÂ
This doctype HTML is used as a frameset, which contains more than one frame element. These frame elements tell the browser about the number of screen divisions that occur inside the page.
| <!DOCTYPE HTML PUBLIC “-//W3C//DTD HTML 4.01 Frameset//EN”
   “http://www.w3.org/TR/html4/frameset.dtd”> |
4. XHTML 1.1
The DOCTYPE element used in the XHTML document allows the addition of module frameworks and modules defined in the XHTML modularization.Â
| <!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.1//EN” “http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd”> |
Example of HTML DocumentÂ
Let us check out a basic example of an HTML5 document with DOCTYPE elements used at the top to understand the standard way of writing an HTML document.
| Doctype HTMLÂ |
| <!– The DOCTYPE element used at the top tells the type document element→
<!DOCTYPE html> <html lang=”en”> <head> Â Â Â Â <meta charset=”UTF-8″> Â Â Â Â <meta http-equiv=”X-UA-Compatible” content=”IE=edge”> Â Â Â Â <meta name=”viewport” content=”width=device-width, initial-scale=1.0″> Â Â Â Â <title>Standards of HTML </title> </head> <body> Â Â Â Â <p>This is a basic example of HTML Document.</p> </body> </html> |
Learn Full Stack Web Development with PW Skills
Want to start a career as a web developer, then Enrol in our Full Stack Web Development Course and learn major aspects of web development with our experienced mentors, interactive coursework and hands-on learning experience.Â
Get more than 200+ hours of learning, doubt session support, PW Lab access, module assignments, industry experts-led live sessions, certifications upon completion and 100% placement assistance all within a single course only at pwskills.com
DOCTYPE HTML FAQs
What is a DOCTYPE html element in an HTML Document?
DOCTYPE html element is used at the top of an HTML document to declare the type of elements contained inside the document to the web browsers.
Is DOCTYPE HTML element case sensitive?
The declaration is not case-sensitive. Hence, you can write it in lowercase and the browser will recognize it as an HTML doctype declaration.
Do Doctype HTML elements consist of closing tags?
DOCTYPE elements are null-type elements which do not consist of any content and closing tags.
How is Doctype declared in HTML5 documents?
In HTML5 documents, a doctype is declared with the tag. However, in earlier versions of HTML, the declaration of doctype was a little more complex.
