Why Should I Write HEAD, BODY and HTML Tags?

It is no secret in web design that elements such as the HEAD, BODY, and HTML tags are optional according to the HTML5 specifications. If you did not know that then now you know.

So the bigger question arises as to why web developers and designs spend so much time meticulously crafting their code to stay pretty and have these tags in place?

Here’s the Thing About the HEAD, BODY and HTML Tags

It is not so obvious to web designers that these tags are optional. After all, every single Integrated Development Environment (IDE) and simple HTML editor sticks these tags in as boilerplate code. Therefore it has been ingrained in us that these tags are a requirement.

Technically if you omit these tabs every modern web browser will insert the tags. You can take this statement with a pinch of salt as IE 9 has a bug where it incorrectly inserts the tag, especially where there is a form tag in the mix.

1. That right there is the first reason why you should explicitly add the HEAD, BODY and HTML tags to your HTML documents. You want to avoid triggering browser bugs which can make for some very interesting artifacts on your website.
2. For readability purposes, it is good practice to just add the tags to allow others in the development team easier understand the code and what you are trying to do. For example you may want a script to explicitly sit in the BODY section of your website. Maybe the script is meant to display something exactly where it is placed.
   If that placement is at the top the page there is a likelihood that the browser might bump it to the HAD section when it creates these tags.
3. Adding these tags allows you to assign classes and IDs to them which can be quite useful in crafting that perfect UI.

Here is some detail about what the specification says about these tags:

• 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.
• 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.
• 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 script or style element.
• A body element’s end tag may be omitted if the body element is not immediately followed by a comment.

The spec can be found here. http://www.w3.org/TR/2011/WD-html5-20110525/syntax.html#optional-tags

Found this article interesting? Follow Brightwhiz on Facebook, Twitter, and YouTube to read and watch more content we post.