Теги h1 — h6 служат для обозначения заголовков, которые выстраиваются в соответствующую иерархию по степени значимости. HTML элемент <h1> имеет наивысший приоритет, в то время как <h6> соответствует наименее важному уровню.
Корректное использование данной системы заголовков позволяет сформировать четкую структуру веб-страницы, облегчая ее восприятие как для конечных пользователей, так и для поисковых систем при индексации контента.
Разбиение текстового контента на логические блоки с использованием заголовков различных уровней является одним из ключевых аспектов грамотной разметки документа на языке HTML.
Для чего нужны
Заголовки вкратце выражают основную мысль, которая более подробно раскрывается в тексте. Прочитав заголовок, посетитель сайта принимает решение: остаться на странице и продолжить читать документ или же покинуть сайт.
То есть, основное предназначение заголовков — привлечение внимания пользователя.
Но нельзя забывать и о том, что благодаря заголовкам, SEO-специалист и вебмастер создает грамотную иерархию, структуру контента на странице, удобство для потребления контента, что напрямую влияет на SEO-оптимизацию ресурса.
Анализируя заголовки, поисковые роботы оценивают общую релевантность и актуальность информации, представленной на странице, для пользователя.
Заголовки в статье
Визуально, заголовки в теле документа выглядят следующим образом:
Видно, что каждый заголовок, в зависимости от его значимости, отличается размером шрифта. Таким образом, читателю становится понятной вся структура статьи, и материал более доступно и легко усваивается.
Заголовки в коде
Просматривая документ в формате HTML, такого явного визуального различия между заголовками нет. Выглядит разметка так:
Более наглядный пример в коде:
Тут все понятно и логично: каждый заголовок задается соответствующим HTML-тегом своего уровня.
Иерархия заголовков
Оформляя страницу сайта, нужно обязательно использовать заголовки. Но делать это нужно логично и обдуманно. Существует строгий порядок расположения тегов h1-h6 в теле документа.
Каждая страница начинается с заголовка h1. Он всегда идет первым и единственным, более не повторяясь в структуре статьи.
Например, на моем сайте на странице с консультацией по SEO он выглядит вот так:
Вторым по значимости является заголовок h2, который может встречаться несколько раз, в зависимости от объема и смысловой нагрузки контента.
Очень часто, этого заголовка h2 достаточно для грамотного и правильного оформления страницы. Но бывает и так, что приходится использовать следующий заголовок h3.
В моем примере, все на той же странице с моей консультацией по SEO видно, что я для заголовка блока с триггерами использую h2, а для заголовков самих триггеров h3.
Заголовок h3 используется внутри текста, обозначенного заголовком h2, разделяя контент на дополнительные смысловые разделы.
Важно! Не рекомендуется использовать заголовок низшего уровня, если вы не использовали в статье заголовок высшего уровня. То есть не рекомендуется использовать заголовок h4, если в вашей статье нет заголовка h3. Это не будет грубой ошибкой, но SEO кроется в совокупности таких мелочах. Поэтому лучше следовать этому правилу верстки заголовков.
Как правило, заголовок h4 является крайним в иерархии статьи и используется редко. То есть, можно сказать, что заголовки h5 и h6 не используются вовсе. Но это не значит, что их нельзя использовать. Если есть необходимость, то стоит вспомнить и про них.
Главное — нужно заботиться об удобстве восприятия материала пользователем и поисковых систем.
Для примера приведу правильную иерархию статьи:
Почему h1 самый главный
Заголовок h1 — это общий заголовок всего документа, поэтому он может использоваться только один раз.
Он является главным, так как именно по нему пользователь судит о содержании статьи и принимает решение, читать ее или нет.
Для того, чтобы составить хороший заголовок h1, который будет передавать суть документа, нужно понимать, чем h1 отличается от title и знать основные требования к его составлению.
Почему h1 должен различаться с Title
Title также является основным заголовком документа, но указывается он не только для посетителей сайта, но и для поисковых роботов. Увидеть title можно на странице поисковой выдачи или во вкладке браузера с открытой страницей сайта. Он может отличаться от H1 и прописывается в специальном мета-теге <title>.
Заголовок H1 тоже может показываться в выдаче вместо title, если поисковая система его посчитает более полезным для пользователя, чем ваш прописанный title.
Поэтому по-хорошему Title и H1 должны отличаться, потому что у них разная цель.
Во первых. Правильно составленный заголовок h1 должен привлекать внимание пользователя и соответствовать его ожиданиям, чтобы статью хотелось прочесть. Так же этот заголовок посетители могут увидеть под другими вашими статьями или в разделах сайта. Интересный заголовок h1 может поспособствовать на переход к другой статье и проведение посетителю еще больше времени на вашем ресурсе, что благоприятно может сказываться на поведенческих факторах.
Во вторых. Заголовок h1 указывает поисковым системам на то, что контент, расположенный на этой странице, соответствует вписанному в нее заголовку title, ранее изученному пользователем на странице поисковой выдачи.
А основная задача title — это быть оптимизированным под поисковые запросы.
Самое по себе одинаковый title и h1 не считается за спам. И в некоторых тематиках это оправдано, потому что сложно сделать эти теги разными.
Но повторяя их содержимое вы не даете поисковой системе выборку для оценки показа заголовка на поисковой выдаче. Поэтому желательно их затачивать под разные цели. Title — преимущественно для ключевых слов. H1 — для конверсии и мареткинга. Это в идеале, но а сама реализация зависит от конкретной ситуации.
Требования к h1
- Нужно стараться делать заголовок h1 кратким, но в то же время максимально информативным. В идеале не более 5-7 слов.
- Заголовок h1 не рекомендуется повторять на одной и той же странице несколько раз. Главное правило: одна страница — один заголовок h1.
- Заголовок размещается вверху всего документа.
- Перед заголовком h1 не рекомендуется использовать менее приоритетный заголовки h2, h3 и т.д.
Существует негласное мнение, что длина заголовка h1 не должна превышать 50 символов. Но не критично, если этот предел будет превышен. Все индивидуально и зависит от содержимого страницы.
В заголовке h1, как и в title, рекомендуется использовать ключевые слова. Если получается сделать это в точном вхождении запроса — замечательно. Если такой возможности нет, то запрос можно разбавить. Главное, чтобы заголовок был читабельным и понятным для пользователя.
Как сделать заголовок цепляющим
Прежде всего нужно понимать, что человек ищет не какой-либо конкретный товар или услугу, а решение своей проблемы. И заголовок должен быть направлен именно на это.
Существуют множество приемов составления привлекательного заголовка. Рассмотрим некоторые из них.
Решаем проблему пользователя
Например, можно написать два разных заголовка:
- «Болит голова? Избавьтесь от головной боли за месяц!»
- «Можно ли избавиться от головной боли?»
В данном варианте, первый заголовок будет более удачный, нежели второй. Так как именно он говорит пользователю о том, что его проблема будет однозначно решена за определенный срок. Но при этом важно не завысит ожидания пользователя, если содержание статьи не будет соответствовать обещаниям в заголовке, то он навряд ли вернется на ваш сайт в следующий раз.
Интригуем посетителя
Опять, для примера два варианта заголовков:
- «Делимся самым эффективным методом лечения головной боли!»
- «Хороший метод лечения головной боли!»
Первый заголовок будет более привлекательным для посетителя.
Метод «экзамена»
Данный способ составления заголовков провоцирует пользователя открыть статью, с целью проверки собственных знаний. Например:
- «Вы точно знаете, что правильно боретесь с головной болью?»
- «Все ли вам известно о борьбе с головной болью.»
Первый вариант опять более удачный, нежели второй.
Составляя заголовки, нужно стремиться к тому, чтобы они были краткими, информативными и привлекательными для посетителей. Но нужно соблюдать грань между привлекательностью и кликбейтом. Заголовок должен соответствовать содержимому статьи, а тот, в свою очередь, должен оправдывать ожидания пользователя.
Как использовать заголовки h2-h6
- Необходимо понимать, что наименьший заголовок не рекомендуется использовать в тексте, в котором нет большего заголовка. Например, если в документе прописан заголовок h3, то перед ним рекомендуется поставить заголовок h2.
- Чем выше приоритетность заголовка, тем больше должен быть размер его шрифта. Во всех известных CMS эта функция, как правило, реализована по умолчанию.
- Каждый заголовок должен быть емким и информативным, отображающим основную суть материала, последующего за ним.
- Не нужно спамить в заголовках ключевыми словами. Как правило, запросы используются при составлении title и h1. В заголовках h2-h6 ключи использовать можно, но стоит делать это с осторожностью. Главное — это раскрыть суть информации, которая последует за заголовком. Нужно помнить что в поисковую выдачу Яндекс вместо title могут попадать заголовки h2-h3.
Не нужно пытаться вставить все уровни заголовков в текст, руководствуясь принципом «чтобы было». Если объем информации небольшой, то заголовков h2-h6 может и не быть. В первую очередь, нужно руководствоваться здравым смыслом, ориентируясь на то, насколько удобно читать ваш текст. Ну и, конечно же, необходимо соблюдать иерархию заголовков, о которой мы говорили ранее.
Частые ошибки использования заголовков h1-h6
Зачастую, составляя заголовки h1-h6, SEO-специалисты допускают одни и те же ошибки. Разберем их более подробно.
- На странице встречаются несколько заголовков h1. Это самая грубая ошибка, которая, как не странно, встречается чаще всего. Главное правило: один документ — один заголовок h1.
- Не соблюдается иерархия заголовков. Не все понимают этот момент, считая, что вправе оформлять текст так, как заблагорассудится. Поисковые системы считают иначе. Иерархия заголовков должна соблюдаться.
- Заголовки, составленные из ключевых слов. Использовать ключи в заголовках можно, то только в пределах разумного. Не стоит оформлять в виде заголовка несколько ключей, перечисляемых через запятую. Как правило, заголовки содержат ключи в порядке их приоритетности. То есть, заголовок h1 включает в себя наиболее высокочастотный запрос, а заголовок h3 (если он используется) — низкочастотный запрос.
- Хоть и поисковая система понимает элементы сайта, но для больше надежности не рекомендуется использовать теги h2-h6 в элементах меню или в других заголовках, которые не относятся к главному контенту страницы.
Использование заголовков в документе позволяет сделать текст более удобным для восприятия пользователя. Составляя заголовки, нужно соблюдать их иерархию и заботиться о привлекательности и емкости текста. Заголовки не должны быть кликбейтными и «желтыми». Каждый заголовок должен соответствовать тексту, который следует после него.
Правильное оформление материала позволит вам улучить поведенческие факторы сайта, а следовательно, положительно скажется и на ранжировании вашего ресурса в поисковой выдаче.
Главные выводы
- Заголовки h1-h6 играют важную роль в SEO и удобстве восприятия материала пользователями.
- Заголовок h1 является главным и определяет содержание статьи.
- Title и H1 имеют разные цели и должны отличаться.
- Заголовок h1 должен быть кратким, информативным и соответствовать ожиданиям пользователя.
- Заголовки h2-h6 должны быть емкими и информативными, отображающими суть материала.
- Важно соблюдать иерархию заголовков и избегать кликбейтных и «желтых» заголовков.
- Правильное оформление материала может улучшить поведенческие факторы сайта и его ранжирование в поисковой выдаче.
Вопросы и ответы про заголовки h1-h6 для SEO
Собраны вопросы, которые часто мне задают клиенты на консультации по поисковому продвижению связанными с заголовками h1. Здесь я даю краткие ответы на них.
Хотел сказать спасибо за отличные статьи! Надеюсь вы не забрасите проект.
И вам спасибо за добрые слова 🙂 Не забросим, скоро он будет еще полезнее.
Статья огонь! Спасибо огромное!
Скажите, пожалуйста, как поступить, когда в общей статье нужно кратко описать сопутствующие темы? Например, сайт по грамматике английского языка: у нас есть общая статья про «глагол to be», в ней мне нужно кратко описать «модальную конструкцию be to», «be в прошедшем времени».
Но, «модальная конструкция be to», «be в прошедшем времени» — это тоже две отдельные большие статьи. Просто в общей статье я хочу кратенько о них написать. Соответственно, мне придется использовать заголовки h2 для этих ключевые .
А, когда я буду писать отдельные статьи про «модальная конструкция be to», и «be в прошедшем времени» , то мне придется опять использовать эти ключи в заголовках, которые уже были использованы в общей статье. Помогите, пожалуйста, разобраться.
Как решить этот ребус 🙂
Спасибо большое!
Здесь больше вопрос связан с семантикой и дубликатом запросов, а не с тегами h1 и как поступить зависит от размера статьи «глагол to be», она будет большая и помимо краткого описания «модальная конструкция be to», «be в прошедшем времени» там будет что то еще?
Статья реально хорошая и очень познавательная, как для сео-аналитиков, так и для верстальщиков и ИП-шников, спасибо.
Очень крутая статья, узнал много нового, спасибо