Теги <header> и <footer> в HTML5 предназначены для обозначения шапки и подвала документа или раздела соответственно. Они являются частью семантической разметки, предоставляя более четкую структуру страницы и облегчая её понимание как пользователями, так и поисковыми системами. Использование этих тегов способствует лучшей доступности и SEO.
Тег <header>
Шапка сайта — это верхняя часть страницы, которая обычно содержит заголовок сайта, логотип, основную навигацию или важные элементы интерфейса, такие как форма поиска. Тег <header> может использоваться как для обозначения шапки всего сайта, так и для заголовка отдельных разделов или статей.
Пример использования:
<header>
<h1>Название сайта</h1>
<nav>
<!-- Навигационное меню -->
</nav>
</header>
Тег <footer>
Подвал сайта — это нижняя часть страницы, которая часто содержит авторские права, ссылки на контактную информацию, карта сайта, ссылки на социальные сети и другую вспомогательную информацию. Так же, как и <header>, <footer> может применяться как к всему сайту, так и к отдельным разделам или статьям.
Пример использования:
<footer>
<p>© 2024 Название компании</p>
<nav>
<!-- Ссылки на важные страницы или внешние ресурсы -->
</nav>
</footer>
Ключевые особенности
- Семантическая структура: Использование
<header>и<footer>помогает создавать более структурированные и семантически правильные документы, что упрощает их понимание и обработку поисковыми системами и вспомогательными технологиями. - Многократное использование: Теги
<header>и<footer>могут использоваться несколько раз в документе для обозначения шапки и подвала различных разделов или статей, не только для всей страницы в целом. - Гибкость: В
<header>и<footer>можно включать различные элементы, в том числе заголовки, навигационные ссылки, информацию об авторских правах, контактные данные и многое другое, что делает их очень гибкими в использовании.
Использование <header> и <footer> не только улучшает семантическую структуру веб-страницы, но и способствует лучшей организации содержимого, делая его более понятным и доступным для всех пользователей.
