Заголовки H1–H6: правильная иерархия и оптимизация

Заголовки — это каркас любой веб-страницы. Они помогают человеку быстро понять, о чём текст и стоит ли его читать, а поисковому роботу — разобрать структуру документа, выделить главную тему и второстепенные блоки. Теги H1–H6 в HTML существуют именно для этого: они задают логическую иерархию контента, а не просто «делают шрифт крупнее». К сожалению, на практике с заголовками связано огромное количество ошибок — от нескольких H1 на одной странице до использования H-тегов ради красивого начертания. В этой статье разберём, как выстроить правильную иерархию H1–H6, чем H1 отличается от title, как вписывать ключевые слова без переспама и какие инструменты помогут проверить структуру. Материал рассчитан в первую очередь на продвижение в Яндексе, но все принципы одинаково хорошо работают и в Google.

Зачем нужны заголовки H1–H6 и как их видят пользователь и робот

Теги заголовков в HTML образуют шесть уровней — от H1 (самый главный) до H6 (самый мелкий по значимости). Это не оформительский инструмент, а способ разметить смысловую структуру документа. Представьте оглавление книги: есть название, есть главы, внутри глав — параграфы, внутри параграфов — подпункты. Точно так же устроена и страница: H1 — это «название книги», H2 — «главы», H3 — «параграфы внутри глав» и так далее.

Пользователь, как правило, не читает страницу слово в слово. Он сканирует её взглядом, цепляясь именно за крупные заголовки и подзаголовки. Если структура логична, человек за пару секунд понимает, нашёл ли он нужный ответ. Если заголовков нет или они хаотичны, посетитель теряется и уходит — а это прямой сигнал поведенческого фактора, который Яндекс учитывает очень внимательно.

Робот воспринимает заголовки иначе, но не менее серьёзно. Для поисковой системы H1 — это краткая формулировка главной темы страницы, а вложенные H2–H6 — карта подтем. По этой карте робот понимает, насколько полно страница раскрывает запрос, какие смысловые блоки в ней есть, и может вытащить из них быстрые ответы для сниппета. Грамотная иерархия заголовков напрямую влияет на то, как алгоритм оценивает релевантность и полноту материала.

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

Правило одного H1: почему он должен быть единственным

Главное правило, которое нарушают чаще всего: на странице должен быть ровно один H1. Это заголовок первого уровня, который формулирует основную тему всего документа. Один H1 — одна главная мысль. Если на странице два, три или пять H1, робот получает противоречивый сигнал: какая из формулировок главная? В результате тема «размывается», и релевантность по целевому запросу падает.

Откуда вообще берётся несколько H1? Чаще всего — из вёрстки шаблона. Логотип в шапке обёрнут в H1, название статьи — тоже H1, а ещё блок в подвале или виджет в сайдбаре дизайнер по привычке сделал крупным заголовком. Формально валидаторы HTML5 допускают несколько H1 внутри разных секций section и article, но на практике для SEO это плохая идея: поисковые системы по-прежнему ориентируются на классическую модель «один документ — один H1».

Правильный подход прост: логотип и название сайта в шапке оформляются обычным текстом, ссылкой или, в крайнем случае, тегом для логотипа, но не H1. Единственный H1 на странице — это заголовок основного содержимого: название статьи, название товара в карточке, заголовок раздела каталога. Всё остальное — это H2 и ниже.

Логичная вложенность H2–H6 без пропусков уровней

Второе фундаментальное правило — соблюдать последовательность уровней. После H1 идёт H2, внутри H2 могут быть H3, внутри H3 — H4 и так далее. Нельзя «перепрыгивать» через уровень: например, ставить H4 сразу после H2 без промежуточного H3. Пропуск уровня ломает логику дерева и сбивает с толку и робота, и вспомогательные технологии вроде скринридеров.

Покажу на примере правильной структуры статьи о выборе котла отопления:

• H1 — Как выбрать газовый котёл для частного дома
• H2 — Типы газовых котлов
  • H3 — Одноконтурные котлы
  • H3 — Двухконтурные котлы
• H2 — На что обратить внимание при выборе
  • H3 — Мощность
  • H3 — Энергозависимость
• H2 — Частые ошибки покупателей

