
Если 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>… ну, просто существует.