What does <!doctype html> do? - html

What does this tag do?
<!doctype html>
I can see that with this tag on top, my HTML behaves in another way than without.
How do I know if I need this tag?

It's an integral part of HTML as defined in the specification:
8.1.1 The DOCTYPE
A DOCTYPE is a required preamble.
DOCTYPEs are required for legacy reasons. When omitted, browsers tend to use a different rendering mode that is incompatible with some specifications. Including the DOCTYPE in a document ensures that the browser makes a best-effort attempt at following the relevant specifications.
Edit to add:
What does this seatbelt do?
What I can see is that, with this seatbelt on, my car behaves the same way as without. How do I know if I need this seatbelt?
You wont know if you'll need it until something goes wrong and you don't have it.

DOCTYPE Declaration is the abbreviation for Document Type Declaration (DTD).
The DOCTYPE Declaration (DTD or Document Type Declaration) does a couple of things:
When performing HTML validation testing on a web page it tells the HTML (HyperText Markup Language) validator which version of (X)HTML standard the web page coding is supposed to comply with. When you validate your web page the HTML validator checks the coding against the applicable standard then reports which portions of the coding do not pass HTML validation (are not compliant).
It tells the browser how to render the page in standards compliant mode.
If the web page coding does not include a DOCTYPE Declaration (DTD or Document Type Declaration) or it is done incorrectly:
You will not be able to use a HTML (HyperText Markup Language) Validator to check the page coding. HTML validation requires the DOCTYPE declaration.
The browser rendering the webpage will process the coding in Quirks Mode.
The stylesheet may not be implemented as planned.
Which DOCTYPE should you use?
If you are a beginner to HTML (HyperText Markup Language) then I would suggest you use the HTML 4.01 Transitional declaration. It is much more forgiving for the beginner when performing HTML validation. You would also use this declaration if you know that your audience will not have a browser that supports CSS (Cascading Style Sheets).
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
This DOCTYPE declaration still allows elements and presentation attributes that should be in the stylesheet.
If you want to learn to code in preparation for the future but still not ready for XHTML then you would use the Strict declaration.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
With this declaration all presentation attributes are moved to the stylesheet.
A complete list of DOCTYPE Declarations (DTDs) is available at List of valid DTDs you can use in your document.

The doctype declaration should be the very first thing in an HTML
document, before the tag.
The doctype declaration is not an HTML tag; it is an instruction to
the web browser about what version of the markup language the page is
written in.
The doctype declaration refers to a Document Type Definition (DTD).
The DTD specifies the rules for the markup language, so that the
browsers render the content correctly.
Quote from here: http://www.w3schools.com/tags/tag_doctype.asp
:)

A Doctype declaration triggers standards mode in your browser and should always be used. Quirks mode should always be avoided.

Browser war and two modes
To understand the significance of DOCTYPE, let us dig into some history starting from the days of browser wars. During those days web pages were written in two different versions to support both Internet Explorer and Netscape Navigator.
But then W3C took over defining Web standards. But sadly, browsers with new standards were not able to render web pages built for legacy browsers. So, to support the website built for legacy browsers quirks mode was introduced. In which the browser assumes you’ve written old-fashioned, invalid markup and code per the depressing industry norms of the late 1990s.
To differentiate those website from the new ones, DOCTYPE was added, which gave the browser a signal that this web page should be rendered in standards mode.
HTML5 and HTML 4.01
Prior to HTML5, the HTML was SGML-based which required a document type definition (DTD) to establish rules and grammar for markup. Thus, doctype had other information about the document type definition (DTD).
However, with introduction of HTML5 the DOCTYPE is the only thing needed to enable the standards mode.

To make it simple: <!DOCTYPE HTML> states that the code is HTML.

Related

Necessary for the URL in html DOCTYPE?

