HTML Path

Semantics

HTML Header

Defining Header Content

HTML header element groups introductory content, often with navigation.

What is the HTML Header Element?

The <header> element is a semantic HTML tag used to represent introductory content or a set of navigational links. A <header> typically contains:

  • A heading or title
  • Logo or branding elements
  • Navigation menus
  • Other introductory content

This element is often placed at the top of a webpage or section, providing context and navigation options to users.

Basic Structure of a Header Element

A basic <header> element can include various HTML elements such as <h1>, <nav>, and <img> for logos. Here is a simple example:

Where to Use the Header Element

The <header> element is versatile and can be used multiple times within a single document. It is not limited to the top of the page. For example, it can be used at the beginning of a section or article to introduce that specific content. Here's how you might use it within an article:

Best Practices for Using the Header Element

When using the <header> element, consider the following best practices:

  • Ensure your <header> content is relevant to the introductory purpose of the section or document.
  • Use it to enhance accessibility by providing clear navigation options.
  • Avoid using <header> for content that is not relevant to navigation or introductory information.

Semantics

Next
Footer