А вот пример неправильной структуры, где уровни идут вразнобой:

• H1 — Как выбрать газовый котёл
• H3 — Типы котлов (пропущен H2)
• H2 — Мощность (уровень «прыгнул» вверх без логики)
• H5 — Ошибки (резкий скачок вниз через два уровня)

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

Чем H1 отличается от title

Эти два понятия постоянно путают, хотя они выполняют разные задачи. Title — это содержимое тега в секции head, которое пользователь видит во вкладке браузера и в качестве кликабельного заголовка в поисковой выдаче. H1 — это видимый заголовок на самой странице, часть её содержимого. Title живёт в выдаче и вкладке, H1 — внутри документа.

Из этого вытекает важное следствие: title и H1 не должны быть идентичны «буква в букву». Title пишется под поисковую выдачу — он должен быть заточен под клик, содержать главный ключ ближе к началу, укладываться примерно в 55–65 символов, чтобы не обрезаться в сниппете, и нередко включать название бренда или дополнительный стимул (цену, гарантию, географию). H1 пишется под человека, который уже зашёл на страницу: он может быть длиннее, естественнее и подробнее.

Например, для страницы услуги title может быть «Внутренняя оптимизация сайта — цены и сроки | SEO ПРОГРЕСС», а H1 на самой странице — «Внутренняя оптимизация сайта под Яндекс и Google». Смысл общий, формулировки разные. Такой подход даёт два разных «крючка» — один для выдачи, другой для страницы — и расширяет семантику. О том, как правильно составлять title, description и другие метаданные, у нас есть отдельная подробная статья про эффективные мета-теги.

Вхождение ключей в подзаголовки без переспама

Заголовки — одно из самых сильных мест для вхождения ключевых слов. Робот придаёт словам в H1–H6 повышенный вес, поэтому грамотное использование ключей в подзаголовках заметно усиливает релевантность. Но именно здесь легко скатиться в переспам, который Яндекс наказывает фильтром «Баден-Баден».

Базовый принцип: главный ключ — в H1, один раз, в естественной формулировке. Дополнительные и низкочастотные запросы распределяем по H2–H3, по одному на заголовок, и только там, где они уместны по смыслу. Подзаголовок в первую очередь должен честно описывать содержимое блока под ним, а вхождение ключа — приятный бонус, а не самоцель.

Сравните. Переспамленный вариант: «Купить пластиковые окна недорого, пластиковые окна цена, заказать пластиковые окна в Москве». Здесь ключ вбит трижды, читать невозможно. Естественный вариант: «Сколько стоят пластиковые окна и от чего зависит цена». Ключ присутствует, но заголовок звучит как нормальная человеческая фраза. Именно второй подход работает в современном Яндексе.

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

Тема вхождения ключей тесно связана с написанием текста в целом — подробнее об этом в статье о том, как писать SEO-тексты правильно.

Длина и информативность заголовков

Хороший заголовок отвечает на вопрос «о чём этот блок?» так, чтобы было понятно даже вне контекста. Слишком короткие заголовки вроде «Цена» или «Доставка» работают плохо: они не несут семантики и не помогают ни роботу, ни пользователю, читающему оглавление. Гораздо лучше — «Сколько стоит установка и из чего складывается цена» или «Сроки и условия доставки по России».

При этом впадать в другую крайность тоже не стоит. Заголовок длиной в три строки превращается в абзац и теряет функцию заголовка. Оптимальная длина H1 — примерно до 60–70 символов, чтобы фраза была ёмкой и читалась с одного взгляда. Подзаголовки H2–H3 могут быть чуть короче, но всё равно информативными. Главный критерий — если по списку одних только заголовков можно понять, о чём вся страница, значит, структура хорошая.

Ещё один практический совет: формулируйте заголовки в одном стиле. Если часть H2 у вас в виде вопросов («Как выбрать?»), а часть — в виде назывных конструкций («Выбор модели»), оглавление выглядит неряшливо. Выберите единый формат — вопросный или назывной — и придерживайтесь его в пределах страницы.

H1 на главной, в карточке товара, в статье и в каталоге

Содержание и формулировка H1 зависят от типа страницы. Универсального шаблона нет, но есть логика для каждого случая.

