Обсудить проект

Коротко опишите задачу — этого достаточно для первого контакта.

Практическое SEO · контент

H1, H2 и H3: как строить заголовки страницы без формального переспама

Заголовки помогают пользователю быстро понять структуру текста и разделяют материал на смысловые блоки. Для SEO важнее логическая иерархия и соответствие содержанию, чем попытка вставить ключевую фразу в каждый H2.

Основа

Заголовки организуют содержание, а не служат контейнерами для ключей

H1 обычно обозначает главную тему документа. H2 делят её на крупные вопросы, H3 уточняют отдельные части. Такая иерархия помогает читать длинный материал и поддерживает доступность интерфейса.

Если каждый H2 повторяет одну и ту же ключевую фразу с перестановкой слов, текст становится тяжёлым и не получает дополнительной пользы.

Хороший заголовок можно понять без предыдущего абзаца: он кратко объясняет, о чём следующий блок.

Шаг 1

H1 формулирует основную задачу страницы

Услуга, категория и статья требуют разных H1. Коммерческая страница называет услугу или продукт, статья формулирует проблему или вопрос, категория — класс объектов.

На практике удобно иметь один основной H1. Это упрощает шаблоны и проверку, хотя техническое наличие нескольких H1 само по себе не делает страницу автоматически плохой. Важнее ясность документа.

Конкретность

H1 сразу говорит, что находится на странице.

Соответствие Title

Формулировки связаны по смыслу, но не обязаны быть одинаковыми.

Без лишнего брендинга

Название компании не вытесняет задачу страницы.

Без списков ключей

Один естественный заголовок вместо набора синонимов.

Шаг 2

H2 и H3 отражают вложенность смыслов

Если H3 появляется без понятного родительского H2, структура может быть визуально красивой, но логически странной. На больших руководствах полезно пройти по заголовкам как по оглавлению: должен получиться связный план.

Не нужно выбирать уровень по размеру шрифта. Внешний вид задаётся CSS, а H2/H3 описывают структуру документа.

УровеньРольПример
H1Главная темаПочему страницы не индексируются
H2Крупный этапПроверяем robots.txt и noindex
H3Частный вопросКак проверить X-Robots-Tag
Обычный текстПояснениеШаги и детали проверки

Шаг 3

В каталогах H1 должен корректно собираться из данных

Если шаблон формирует H1 из категории, бренда и параметров, проверяем крайние случаи: пустой бренд, два одинаковых свойства, длинное название и символы из импорта.

Нельзя позволять фильтрам создавать бессмысленные заголовки вроде «Красные красные товары купить». Ошибка H1 часто сигнализирует, что вся фасетная страница создана без продуманной роли.

Фильтры каталогаКатегории и подкатегории

Шаг 4

Скрытые блоки всё равно должны иметь логичную структуру

FAQ, характеристики и мобильные аккордеоны могут использовать H2/H3, если они действительно являются разделами документа. Но не каждый визуальный заголовок карточки обязан быть heading-тегом.

Отдельно проверяем JavaScript: содержимое заголовков и текст блока должны присутствовать в доступном DOM, а не появляться только после нестабильного запроса.

JavaScript и рендеринг

Шаг 5

Логичная иерархия помогает навигации с ассистивными технологиями

Пользователь экранного диктора может переходить по заголовкам, поэтому структура должна описывать смысл страницы, а не только визуальное оформление. Пропуски уровней иногда допустимы по контексту, но хаотичное использование headings усложняет навигацию.

Кнопки, табы и подписи полей не стоит превращать в H3 только для увеличения шрифта — для этого есть стили.

HTML-семантика и SEO здесь совпадают: ясная структура полезна и роботу, и человеку.

Шаг 6

Смотрим список заголовков без остального текста

Выгружаем H1–H3 по типам страниц и проверяем, можно ли по ним понять структуру. Ищем пустые заголовки, повторяющиеся H1, шаблонные ошибки и блоки, где heading используется только как элемент дизайна.

Особенно полезно сравнить несколько страниц одного шаблона: ошибка генерации быстро становится очевидной.

Проверка TitleСлабые страницы

Частые ошибки

Что обычно ломает эту часть SEO

Использовать H2 для размера

Семантическая структура начинает зависеть от дизайна.

Повторять ключ во всех headings

Оглавление не отражает реальные разделы.

Делать каждый элемент карточки заголовком

Outline превращается в набор цены, кнопок и артикулов.

Не проверять шаблонные значения

Одна ошибка H1 распространяется на весь каталог.

Практический сценарий

Шаблон карточки использует H2 только ради размера шрифта

На карточке товара H1 обозначает название, но затем цена, кнопка, артикул и каждый параметр оформлены как H2, потому что дизайнеру нужен крупный шрифт. В итоговом outline получается десяток «разделов», которые разделами не являются.

Переносим визуальные стили на обычные элементы, оставляем H2 для крупных содержательных блоков — «Характеристики», «Доставка», «Документы», а H3 для подразделов внутри них. Страница внешне почти не меняется, но структура становится логичной и доступной.

ЭлементБылоСтало
ЦенаH2Обычный элемент с CSS-классом
ХарактеристикиdivH2
Группа размеровstrongH3 при реальном подразделе
Кнопка КупитьH2button/a по назначению

Чек-лист

Проверка H1, H2 и H3

  1. Проверить H1: Основная тема страницы сформулирована ясно.
  2. Сверить с Title: Смысл совпадает, буквальное дублирование не обязательно.
  3. Посмотреть иерархию: H2 и H3 образуют понятный план.
  4. Не использовать heading для дизайна: Размер задаётся CSS.
  5. Убрать повтор ключей: Заголовки описывают разные смысловые блоки.
  6. Проверить шаблоны: Динамические значения не создают тавтологию.
  7. Проверить вкладки: Важные заголовки доступны после обычной загрузки.
  8. Проверить mobile: Смысл не исчезает при сворачивании интерфейса.
  9. Сравнить типы страниц: Категория, статья и услуга имеют свою логику.
  10. Повторить после deploy: Шаблонная правка не сломала сотни страниц.

Вопросы

Короткие ответы

Должен ли H1 совпадать с Title?

Нет. Они должны описывать одну тему, но могут быть сформулированы по-разному.

Можно ли иметь несколько H1?

Технически можно, но для большинства шаблонов один главный H1 проще и понятнее.

Нужно ли вставлять ключ в каждый H2?

Нет. H2 должен называть смысл раздела естественным языком.

Можно ли использовать H3 для увеличения текста?

Не стоит. Визуальный размер лучше задавать CSS, сохраняя семантическую структуру.

Практика NIC-SEO

Заголовки должны работать как оглавление

Мы строим H1–H3 вокруг смысла документа, чтобы структура была понятна даже без чтения каждого абзаца.