I stumbled upon something interesting the other day: the <html>, <head>, and <body> tags, arguably the most fundamental of any web page, are optional. Weird, right? And it’s not just an oversight or crazy hack. It’s intentional and documented in the specs for HTML5. I’ll quote the relevant bits as proof.
But before I do, just to clarify, the tags (stuff in the markup) may be optional, but the elements (stuff in the DOM tree) will still be created.
The Fine Print
Here’s the spec for omitting <html> (feel free to skim):
An html element’s start tag may be omitted if the first thing inside the html element is not a comment. An html element’s end tag may be omitted if the html element is not immediately followed by a comment.
Here’s the spec for omitting <head> (seriously, just skim):
A head element’s start tag may be omitted if the element is empty, or if the first thing inside the head element is an element. A head element’s end tag may be omitted if the head element is not immediately followed by a space character or a comment.
And here’s the spec for omitting <body> (why aren’t you skimming?):
A body element’s start tag may be omitted if the element is empty, or if the first thing inside the body element is not a space character or a comment, except if the first thing inside the body element is a meta, link, script, style, or template element. A body element’s end tag may be omitted if the body element is not immediately followed by a comment.
All that stuff you just skimmed (you did skim, right?) is really just describing the (fairly reasonable) assumptions made when the tags are omitted. In other words, the tags are always optional, but if the assumptions made are not to your liking, then you’ll have to put the tags in.
At first I thought this was unique to HTML5, but it’s not. HTML4 is just as honeybadgery about it. XHTML will have none of this and quite frankly is appalled by your lack of discipline.
Going Minimal
Armed with this newfound knowledge, what is the smallest possible HTML5 page that still validates? It’s this:
<!DOCTYPE html>
<title>.</title>3 warnings, but still totally valid. This is the DOM tree you end up with:
Am I encouraging everyone to stop using <html>, <head>, and <body> tags? Not really. If you work with other web developers, then removing these familiar conventions may just cause more confusion than it’s worth. Decide accordingly.