Зачем нужна иерархия
Заголовки — не способ сделать текст крупнее. Это структурные элементы: они показывают, о чём статья, из каких частей состоит и как они связаны. Читатели бегло просматривают заголовки, чтобы понять, стоит ли читать дальше. Поисковая система использует их как подсказку о содержании. Программы экранного доступа позволяют переходить между заголовками, поэтому неправильная иерархия лишает часть посетителей удобной навигации.
Уровни и их роль
| Уровень | Роль | Сколько на странице |
|---|---|---|
| H1 | Главный заголовок: тема всей страницы | Один |
| H2 | Основные разделы статьи | Несколько |
| H3 | Подразделы внутри раздела H2 | По необходимости |
| H4 и глубже | Мелкие подразделения | Редко: часто признак слишком сложной структуры |
H1 Как выбрать матрас
H2 Виды матрасов
H3 Пружинные
H3 Беспружинные
H2 На что смотреть при выборе
H2 Частые ошибкиПравила
- Один H1 на страницу. Он соответствует теме страницы и не повторяет название сайта: адрес и заголовок.
- Не пропускайте уровни. После H2 идёт H3, а не сразу H4.
- Заголовок описывает содержимое. Не «Введение» и «Подробности», а конкретное название раздела.
- Не оформляйте заголовками обычный текст. Крупный шрифт для акцента делают стилями.
- Однородность. Заголовки одного уровня должны быть построены похоже.
Связь с оглавлением и адресом
Правильная иерархия автоматически превращается в оглавление: разделы H2 и подразделы H3 получают идентификаторы и попадают в список: оглавление и якорные ссылки. Заголовок H1 обычно согласован с адресом страницы, но полного совпадения не требуется.
Типичные ошибки
- Два и более H1 на странице из-за шаблона: логотип и название страницы оба оформлены как H1.
- Заголовки идут вразброс: H3, потом H2, затем H4.
- Слишком много заголовков в коротком тексте.
- Заголовки не отражают содержание и повторяются.
- Стили заголовков заданы так, что визуально они не отличаются от текста.
Как проверить. Краулер или расширение браузера покажет структуру заголовков страницы списком: прочитайте его без текста статьи. Если по заголовкам понятно, о чём материал, иерархия выстроена верно. Про написание самого заголовка — в статье как писать заголовок под запрос.
Пример плохой и хорошей структуры
| Плохо | Хорошо | Почему |
|---|---|---|
| H1 — «Блог компании», H2 — «Статья» | H1 — «Как выбрать матрас» | H1 отражает тему страницы |
| H2 — «Введение», H2 — «Подробности» | H2 — «Виды матрасов», H2 — «На что смотреть» | Заголовки описывают содержимое |
| H2, затем сразу H4 | H2, затем H3 | Уровни не пропускаются |
| Крупный текст оформлен как H2 | Обычный абзац с крупным шрифтом через стили | Заголовки — только структура |
Частые вопросы
Сколько H1 должно быть на странице?
Один: он описывает тему всей страницы; остальные заголовки строятся уровнями H2, H3 ниже него.
Можно ли пропускать уровни заголовков?
Не стоит: после H2 должен идти H3, а не H4; пропуск нарушает логику структуры и мешает навигации для программ экранного доступа.
Можно ли делать заголовками крупный текст для акцента?
Нет: для визуального выделения используют стили, а заголовки оставляют для структуры материала.
Готовый адрес можно собрать прямо сейчас: откройте генератор ЧПУ — он транслитерирует фразу по таблице Яндекса, уберёт служебные слова и покажет длину адреса.