Главная страница. H1 здесь описывает компанию или основную услугу/тематику сайта в целом, с привязкой к ключевому запросу и, часто, к региону. Например, «Создание и продвижение сайтов в Москве» или «Интернет-магазин строительных материалов с доставкой». Не нужно делать H1 главной просто названием бренда — добавьте смысл и ключ.

Карточка товара. H1 — это название конкретного товара, желательно с характеристиками, по которым его ищут: «Котёл газовый Baxi Main 24F двухконтурный настенный». Такой H1 одновременно понятен покупателю и насыщен запросами.

Статья блога. H1 — заголовок материала, отражающий его суть и содержащий основной ключ. Здесь уместны вопросные и инструктивные формулировки: «Как настроить редиректы на сайте без ошибок».

Страница каталога или категории. H1 — название категории с уточнениями: «Газовые котлы — купить в Москве с установкой». Важно, чтобы H1 категории не дублировал H1 главной и не пересекался дословно с карточками внутри.

Главное во всех случаях — уникальность. У каждой страницы сайта должен быть свой, неповторяющийся H1, как и свой title. Дубли заголовков по сайту — частая техническая проблема, о которой мы рассказывали в обзоре технических ошибок сайта.

Заголовки и сниппеты: как структура помогает попасть в быстрые ответы

Заголовки напрямую влияют на то, как страница выглядит в выдаче и попадает ли она в расширенные блоки. Яндекс и Google активно формируют быстрые ответы и блоки с оглавлением, вытаскивая их именно из структуры заголовков. Если у вас есть чёткий H2 в формате вопроса, а сразу под ним — короткий ёмкий ответ, шанс попасть в быстрый ответ значительно возрастает.

Поэтому полезно проектировать часть подзаголовков под реальные пользовательские вопросы: «Сколько стоит?», «Как часто нужно обслуживать?», «Чем отличается X от Y?». Под таким H2 давайте сжатый прямой ответ в первом же абзаце, а уже потом — развёрнутые детали. Это и удобно читателю, и удобно роботу, который ищет готовый фрагмент для сниппета.

Связка «структурированные заголовки + микроразметка» работает ещё сильнее. Разметка Schema.org помогает поисковику точнее понять тип контента и собрать расширенный сниппет. Подробно об этом — в материале про микроразметку и SEO. А о том, как в целом повысить кликабельность результата в выдаче, читайте в статье о том, как поднять CTR сниппета.

Типичные ошибки вёрстки заголовков

Большинство проблем с заголовками — это не контентные, а технические ошибки, заложенные в шаблоне сайта. Перечислю самые частые и опасные.

1. H-теги ради стилизации. Самая распространённая ошибка: верстальщик использует H2 или H3 просто потому, что нужен крупный жирный текст. В результате обычная подпись под картинкой или название блока в подвале становится «подзаголовком» в глазах робота и ломает иерархию. Размер и начертание текста задаются стилями CSS, а не выбором уровня заголовка.
2. Несколько H1 на странице. Логотип, название статьи и виджет в сайдбаре — три разных H1. Тему страницы размывает, релевантность падает.
3. Скрытые заголовки. Заголовки, спрятанные через display:none или вынесенные за пределы экрана, ради «вписать побольше ключей». Поисковики давно распознают такие приёмы и расценивают их как попытку манипуляции.
4. H1 равен title буква в букву. Полное дублирование лишает вас возможности расширить семантику и выглядит как недоработка.
5. Пропуск уровней. Переход с H2 сразу на H4 или H5, ломающий дерево.
6. Полное отсутствие H1. Иногда заголовок статьи оформлен обычным div с крупным шрифтом, а тег H1 на странице вообще отсутствует. Робот не получает явного сигнала о главной теме.
7. Дубли H1 по всему сайту. Когда десятки страниц имеют одинаковый H1, они начинают конкурировать друг с другом за одни и те же запросы.

Все эти ошибки относятся к зоне технической и внутренней оптимизации сайта. Они незаметны на глаз, но хорошо видны при анализе кода и заметно тормозят продвижение. Системный подход к таким вопросам мы разбирали в статье о внутренней оптимизации сайта.

