Тег <header>

<header> позначає вступний вміст найближчого секційного предка — зазвичай логотип, заголовок і навігацію.

Syntax

<header>...</header>

Example

<header>
  <img src="logo.svg" alt="Назва компанії">
  <nav>...</nav>
</header>

Notes

header можна використовувати кілька разів на сторінці — і для всього документа, і всередині окремих article/section.
header не має фіксованого візуального стилю сам по собі — це семантика, а не sticky-позиціонування (для цього дивіться sticky header snippet).

Accessibility

header автоматично отримує ARIA-роль banner, коли не вкладений в article/aside/main/nav/section.

Схожі інструменти

Тег <nav>

Призначення тегу <nav>: групування основних навігаційних посилань сторінки.

Тег <footer>

Призначення тегу <footer>: завершальний вміст сторінки або секції (копірайт, посилання, контакти).

Sticky header

CSS position:sticky для заголовка, що залишається видимим при скролі.