
Если HTML-страница – это книга, то теги <h1>
— <h6>
– её заголовки. Они помогают пользователю и поисковым системам понять, о чём идёт речь. Давайте разберёмся, кто из них самый важный, а кто просто пытается выглядеть солидно.
<h1>
– Король заголовков 👑
<h1>
– это самый главный заголовок страницы. Он как название фильма: его должно быть видно сразу, и он должен быть уникальным!
Пример:
<h1>Как приручить дракона (и CSS)</h1>
🔹 Используйте <h1>
только один раз на странице – он царь, а царей много не бывает!
<h2>
– Правая рука короля 🤴
Этот тег используется для подзаголовков крупных разделов.
Пример:
<h2>Введение в дрессировку драконов</h2>
🔹 <h2>
можно использовать несколько раз, но не перебарщивайте!
<h3>
– Мини-боссы 💼
Эти заголовки нужны для подразделов внутри <h2>
.
Пример:
<h3>Выбор корма для дракона</h3>
🔹 Если <h1>
– это название фильма, <h2>
– его главы, то <h3>
– подглавы.
<h4>
– Локальные менеджеры 📋
Эти заголовки встречаются, когда нужно углубиться в тему ещё глубже.
Пример:
<h4>Преимущества овсянки для драконов</h4>
🔹 Обычно используются внутри <h3>
, но не слишком часто.
<h5>
– Секретарь 📎
Эти заголовки появляются редко. Они нужны для совсем небольших уточнений.
Пример:
<h5>Таблица калорийности корма</h5>
🔹 Почти не видны глазу, но иногда без них не обойтись.
<h6>
– Заголовок-невидимка 👻
Используется настолько редко, что его можно назвать легендой.
Пример:
<h6>Мелкий шрифт, который никто не читает</h6>
🔹 Если ваш текст добрался до <h6>
, возможно, пора пересмотреть его структуру!
Итог: кто кого главнее?
<h1>
– Самый важный заголовок, только один на странице.<h2>
– Главные разделы.<h3>
– Подразделы.<h4>
– Углубления.<h5>
– Дополнительные уточнения.<h6>
– Дно структуры (но всё ещё полезное!).
Правильная структура заголовков делает сайт удобным и понятным. Пусть ваш <h1>
сияет ярче солнца, а <h6>
… ну, просто существует.