Инструменты проверки иерархии заголовков

Проверять структуру заголовков вручную, читая код, можно, но долго. Есть инструменты, которые показывают дерево H1–H6 за секунды и сразу подсвечивают проблемы.

• Расширения для браузера — HeadingsMap, Web Developer и аналоги. Они строят наглядное дерево заголовков прямо на странице и подсвечивают пропуски уровней и лишние H1.
• Десктопные краулеры — Screaming Frog SEO Spider, Netpeak Spider. Они обходят весь сайт и выгружают список H1 и H2 по каждому URL: сразу видно дубли, пустые и отсутствующие заголовки, множественные H1.
• Валидатор W3C — проверяет корректность HTML-разметки в целом, в том числе вложенность тегов.
• Яндекс Вебмастер и сервисы аудита — показывают проблемы с заголовками и дублями в разделе диагностики и в отчётах по страницам.
• Просмотр исходного кода и инструменты разработчика в браузере — быстрый способ проверить конкретную страницу вручную.

Практический алгоритм проверки выглядит так: прогоните сайт краулером, выгрузите все H1, найдите страницы без H1, с несколькими H1 и с дублями, затем выборочно проверьте 5–10 ключевых страниц через HeadingsMap на предмет пропуска уровней. Этого достаточно, чтобы выявить большинство проблем структуры.

Пример правильной и неправильной структуры страницы

Сведём всё вместе на сквозном примере. Допустим, мы оптимизируем страницу услуги «Продвижение сайтов».

Правильная структура:

• H1 — Продвижение сайтов в Яндексе и Google (единственный, отражает тему, содержит ключ)
• H2 — Какие задачи решает продвижение
  • H3 — Рост трафика
  • H3 — Заявки и продажи
• H2 — Этапы работы
  • H3 — Аудит и сбор семантики
  • H3 — Внутренняя оптимизация
  • H3 — Внешнее продвижение
• H2 — Сколько стоит продвижение
• H2 — Частые вопросы

Здесь один H1, последовательные уровни без пропусков, информативные формулировки, ключи распределены естественно, есть блок под быстрый ответ («Сколько стоит»).

Неправильная структура:

• H1 — логотип компании
• H1 — Продвижение сайтов (второй H1)
• H4 — Этапы (пропущены H2 и H3)
• H2 — Продвижение сайтов недорого заказать продвижение сайтов цена (переспам, дубль ключа)
• H3 (скрытый через display:none) — ещё немного ключей

Во втором варианте сразу несколько грубых ошибок: два H1, пропуск уровней, переспам и скрытый заголовок. Такая страница не просто плохо ранжируется — она рискует попасть под фильтр за переоптимизацию. Разница между этими двумя примерами и есть та граница, которая отделяет грамотную внутреннюю оптимизацию от любительской вёрстки.

Вывод

Заголовки H1–H6 — это не про размер шрифта, а про логику и смысл. Один H1 на страницу, последовательная вложенность без пропусков уровней, информативные формулировки, аккуратное вхождение ключей без переспама, уникальные заголовки для каждой страницы и отказ от H-тегов ради стилизации — вот фундамент, на котором строится понятная и роботу, и человеку структура. Регулярно проверяйте иерархию краулерами и расширениями, не допускайте дублей и скрытых заголовков, проектируйте часть подзаголовков под быстрые ответы — и страница будет точнее ранжироваться и удобнее читаться.

На первый взгляд работа с заголовками кажется простой, но на реальном сайте с сотнями страниц она быстро упирается в особенности шаблона, дубли, технические ограничения CMS и тонкости семантики. Комплексную внутреннюю оптимизацию — от структуры заголовков и метатегов до устранения технических ошибок — лучше доверить специалистам, которые видят сайт целиком и работают системно. Команда SEO ПРОГРЕСС готова взять это на себя: мы наведём порядок в иерархии заголовков, исправим ошибки вёрстки и выстроим внутреннюю оптимизацию под Яндекс. Если нужно не только проектирование, но и доработка кода, поможет наша техническая поддержка и доработка сайта. Посмотрите наши кейсы с результатами продвижения или сразу свяжитесь с нами через страницу контактов — обсудим вашу задачу и предложим решение.