"HTML5 e CSS3 - Módulo 2"
<head>, <header> and heading

"Curso em Vídeo"
This is the student's notebook of Ricardo Barros Becheli

<head>, <header> and heading

The names are somewhat alike but their functions are very different.

You see the first two are between angled brackets. That's because they are HTML elements themselves.

Now, "heading", or better, "HTML headings" are titles or subtitles that you want to display on a webpage.

Let's check one by one:

Head

The <head> element is a container for metadata and is placed between the tag and the tag.
HTML metadata (data about data) is data about the HTML document and it's is not displayed.
Metadata typically define:

  1. Document title
  2. Character set
  3. Styles
  4. Scripts
  5. And other meta information

Header

The <header> element represents a container for introductory content or a set of navigational links.

A <header> element typically contains:

  1. One or more heading elements (<h1> - <h6>)
  2. Logo or icon
  3. Authorship information

Note: You can have several <header> elements in one HTML document. However, <header> cannot be placed within a <footer>, <address> or another <header> element.

Heading

HTML headings are defined with the <h1> (defines the most important heading) to <h6>; (defines the least important heading) tags. And those are the heading elements.

Examples (h1 to h3 colors were CSS modified for this website):

h1

h2

h3

h4

h5
h6