Search code examples
htmlheaderhead

What is the real difference between the "head" and "header" tag?


The Question

I've been coding for a while and realized that the head and header look exactly the same. Are they the same, and what is the difference between them? Does it make a difference?

After researching a bit I couldn't find much info on this, I may not have been digging deep enough. The info I found was that the <head> tag came out since HTML 1 as the <header> tag came out in HTML5. Is one more stable from the other?

Summary

I would like to understand the difference between the two tags. I would like a creditable/ or official source. If you can please post the link of where you got the information. A example of the code would be helpful too! The main question I am asking is whether there is a difference and if so what difference is there. Is there a benefit from one of them? Thank you for taking the time to read this.


Solution

  • A quick Google search reveals the following:

    Head tag:
    The HTML <head> element provides general information (metadata) about the document, including its title and links to/definitions of scripts and style sheets. (HTML MDN)

    Header tag:
    The HTML <header> element represents a group of introductory or navigational aids. It may contain some heading elements but also other elements like a logo, wrapped section's header, a search form, and so on. (HTML MDN)

    -

    In other words; the head tag is used for document title, styling, scripts, etc.
    Whereas the header tag is used for headers as seen in articles.

    Newspaper 'header'. Newspaper 'header'

    EDIT: Updated reference, as psuedocoder mentioned, W3Schools is not always fully reliable.