The <header> element is a new HTML element and was introduced in HTML5. It can be used as a header for a whole page (the most common usage), but can also be used as the header for an article or any other piece of content on the page
nanadwumor

The <header> element is a new HTML element and was introduced in HTML5. It can be used as a header for a whole page (the most common usage), but can also be used as the header for an article or any other piece of content on the page. The header is usually used as a container for content that precedes the primary content of the page. This often contains website branding, navigation elements etc.
<header> element is a container primarily aimed at containing heading (h1, h2, h3, h4, h5, h6) but this is not a requirement. It is no different from the <div> element except that its name adds a semantic meaning. Instead of a general container like <div>, a <header> adds semantic meaning to the kind of container.
This helps search engines to understand the structure of your website’s content. Of course, header of a document comprises the foremost content a d this normally entails at least one heading (h1, h2, h3, h4, h5, h6).
Join other Subscribers on our YouTube channel and enjoy daily pogramming tutorials.
Syntax of <header> element
This tag cannot be placed within a <footer>, <address> or another <header> element.
The <header> and the <head> element
Don’t confuse the <head> element with the <header> element. The two are different. The <head> element is a container for the following elements: <title>, <style>, <meta>, <link>, <script>, and <base>. That’s, the <head> element contains the title of your document.
The document’s title is what you see on the browser’s title bar or page’s bar. The <head> element contains metadata (data about data) about the web document. The <head> is used once in a document whereas the <header> can be used countless times.
Recommended

Difference Between Absolute and Relative References in HTML
A relative reference does not specify the complete path to a web page. It specifies only the name...
Output

The <div> and the <header> element
The <div> is a container for other elements. Elements in a <div> are normally referenced in a CSS using a class or id. The <header> element can be seen as a special type of <div> element geared towards containing headers of pages and articles.
Using the <div> element as container for header section
Prior to HTML5, most web developers used a <div> to group header code and give them a class name or id called “header”. However, in HTML5 the <header> element was introduced as a special container for header section of pages or articles.
In other words, <header> can be seen as a special type of <div> for header section. So <header> element does not add any default formatting to the html, just like a div. It only gives semantic meaning to what it contains and this is extremely helpful to search engines.
Output

Using multiple <header> element in a page
You May Also Like…
Block And Inline Level Tags in HTML
Block elements start on a new line and end with a carriage return. That's, immediately after ending on a horizontal...
Selecting a browser for HTML5 development
Google's Chrome browser is simple to use and has the most up-to-date HTML5 features making it easier for developers....
Top 10 HTML5 formatting tags
HTML offers a range of elements for formatting text. HTML formatting tags include : <b> - Bold text...
Recent Comments