Is it necessary to write HEAD BODY and HTML tags

Question

Is it necessary to write  lt html gt    lt head gt  and  lt body gt  tags   For example  I can make such a page    lt  DOCTYPE html gt            lt meta http-equiv  Content-type  content  text html  charset utf-8  gt       lt title gt Page Title lt  title gt       lt link rel  stylesheet  type  text css  href  css reset css  gt       lt script src  js head script js  gt  lt  script gt  lt  -- this script will be in head   -- gt     lt div gt Some html lt  div gt   lt  -- here body starts   -- gt        lt script src  js body script js  gt  lt  script gt    And Firebug correctly separates head and body    W3C Validation says it s valid   But I rarely see this practice on the web    Are there any reason to write these tags

User · Answer

The Google Style Guide for HTML recommends omitting all optional tags.
That includes <html>, <head>, <body>, <p> and <li>.

https://google.github.io/styleguide/htmlcssguide.html#Optional_Tags

For file size optimization and scannability purposes, consider omitting optional tags. The HTML5 specification defines what tags can be omitted.

(This approach may require a grace period to be established as a wider guideline as it’s significantly different from what web developers are typically taught. For consistency and simplicity reasons it’s best served omitting all optional tags, not just a selection.)

<!DOCTYPE html>
<html>
  <head>
    <title>Spending money, spending bytes</title>
  </head>
  <body>
    <p>Sic.</p>
  </body>
</html>


<!DOCTYPE html>
<title>Saving money, saving bytes</title>
<p>Qed.

User · Answer

Omitting the html  head  and body tags is certainly allowed by the HTML specs  The underlying reason is that browsers have always sought to be consistent with existing web pages  and the very early versions of HTML didn t define those elements  When HTML 2 0 first did  it was done in a way that the tags would be inferred when missing   I often find it convenient to omit the tags when prototyping and especially when writing test cases as it helps keep the mark-up focused on the test in question  The inference process should create the elements in exactly the manner that you see in Firebug  and browsers are pretty consistent in doing that   But     IE has at least one known bug in this area  Even IE9 exhibits this  Suppose the markup is this    lt  DOCTYPE html gt   lt title gt Test case lt  title gt   lt form action     gt      lt input name  var1  gt   lt  form gt    You should  and do in other browsers  get a DOM that looks like this   HTML     HEAD         TITLE     BODY         FORM action                 INPUT name  var1    But in IE you get this   HTML     HEAD        TITLE        FORM action                BODY                INPUT name  var1      BODY   See it for yourself   This bug seems limited to the form start tag preceding any text content and any body start tag

User · Answer

Firebug shows this correctly because your Browser automagically fixes the bad markup for you  This behaviour is not specified anywhere and can  will  vary from browser to browser  Those tags are required by the DOCTYPE you re using and should not be omitted   The html element is the root element of every html page  If you look at all other elements  description it says where an element can be used  and almost all elements require either head or body

User · Answer

Contrary to  Liza Daly s note about HTML5  that spec is actually quite specific about which tags can be omitted  and when  and the rules are a bit different from HTML 4 01  mostly to clarify where ambiguous elements like comments and whitespace belong   The relevant reference is http   www w3 org TR 2011 WD-html5-20110525 syntax html optional-tags  and it says    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    So your example is valid HTML5  and would be parsed like this  with the html  head and body tags in their implied positions    lt  DOCTYPE html gt  lt HTML gt  lt HEAD gt            lt meta http-equiv  Content-type  content  text html  charset utf-8  gt       lt title gt Page Title lt  title gt       lt link rel  stylesheet  type  text css  href  css reset css  gt       lt script src  js head script js  gt  lt  script gt  lt  HEAD gt  lt BODY gt  lt  -- this script will be in head   -- gt     lt div gt Some html lt  div gt   lt  -- here body starts   -- gt        lt script src  js body script js  gt  lt  script gt  lt  BODY gt  lt  HTML gt    Note that the comment  this script will be in head  is actually parsed as part of the body  although the script itself is part of the head  According to the spec  if you want that to be different at all  then the  lt  HEAD gt  and  lt BODY gt  tags may not be omitted   Although the corresponding  lt HEAD gt  and  lt  BODY gt  tags still can be

User · Answer

It s true that the HTML specs permit certain tags to be omitted in certain cases  but generally doing so is unwise   It has two effects - it makes the spec more complex  which in turn makes it harder for browser authors to write correct implementations  as demonstrated by IE getting it wrong     This makes the likelihood of browser errors in these parts of the spec high  As a website author you can avoid the issue by including these tags - so while the spec doesn t say you have to  doing so reduces the chance of things going wrong  which is good engineering practice   What s more  the latest HTML 5 1 WG spec currently says  bear in mind it s a work in progress and may yet change       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    http   www w3 org html wg drafts html master sections html the-body-element  This is a little subtle  You can omit body and head  and the browser will then infer where those elements should be inserted  This carries the risk of not being explicit  which could cause confusion   So this   lt html gt     lt h1 gt hello lt  h1 gt     lt script      gt          results in the script element being a child of the body element  but this   lt html gt     lt script      gt     lt h1 gt hello lt  h1 gt    would result in the script tag being a child of the head element   You could be explicit by doing this   lt html gt       lt body gt         lt script      gt         lt h1 gt hello lt  h1 gt    and then whichever you have first  the script or the h1  they will both  predictably appear in the body element  These are things which are easy to overlook while refactoring and debugging code   say for example  you have JS which is looking for the 1st script element in the body - in the second snippet it would stop working    As a general rule  being explicit about things is always better than leaving things open to interpretation  In this regard XHTML is better because it forces you to be completely explicit about your element structure in your code  which makes it simpler  and therefore less prone to misinterpretation   So yes  you can omit them and be technically valid  but it is generally unwise to do so

User · Answer

It s valid to omit them in HTML4   7 3 The HTML element start tag  optional  End tag  optional  7 4 1 The HEAD element start tag  optional  End tag  optional   http   www w3 org TR html401 struct global html  In HTML5  there are no  required  or  optional  elements exactly  as HTML5 syntax is more loosely defined   For example  title      The title element is a required child in most situations  but when a higher-level protocol provides title information  e g  in the Subject line of an e-mail when HTML is used as an e-mail authoring format  the title element can be omitted    http   www w3 org TR html5 semantics html the-title-element-0  It s not valid to omit them in true XHTML5  though that is almost never used  versus XHTML-acting-like-HTML5     However  from a practical standpoint you often want browsers to run in  standards mode   for predictability in rendering HTML and CSS   Providing a DOCTYPE and a more structured HTML tree  will guarantee more predictable cross-browser results

[html] Is it necessary to write HEAD, BODY and HTML tags?

Examples related to html

Examples related to tags