ypx fbpx
К списку статей
Разработка
Заголовки h1 — h6: в чем отличия и как правильно использовать
Теги h1-h6 играют важную роль в СЕО-оптимизации. Поисковые роботы формируют список топ-ресурсов, сканируя заголовки статей. Из статьи вы узнаете, как работать с заголовками и научитесь их правильному использованию.
Наличие заголовков и подзаголовков в тексте делает информацию удобной для читателей. Благодаря им пользователь видит структуру документа и может легко в нем ориентироваться. В процессе верстки веб-страницы для создания заголовков используют теги <h1> — <h6>. Такие теги являются элементами разметки HTML и служат для определения важности заголовков: чем больше номер, тем ниже важность заголовка. Следовательно, h1 — главный заголовок на странице, который размещают над текстом. А подзаголовки h2-h6 проставляются по принципу вложенности.

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


Главный заголовок


h1 — это обязательный заголовок для всех страниц. Это может быть название страницы, статьи или товара, которое несет конкретную информацию, о чем будет читать пользователь. Важно отметить, что многие путают этот заголовок с <title> (заголовком страницы). Title отображается вверху экрана в браузерной строке, когда открыта страница ресурса. Тег <title> прописывается в шапке страницы между <head></head>, а теги <h1>-<h6> указываются в «теле» страницы: <body></body>.

<h1> Главный заголовок </h1>

Как использовать заголовок h1


  • На странице можно использовать только один заголовок первого порядка. Он должен стоять в начале текста, быть видимым пользователю и отражать суть информации.
  • Цель заголовка — побудить читателя открыть страницу и прочитать текст.
  • Тег <h1> не заканчивается точкой.
  • Длина заголовка не должна превышать 65 символов.
  • В заголовке старайтесь использовать самое частое слово в тексте.
  • Тег <h1> не должен быть ссылкой или картинкой.
  • Перед тем, как вручную прописывать h1, убедитесь, что движок не задает его автоматически;
  • Проверьте, закрыли ли вы заголовок. Если нет, то это может сбить с толку поисковики. Такие страницы рискуют быть понижены в рейтинге.


Заголовок второго порядка


Тегом <h2> размечаются подразделы страницы или статьи. С помощью тега <h2> выстраивается навигация по тексту: он разбивает его на смысловые части, помогает выделить важные моменты и легче усвоить информацию пользователю.


Как использовать заголовок h2


  • Используйте на странице 2 и более заголовка h2, которые будут отражать суть текста под ним.
  • Тег <h2> не должен быть изображением или ссылкой.


Заголовки h3 — h6


Теги <h3>-<h6> включают в себя уточняющую информацию. Использование всех заголовков встречается крайне редко. Это должна быть огромная статья с выстроенной иерархией.

Как использовать заголовки h3 — h6


  • Не допускайте перескакивание через уровень заголовков. Нельзя использовать меньший тег, если в вашем коде нет большего. То есть если вы используйте тег <h5>, то обязательно нужно использовать <h2>, <h3> и <h4>.
  • Чем выше уровень заголовка, тем крупнее шрифт.
  • Не допускайте переспама ключевых слов в подзаголовках. Используйте ключи только в title и h1.
  • Во всех тегах <h...> можно использовать только текст и знаки препинания.
  • Все заголовки h1-h6 служат только для разбиения текста на логические части. Выделять этим тегом предложения и фразы с целью выделить их жирным цветом — запрещено.


Иерархия заголовков


Если не будет выдержана иерархия и четкая структура, заголовки младшего порядка, например, h6, могут слиться с обычным текстом. Размер шрифта идет по убыванию номера заголовков. От h1 — самого крупного до h6 — самого мелкого.

Иерархия заголовков на странице:

Заголовок первого уровня — h1

Заголовок второго уровня — h2

Заголовок третьего уровня — h3

Заголовок четвертого уровня — h4

Заголовок пятого уровня — h5
Заголовок шестого уровня — h6

Пример иерархии заголовков на сайте:

<h1> Заголовок </h1>
<h2> Первый подзаголовок </h2>
<p> Параграф текста </p>
<h2> Второй подзаголовок </h2>
<p> Параграф текста </p>



Заключение


Заголовки на веб-странице выполняют несколько важных функций: улучшают навигацию по странице, делают текст читабельным и интуитивно понятным. Правильные заголовки помогают повысить положение статьи или веб-сайта в рейтинге поиска. В обратном случае, велика вероятность, что источник потеряет рейтинг и не дойдет до своей целевой аудитории.
Подпишитесь на рассылку полезных материалов от Айтилогии
Разрешите нам делиться с вами полезными материалами, новыми вебинарами и скидками на курсы