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?
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.
The head tag is used for holding Meta information, title, links, etc. and is not displayed on the page. The header tag is used within the body of the website and can be used multiple times if required, e.g. to determine the top of an article .
What's the Difference? In HTML terms, a Title Tag is expressed as "title" and the H1 Tag is expressed as "h1". Both serve as titles to describe what your webpage is about. Because both the Title Tag and the H1 Tag share the same broader purpose, it is easy to understand why people confuse them.
The <head> element is a container for metadata (data about data) and is placed between the <html> tag and the <body> tag. Metadata is data about the HTML document. Metadata is not displayed. Metadata typically define the document title, character set, styles, scripts, and other meta information.
A HTML file has headers and a "body" (payload) — just like a HTTP request. The <body> encapsulates the contents of the document, while the <head> part contains meta elements, i.e., information about the contents. This is (typically) title, encoding, author, styling etc.
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'
EDIT: Updated reference, as psuedocoder mentioned, W3Schools is not always fully reliable.
From W3C:
https://www.w3.org/wiki/HTML/Elements/head
"The <head>
element represents a collection of metadata for the Document."
https://www.w3.org/wiki/HTML/Elements/header
"The <header>
element represents a group of introductory or navigational aids."
The main difference is that the <head>
element is for META data and the <header>
element is for actual content.
The HTML <head>
tag is a container for metadata and links to scripts and stylesheets.
The <header>
tag is a semantic container used to designate contents that is introductory or navigational in nature.
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