Menu
I would like to place a comment (<!-- this --> style) at the very top of my HTML code, preceding the DOCTYPE declaration. Does this conform to the standards? Is it supported by the major browsers? Are there any pitfalls in doing this?
615
All HTML documents must start with a <! DOCTYPE> declaration. The declaration is not an HTML tag. It is an "information" to the browser about what document type to expect.
The HTML document type declaration, also known as DOCTYPE , is the first line of code required in every HTML or XHTML document. The DOCTYPE declaration is an instruction to the web browser about what version of HTML the page is written in. This ensures that the web page is parsed the same way by different web browsers.
@Matheus - No it isn't. The <! DOCTYPE> declaration is just a mode switch between quirks, almost standards, and standard modes. Browsers do not care about the version of HTML on the page, just like they don't care about the version of JavaScript or the version of CSS in their respective documents.
The absence of the DOCTYPE or its incorrect usage will force the browser to switch to quirks mode. It means that the browser will do its best to layout the page that is considered to be old or created against web standards.
It is fully valid to do
<!-- this, --> <!DOCTYPE html> However, it brings all versions of IE into quirks-mode (unless it is forced into no-quirks mode — see the Gotchas section below). The simplest is to move the comment below the DOCTYPE.
<!DOCTYPE html> <!-- this, --> But another way is to “upgrade” the comment into a suitable conditional comment, such as this:
<!--[if !IE]> this <![endif]--> <!DOCTYPE html> Explanation: a conditional comment does not count as a comment, in IE's world.
Alternative syntax: To forget/remember that conditional comments are a Microsoft intrusion into the HTML standard, one could for instance do
<!--[if anybrowser]> this <![endif]--> <!DOCTYPE html> Likewise, to target IE in particular, one could do
<!--[if !anybrowser]> this <![endif]--> <!DOCTYPE html> Gotchas
A comment inside a conditional comment will bring IE into quirks-mode if IE sees it (that is: if one uses an [if IE] condition, or an equivalent to [if IE] — such as the [if !anybrowser] condition that I mentioned above.). So, for example, this would bring IE in quirks-mode:
<![if IE]><!-- this --><![endif]> <!DOCTYPE html> As would
<!--[if IE]><!--><!-- this <![endif]--> <!DOCTYPE html> and many other variants. Whereas for example
<!--[if IE]><!DOCTYPE html><!--><!-- this <![endif]--> <!DOCTYPE html> would not cause quirks-mode, because here the conditional comment has a DOCTYPE before any other content, and thus IE considers that the first content of the page is a DOCTYPE.
Finally, the newest IE versions, IE8 and IE9, can be forced to standards-mode (and to quirks-mode as well) by the use of another Microsoft invention — the x-ua-compatible directive. See http://msdn.microsoft.com/en-us/library/cc288325(v=vs.85).aspx In that case, then
<!-- this --> <!DOCTYPE html> <!--[if IE]><meta http-equiv="X-UA-Compatible" content="IE=8" ><![endif]--> will force IE8 and IE9 into no-quirks mode, while IE6 and IE7 will remain in quirks mode. Whereas, in contrast, this
<!--[if gte IE 8]><meta http-equiv="X-UA-Compatible" content="IE=8" ><![endif]--> <!DOCTYPE html> would force IE8 and IE9 into standards mode, despite that the content of the conditional comment does not start with a DOCTYPE. And IE6 and IE7 will also remain in no-quirks mode since the conditional comment doesn't target them.
151
Writing the <!DOCTYPE> first is certainly best practice.
I remember strange problems a long, long time ago where some browser (probably IE6) ignored a <!DOCTYPE> because there was something seemingly innocent before it - I think just whitespace, but maybe it was a comment. In any case, it was a horrible, horrible bug to have to track down, and there's certainly never any good reason to have comments or whitespace before the <!DOCTYPE>.
Writing the <!DOCTYPE> first is, I'd say, just something experienced web developers do to avoid horrible, elusive bugs.
36
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