I have a question regarding html doctype, is the url for doctype necessary? I saw it in some production codes that has only
!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
without the URL like
"http://www.w3.org/TR/html4/loose.dtd">
I understand that doctype will let browser determine layout mode, either standard or quirk mode, but im uncertain whether do we need the url, does it make difference without the url?
The DOCTYPE header tells your browser what version of html the webpage is written in..Hence the browser will try to interpret the content of the page based on the version...with html4 and below the doctype string is needed.
However With HTML5 there is no need for a reference string..you can simply use
<!doctype html>
short simple and easy
(The DOCTYPE is retained in HTML4 as a "mostly useless, but required" header only to trigger "standards mode" in common browsers)
It is valid HTML 3.2 to omit the URL. Probably not valid HTML 4 however
source
If you have noticed <!doctype html>, that's to indicate HTML5.
Doctype has a public identifier (e.g. -//W3C//...) followed by system identifier (e.g. http://www.w3c...). Notice that HTML2 and HTML3.2 had no system identifier (http://www.w3.org/QA/2002/04/valid-dtd-list.html). Otherwise you have to use a system identifier URL to call the doctype correct.
http://www.w3schools.com/tags/tag_doctype.asp provides some more literature regarding doctypes. Also note an interesting list of doctypes here: https://www.totalvalidator.com/support/doctypes.html. W3C documention is here: http://dev.w3.org/html5/html-author/
In HTML 4.01, the <!DOCTYPE> declaration refers to a DTD, because HTML 4.01 was based on SGML. The DTD specifies the rules for the markup language, so that the browsers render the content correctly.
HTML5 is not based on SGML, and therefore does not require a reference to a DTD.
but add the <!DOCTYPE> declaration to your HTML documents, so that
the browser knows what type of document to expect.
Like as follows :
<!Doctype html>
What you mentioning about is "<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">"
This DTD contains all HTML elements and attributes, INCLUDING presentational and deprecated elements (like font). Framesets are not allowed.

Will the browser download the DOCTYPE .dtd file?

I know that the DOCTYPE(s) give the browser the list of allowed elements(tags) and attributes.
But i want to know that when you use:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
Will the browser go and download the dtd file or it just a sign that the browsers understand that the type of the HTML is HTML 4(strict).
What about HTML 5 DOCTYPE:
<!DOCTYPE html>
Thank You.
Browsers do not download DTD files. There is no prohibition, but they just don’t use DTDs at all, and they are not required at all. The doctype declarations matter only as “magic strings”, which trigger standards, almost standars, or quirks mode in the browser; this is based solely on the string as such, without accessing any DTD file.
The doctype declarations are a holdover from the time when HTML was defined nominally as an application of SGML – something that was never implemented. An SGML processor is allowed to read a DTD and perform validation against it; it will then be called a validating SGML processor. But browsers never did that. Instead, HTML authors may use separate validators (which only validate, without displaying the document at all).
The doctype declarations have been kept because browser vendors once decided to use the presence or absence of such declarations, and their exact form (as strings), when deciding whether the document should be rendered in “standards mode” or “quirks mode”. HTML5 follows this tradition, although in HTML5, it’s not even nominally a declaration of any kind, just a “doctype string”.

Multiple Doctypes in a single HTML Document

If a HTML document has two doctypes, how will the doctypes affect the rendering of the page and which doctype would the browser pick? Is having two (or more) doctypes in a single document valid or confusing?
Example:
<!DOCTYPE html>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" >
<html>
</html>
Only a single doctype declaration is permitted. This follows rather directly from the HTML specifications as well the HTML5 drafts, and it can also be checked using a validator.
Thus, there is no specification of what should happen. The natural expectation is that since browsers process the doctype declaration only in “doctype sniffing” when deciding on the browser mode (Quirks Mode vs. Standards Mode), only the first doctype declaration takes effect and the other is ignored.
This can be tested e.g. as follows (using an HTML 3.2 doctype, which triggers Quirks Mode on all doctype-sniffer browsers):
<!DOCTYPE HTML>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 3.2 Final//EN">
<html>
<title>Testing duplicate doctype effect</title>
<script>
document.write(document.compatMode);
</script>
</html>
This displays “CSS1Compat” (= Standards Mode), whereas swapping the doctype declarations causes “BackCompat” (= Quirks Mode).
I believe the very first DOCTYPE is used by the browser and it's against the specification to have more than one in a document.
I think (not sure) that the only situation when multiple DOCTYPE-s may be valid is when using IE conditional comments. Browsers other than IE won't see those, of course.
I remember reading a blog entry (can't find it now, so I may be wrong in this) but some (most?) browsers even ignore the DOCTYPE if it's not the first thing they encounter. (This may have been a bug that got fixed since.)
Here's W3School's reference page about DOCTYPE:
http://www.w3schools.com/tags/tag_doctype.asp
If you have multiple DOCTYPE-s in your HTML page then browser will consider first one, browser parse the DOM line by line. Once browser get DOCTYPE then it will stop looking for other doctypes and will jump to search for HTML tag.
In the above question HTML-5 DOCTYPE is mentioned first and then
HTML-4, according to this browser will render things as HTML-5 doctype
It is better to try once in http://www.w3schools.com/ ... Try to use 'code' or 'kbd' or 'dfn' or 'samp' or 'strong' tag by mentioning both doctypes by priority.

Are there different HTML5 doctypes?

When I use to write pages in XHTML. I had 3 types of doctype - strict, transitional and frameset.
Do we have them in HTML5?
the html5 doctype is
<!DOCTYPE html>
When you use the new HTML5 DOCTYPE, it triggers browsers to render the page in standards compliant mode.
Standards-compliant mode
In standards-compliant mode, the web browser assumes the page has been authored to the web content specification declared; code that does not conform to the declared standard may not display, or may display incorrectly.
For a web browser’s standards-compliant mode to be triggered, the webpage must have a complete document type declaration, including the URI to the document type definition (DTD).
There is typically less variation in webpage display between different browsers when standards-compliant mode is triggered, as the same centralised W3C specification is used as a reference when creating the web browser software.
Courtesy this link
No, the HTML5 doctype
<!DOCTYPE html>
is unique, since it was chosen as the shortest doctype (string) able to turn all current browser (even IE6, afaik) in standard mode (and it can be written in upper/mixed case)
HTML 5 requires a doctype for legacy compatibility. It has a short doctype <!DOCTYPE html> and a long doctype <!DOCTYPE html SYSTEM "about:legacy-compat"> The long doctype is only for systems that cannot generate the short one. - HTML 5 specification
No, HTML5 is just HTML5, there are no subsets.
There is but one:
<!DOCTYPE html>
The standard required preamble in the HTML serialisation of HTML5 (i.e. when served as text/html) is
<!DOCTYPE html>
Some HTML generators, most notably XSLT, have difficulty creating the above doctype. They may use
<!DOCTYPE html SYSTEM "about:legacy-compat">
In the XML serialisation of HTML5 (i.e. when served as application/xhtml+xml), the doctype may be either of the above, or it may be omitted entirely.
Note that these variations are not like strict, transitional or frameset. What is valid and invalid in HTML5 is the same for each of the above variations - leaving aside the orthogonal matter of differences between HTML and XML syntax.
HTML5 has only one and that is:
<!DOCTYPE html>

Is it safe to change to the HTML5 DOCTYPE?

My site is currently using:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
However, things like Facebook plugins are only valid in HTML5. So, is it safe to change my DOCTYPE to <!DOCTYPE html>? Will this affect anything?
Yes you can change your DOCTYPE,it will not affect anything that you have already done.In HTML 5 you will get some new features which you can use for your future purpose.Just check this link and you will get some idea about the features present in HTML 5
You can change it. Almost all browsers just look for html in the doctype to ensure they are parsing HTML. It will also remain the same with new versions of HTML.
You might want to do the following quick changes to the head element:
Change the meta element to <meta charset="utf-8">.
Drop type="text/css" when linking stylesheets and drop type="text/javascript" in script elements as these are the default values.
Change your DOCTYPE as you said, it shouldn't affect what you've already done in HTML4, but it does give you options of some of the new HTML5 features in future.
The only thing that such a doctype change will affect is validation. Other than that, the doctype declaration only affects browser mode (quirks / almost standard / standard), and XHTML 1.0 and HTML5 doctype have the same effect in this respect.
If you don’t use a validator, there is no reason to change. If you do, you should select the doctype according to which HTML version your document is closer to. Besides, HTML5 validation is completely different from XHTML 1.0 validation (heuristic mixed-strategy checking vs. formal well-defined but limited checking).
It shouldn't affect anything, but it's considered good markup to leave it as it is. HTML5 should work anyway.