HTML · справочник
Тег header
header обозначает вводную часть страницы или отдельного раздела. В нём часто находятся логотип, заголовок, краткое описание и основная навигация.
Шапка всей страницы
Обычно верхний header располагается прямо внутри body. Он не обязан быть фиксированным и не имеет отношения к тегу head, где находятся метаданные документа.
<header>
<a href="/">Praktum</a>
<nav aria-label="Основная навигация">...</nav>
</header>Header внутри статьи
У article или section может быть собственный header с заголовком, датой и именем автора. Это помогает сгруппировать вводную информацию материала.
<article>
<header>
<h1>Основы CSS Grid</h1>
<p>Автор: Анна · 15 октября</p>
</header>
<p>Начинаем с терминов...</p>
</article>Частые ошибки
- Путать header и head.
- Добавлять header только ради фона.
- Помещать в шапку основной текст статьи.
- Дублировать одинаковую навигацию без причины.
Практика
Сверстай шапку сайта с логотипом и меню, затем добавь отдельный header в статью с h1, датой и автором.