Расставляем теги h1-h2 правильно — повышаем конверсию сайта

Оглавление (нажмите, чтобы открыть):

Заголовки (теги h1, h2, h3) в HTML5 и SEO заблуждения

Первый заголовок, на который часто посетитель сайта не обращает внимание — тот, который показан на вкладке браузера (подробнее про тег title ). Для поисковой системы он самый главный, так как именно его Яндекс, Google и др. чаще всего (см. исключения) используют в качестве заголовка сниппета.

Второй заголовок находится в теге h1 . Далее подзаголовки меньших размеров. Если собрать их все, то должна быть чётко видна структура веб-документа подобно главам школьного учебника. Такая раздробленная на разделы и подразделы информация легко воспринимается, найти необходимый материал на странице не вызывает затруднений.

Важные замечания:

  • заголовок доступно поясняет содержание страницы, раздела, подраздела. Это не инструмент оформления текста. Не нужно им выделять пункт меню, который ничего не содержит, кроме заголовка.
  • заголовок — это слово, фраза, предложение. Он не должен быть длинным.
  • заголовок — это всё предложение, а не его часть. Для оформления одного-нескольких слов существуют такие теги как strong , mark , em и др. (посмотреть весь список).
  • если статья строится в формате «вопрос-ответ» и ответ в большинстве случаев короткий (например, инструкция лекарственного препарата), то вместо тегов h правильней использовать тройку dl , dt , dd .

Проверить h1 страницы

Сейчас фразу в любом теге можно сделать заголовком с помощью стилей CSS: увеличить шрифт и/или размер текста. Для того, чтобы проверить количество тегов h1 и их содержимое, достаточно посмотреть код страницы сайта с помощью браузера, никаких дополнительных расширений не требуется. Такой инструмент, можно вывести, если нажать клавишу :

Разница в использовании h1 , h2 , h3 , h4 , h5 , h6 в HTML5 и HTML4

Один h1 на странице (версия HTML4)

  • Пошаговое решение судоку
    • Программа решения судоку с объяснениями (онлайн)
    • Правила игры
    • Алгоритм заполнения ячеек кроссворда
      • Способ 1. «Скрытые одиночки»
      • Способ 2. «Одиночки»
    • Методы решения судоку
      • Стратегия 1. Кандидат в двух-трёх клетках одного квадрата
      • Стратегия 2. Группы кандидатов

Иерархия на действительно существующей странице реализуется благодаря тегам h1 — h6 . h1 — самый главный, имеет самый крупный размер, можно использовать только один h1 . h6 — самый незначительный из заголовков, имеет самый маленький размер и самый высокий уровень вложенности. Такой вариант наиболее распространён у SEO оптимизаторов:

Заголовки h1 — h6 в HTML5

Каждый пункт дерева заголовков создаёт один из вариантов:

  • body , когда нет h1 — h6 перед первыми дочерними тегами article , aside , nav , section .
  • структурные теги article , aside , nav , section . Дочерние h1 — h6 будут вложены в предшествующий структурному тегу заголовок.
    Внимание: header , main и footer не являются структурными тегами.
  • h1 — h6 , которые не имеют родителя blockquote , details , fieldset , figure и td . Уровень вложенности пункта определяется рангом тега h .

Важные замечания:

  • Документ может содержать несколько заголовков верхнего уровня (в примере ниже пункты 1-3).
  • Документ или даже структурный тег могут содержать два и более тега h1 (в примере ниже пункты 2.1-2.3).
  • Последовательность h не важна, можно пропускать теги: h1 » h2 » h4 . Если отсутствует h1 , его место займёт h2 или даже h6 .
  • Можно изменять порядок тегов: h3 » h4 » h1 ( h1 будет иметь тот же уровень вложенности, что первый тег h , в нашем случае h3 ).
  • Так как код перестаёт быть интуитивно понятным, спецификация рекомендует (необязательно):
    • каждый структурный тег начинать с h1 . Но на устройствах, не поддерживающих HTML5 или в крайнем случае CSS, будет ужасная картина.
    • теги h оборачивать в структурный тег. Но, объём HTML-кода влияет на скорость загрузки веб-страницы. Поэтому не особо хочется его увеличивать, если не требуется внешне (скажем, цветом фона) или семантически отделить границы разделов.
  • 1
    • 1.1
    • 1.2
      • 1.2.1
    • 1.3
    • 1.4
    • 1.5
      • 1.5.1
  • 2
    • 2.1
    • 2.2
    • 2.3
  • 3

Важные замечания:

  • Если над или в article , aside , nav , section отсутствует тег h , пункт будет иметь заголовок untitled .
  • Теги article , aside , nav не обязательно должны иметь вложенный тег h .
  • untitled page
    • untitled article
      • untitled navigation
    • Заголовок внутри article
  • Заголовок верхнего уровня

Пример вёрстки HTML5

  • Название сайта
    • Navigation
    • Пошаговое решение судоку
      • Программа решения судоку с объяснениями (онлайн)
      • Правила игры
      • Алгоритм заполнения ячеек кроссворда
        • Способ 1. «Скрытые одиночки»
        • Способ 2. «Одиночки»
      • Методы решения судоку
        • Стратегия 1. Кандидат в двух-трёх клетках одного квадрата
        • Стратегия 2. Группы кандидатов
      • Комментарии
    • Последние сообщения

Оптимизация структуры заголовков и подзаголовков веб-страницы

Что думают поисковые системы? Они, с одной стороны, не должны наказывать за то, что вебмастер следует стандартам вёрстки, а, с другой стороны, должны ориентироваться на большинство. Реальность такова: с появлением HTML-редакторов, это самое большинство не будет разбираться с тонкостями разметки. Им затруднительно переключиться на вкладку «HTML» чтобы картинке прописать атрибут alt , а секции наверно вообще за гранью понимания (см. меню сайта «грамота.ру»).

Также в алгоритм поисковиков может быть заложено удобство пользования сайтом, например, более эстетично и естественно, когда часть заголовка не является ссылкой.

Официальные сообщения Яндекса:

  1. Правильное оформление заголовков в тексте помогает . роботу Яндекса проще разобраться со структурой документа. Поэтому следует выделять этими тегами заголовки в соответствии с иерархией документа. [help.yandex.ru]

SEO заголовок по итогам эксперимента

Эксперимент 1: «Оптимальное количество h1 »

Изначально в статьях учитываются последовательность (чем ближе к началу, тем слово более значимо) и плотность [wikipedia.org] ключевого слова, в частности:

  1. ключевое слово употребляется только дважды, а именно в тегах h на одинаковом удалении от начала фразы,
  2. почти одинаковое количество текста,
  3. одинаковые по длине заголовки,
  4. первый h1 — это заголовок верхнего уровня (он не имеет родителя article, aside, nav, section). Это важно (см. HTML5)!

7-6-5 лет [google.ru]. Для Google более привлекателен вариант использования двух h1 , где первый — имя сайта (Гугл старательно вычленяет название веб-проекта, даже если это ссылка на внутреннюю страницу стороннего блога [google.ru]), второй — название статьи.

6-5-7 лет [yandex.ru]. В Яндексе h1 должен быть единственным. То есть на Главной h1 — это название сайта, а на внутренних страницах — название внутренних страниц.

Примечание: в Гугле индексация молниеносна, поэтому тут было проверено и отсутствие влияния алгоритма «Google Fresh». Позиции сменились после того, как страницы были добавлены в Г+. То есть да, есть разница один h1 или несколько, но этому поисковики придают очень маленькое значение.

Эксперимент 2: «Есть ли толк от h3 »

Яндекс и Google не вносят h3 в заголовок сниппета. На экспериментальной странице не были использованы title , h1 , h2 .

Исключение для Яндекса: когда выделенный абзац содержит от 20 до 200 символов. Здесь не важно в каком теге он будет находиться: хоть в h3 , хоть в span .

SEO советы

Утверждение 1: заголовок верхнего уровня должен содержать ключевые фразы, но при этом не быть спамным, то есть слова внутри него должны склонятся согласно правилам русского языка. Плохой пример: «Одежда оптом от производителя недорого».

Утверждение 2: чтобы не писать несколько одинаковых по смыслу статей, в заголовки меньшего уровня желательно включить похожие запросы и синонимы. В большинстве случаев для их нахождения достаточно фантазии, wordstat.yandex.ru и поисковых подсказок. То, что менее востребовано и не помещается в заголовки, можно упоминуть в тексте.
Важно: нет необходимости впихнуть весь перечень wordstat. Текст должен быть интересным, читаемым и «без воды».

В примере с судоку люди ищут одно и тоже, но называют это по разному: «методы», «алгоритм», «способы», «правила», «методика», «приёмы», «секреты», «принципы», «примеры».

Можно ли внутри тега h использовать другие теги, например, img , a ?

Заблуждение 1: внутри тегов h1 — h6 нельзя использовать другие теги.

Внимание: в ряде CMS (в т.ч. Blogger) есть поле с названием страницы сайта. Его содержимым автоматически заполняется h1 и большая часть title . Остальная часть title или отсутствует, или одинакова для нескольких страниц, например, ей может быть название сайта. Но в теге title может находиться только текст [w3.org]. Поэтому нельзя в поле названия страницы вносить какие-либо теги.

Заблуждение 2: в заголовке не должно быть картинки. Две записи равнозначны для w3.org, Google, но не для Яндекса (не индексирует атрибут alt ):

Заблуждение 3: не стоит заключать заголовки в дополнительные контейнеры. Откуда ноги растут у этих утверждений? Нужно, например, выравнять заголовок по вертикали:

Утверждение 1: заголовок страницы или его часть не должны быть ссылкой (см. здравый смысл и справка Новости.Google). Отсюда следствие: название веб-проекта на Главной также не должно быть ссылкой. В целом не нужно чтобы страница ссылалась сама на себя (искл. ссылки к определённому участку страницы, так называемые хэш-ссылки). А вот так допустимо (на Авито на странице объявления каждой похожей записи дан h3 ):

Утверждение 2: есть небольшая разница в том как располагать ссылку: внутри тега h или тег h внутри ссылки. И она заключается в том, что в первом случае ссылкой является только текст, а во-втором — весь блок.

Должен ли title отличаться от h1 ?

«Может ли title быть таким же как h1 ?» — да, может.

«Различный title и h1 полезны для SEO?» — да, полезны. В рассматриваемые теги можно добавить дополнительные ключевые слова, чтобы увеличить хвост запросов, по которым приходят на сайт. Или чтобы сделать более привлекательный сниппет, в title внести, скажем, название компании, коли фирма на слуху, или номер телефона (для такси, например).

Примечание: для того, чтобы страница могла присутствовать в Новостях Google [support.google.com] или быстрых ссылках Яндекса [help.yandex.ru], основная часть title и h1 должны совпадать. Это может быть вызвано тем, что посетители ожидают увидеть на странице сайта тот же заголовок, что в выдаче поисковиков. На данный момент стоит обратить внимание информационным сайтам.

Нужно ли заголовки боковых блоков брать в h ?

Если заголовки индексируются (см. что сделать, чтобы поисковик не проиндексировал текст), то пусть лучше будут в теге h . Всё равно они употребляются на каждой странице сайта и вес этих слов («Реклама», «Последние сообщения», «Подписка» и т.п.) завышен. Можно предположить, что родитель aside должен уменьшать их значение.

К тому же для слабовидящих будет понятно что к чему, а не сплошные untitled .

Заголовки h1-h6

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

Именно по seo заголовкам Google и Яндекс определяют, насколько тематика Вашей страницы совпадает с запросами, которые вводят пользователи. Иными словами, насколько релевантна данная страница. Релевантность страниц – один из главных факторов seo продвижения.

h1 — главный подзаголовок в статье, который обычно размещен над текстом.

h2-h6 — маленькие подзаголовки, которые проставляются по принципу вложенности.

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

Самый главный заголовок страницы размечается тегом h1. Это может быть название страницы, статьи или товара. Это обязательный заголовок и он должен присутствовать на всех страницах сайта без исключения. Очень часто встречаю, что тега h1 просто нет или их несколько. На месте заголовка страницы заместо h1, находится тег h2. Это еще в лучшем случае — бывает что вообще нет заголовков типа H на странице. А то что выглядит типа заголовка, просто обычный div или span блок с прописанными заранее стилями подходящими на заголовок.

Каждая страница вашего сайта несет в себе какую-то конкретную информацию (во всяком случае, должна нести). Основную суть информации вы и будете размещать в заголовке. Например, если вы продаете 3D-телевизоры, значит заголовок страницы должен выглядеть как основной запрос и выделяться в html коде страницы тегом h1.

Основные требования к h1

  • На странице должен присутствовать только один заголовок первого порядка (заголовок 1, h1). Это главный заголовок, видимый пользователю и отражающий ключевую суть поста.
  • Заголовок H1 всегда стоит в начале текста.
  • Длина заголовка должна быть не более 65 символов.
  • H1 должен быть уникальным в рамках вашего сайта.
  • Тег H1 не должен быть ссылкой, картинкой и т.д. Заголовок должен быть заголовком.
  • В H1 старайтесь заключать самое частотное ключевое слово.

Заголовок h2

Если h1 многие все же придерживаются правил и используют на страницах своего сайта, то тегом h2 многие пренебрегают, а зря! Этим тегом обычно размечаются подразделы статьи, страницы.

Мастер Йода рекомендует:  Технический директор Facebook хочет уйти из компании

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

Например, страницы товара в магазине телевизоров — если заголовок h1 страницы имеет вид «Телевизор Panasonic TX-75EXR780», то тегом h2 мы будем примерно разбивать на части (подразделы) описание самого товара на странице и иметь вид «Характеристики телевизора Panasonic TX-75EXR780» и «Преимущества телевизора Panasonic TX-75EXR780».

Тем самым мы за счет заголовков типа h2 захватим важные моменты, которые также могут интересовал посетителя сайта помимо самого названия. Теперь сайт будет конкурировать с остальными не только по запросу по основному «Panasonic TX-75EXR780», но и по дополнительным запросы касаемо преимуществ и характеристик данной модели телевизора. А охват большего числа запросов в свою очередь — это рост трафика на сайт.

Иногда заголовок типа h2 попадал в сниппет результатов поиска. Туда как правило попадает либо h1, либо title — они оба самые сильные по важности заголовки страницы и за ними преимущество, но не исключено и влияние h2 на сниппет.

Основные требования к h2

  • На странице желательно наличие 2-4 заголовков H2. Должны отражать суть дальнейшего текста.
  • Наиболее частотный запрос — в заголовке H1, менее частотные — желательно в H2.
  • Тег H2 не должны быть ссылкой, картинкой и т.д. Заголовок должен быть заголовком.

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

Все заголовки начинаz с h3 и до h6 несут в себе уточняющую и дробящую страницу на подразделы роль, но это используется крайне редко. У вас должна быть просто очень огромная статья, чтобы можно было выстроить такую иерархию из подразделов страницы и задействовать все типы заголовков.

Основные требования к h3-h6

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

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

Все заголовки должны идти в строгом порядке. Первым на странице всегда идет заголовок типа h1.

Далее за ним разбивая страницу на подразделы идет тег h2 и часто этого более чем достаточно.

Если подразделы для каждого из заголовков h2 получились внушительных размеров и в них затронуты несколько еще более мелких подтем, то внутри каждого или одного отельного подраздела с тегом h2 вы делаете сложенные «мини» подразделы страницы и размечаете их h3.

Не обязательно что все подразделы озаглавленные тегом h2 будут большими и их надо дробить еще на несколько подразделов.

Вот пример хорошей иерархии заголовков из статьи по продвижению сайта на WordPress:

Как заполнять h-теги в WordPress

h1 по умолчанию заполняется в поле над статьей:

Чтобы сделать подзаголовки h2-h6, надо выделить необходимый элемент или поставить курсор на нужную строку и, наведя курсор на вкладку «заголовки», выбрать нужный, кликнув по нему.

Есть еще более простой способ – можно набрать текст в Ворде, используя нужные разметки и просто копипастом перенести статью в редактор вордпресса. Выделенные в Word заголовки автоматически отобразятся в нужных размерах. При необходимости можно подправить их, используя инструменты редактора CMS WordPress.

Правильная расстановка заголовков в тегах h1, h2, h3, h4, h5, h6 может дать отличный результат для SEO сайта. По этому, не жалейте времени на настройку.

h1-h6 заголовки имеют чрезвычайно важное значение. Не стоит ими пренебрегать, но и злоупотреблять тоже не стоит. Заголовки могут как поднять, так и опустить сайт.

Как правильно использовать заголовки H1 и H2 при оптимизации текстов

Грамотный подбор и расстановка заголовков H1 и H2 при оптимизации текстов на продвигаемых страницах сайта – важный этап seo работ. В этом материале мы расскажем о том, что такое заголовки H1 и H2, какую роль они играют, а также научим правильно использовать их для достижения наилучшего результата.

Что такое заголовки H1 и H2?

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

Тексты на сайтах также должны иметь заголовки. Этому существует как минимум 2 причины:

1. Заголовки структурируют текст, делают его более удобным для чтения. Сплошной текст (часто его называют «простыней») труден для восприятия, читать его не хочется. А так как поведенческие факторы (совокупность действий посетителей на сайте) сегодня учитываются поисковыми системами, вы заинтересованы в том, чтобы пользователь прочел текст на вашем ресурсе, а не закрыл страницу, испугавшись «простыни».

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

Теперь вы понимаете, что пренебрегать использованием заголовков в текстах на страницах сайта не стоит? Тогда следуем дальше!

Что же обозначают термины H1 и H2? Нам придется немного затронуть вопросы, касающиеся html-верстки. Н1 и H2 (а, точнее,

) – html теги, которые показывают важность текста, следующего после них. Их еще называют тегами акцентирования. В html-документе это выглядит так:

На веб-странице такие заголовки по умолчанию имеют разное форматирование:

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

Что нужно знать для грамотной расстановки заголовков H1 и H2?

Заголовок H1 играет важную роль не только при оптимизации текста, но и при оптимизации всей страницы. Именно он сообщает поисковой системе, насколько контент, представленный на странице, соответствует заголовку страницы (Title), а, следовательно, отвечает ожиданиям пользователей.

Вы придумали для текста креативный, необычный, привлекательный заголовок, основанный, например, на игре слов? Такой подход может быть хорош для печатной рекламы или газетной статьи, однако для поискового продвижения такой креатив может принести негативные последствия. Поисковые системы не обладают фантазией и образным мышлением, им важна конкретика. Ниже мы приведем важные рекомендации для составления заголовка H1.

Основные правила использования заголовка H1

Заголовок H1 должен быть кратким, но емким. Важное условие – естественное вхождение в него ключевых слов. Приведем пример. Допустим, вы оптимизируете страницу, на которой представлен каталог женской обуви. Для продвижения данной страницы выбраны следующие запросы (о том, что такое поисковые запросы, вы можете прочесть в нашем материале «Понимай своего сео-специалиста»): «женская обувь» (частотность — 3896), «женская обувь в Минске» (частотность — 490), «купить женскую обувь» (частотность — 384), «обувь для женщин» (частотность — 207), «женская обувь каталог цены» (частотность — 318). Для текста на данной странице логичнее всего использовать заголовок H1 «Женская обувь», так как он является наиболее общим, но в то же время описывает содержание контента, а также может быть конкретизирован заголовками более никого уровня.

Заголовок H1 должен встречаться на странице только один раз.

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

Заголовок H1 должен располагаться выше заголовков других уровней (перед ним не допускается ставить, например, заголовок H2).

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

Примеры составления заголовков H2

Каким образом составляются заголовки H2? Их в тексте может быть несколько. Как правило, они конкретизируют заголовок H1 и структурируют весь текст. Вернемся к нашему примеру со страницей, на которой представлена женская обувь. Для данной страницы можно написать продающий текст, в котором будут описаны преимущества моделей, предлагаемых покупательницам, и представлена таблица размеров. Также на странице пользователь сможет найти каталог обуви с фото и ценами. При этом заголовки в тексте могут быть такими:

Если вы вспомните поисковые запросы, которые мы используем для продвижения нашей страницы в данном примере, то поймете, что в заголовки H2 мы включаем расширенные запросы, которые имеют более низкую частотность. Они могут быть представлены в непрямом вхождении (их можно склонять, «разбавлять» другими словами). А главное – они конкретизируют наш заголовок H1 и сигнализируют поисковой системе о том, что текст, идущий после них, действительно отвечают поисковым запросам, прописанным в заголовке страницы (Title).

Наиболее распространенные ошибки использования заголовков H1 и H2

При использовании заголовков для оптимизации текстов постарайтесь избежать следующих ошибок:

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

заключены, например, названия блоков. Допустим, такие как «Популярные товары», «Последние новости», «Мы в социальных сетях» и проч. Такой прием вводит в заблуждение поисковые системы и не приносит ничего хорошего. Поэтому при проведении сео-аудита сайта специалист обязательно проверяет, «по назначению» ли используются заголовки. Запомните важное правило – H1 и H2 должны применяться лишь для структурирования текста!

Использование одинаковых заголовков для разных страниц. Это, конечно, нонсенс, однако и такое встречается. Как минимум заголовки H1должны быть уникальны для каждой страницы!

Помещение в заголовки гиперссылок.

Присутствие на странице двух и более заголовков H1. Мы помним, что это недопустимо! Наш девиз: «Одна страница – один заголовок H1»!

В заключение нашей статьи обратим ваше внимание на еще один важный момент. Речь снова пойдет о шаблонах сайтов. Известны случаи, когда в стандартных шаблонах страниц вовсе нет заголовков H1. Вместо них идут заголовки H2. Даже если в административной части сайта вам предлагается ввести текст в поле «Заголовок материала», на деле может оказаться, что он будет заключен в теги

О важности правильной расстановки заголовков текста следует напомнить и разработчику, мало знакомому с seo, при верстке уникального сайта.

Мета-теги

Правильная настройка мета-тегов очень важна для SEO. Работы по заполнению, прописыванию, корректировке мета-тегов всегда выполняются при запуске проекта, сразу после того, как собрано семантическое ядро. И продолжаются по мере необходимости в течение всего периода продвижения сайта. Иногда достаточно лишь небольших изменений в метатегах, чтобы сайт вышел в ТОП10. Особенно это актуально для низкочастотных запросов, а также в тех случаях, когда сайт уже находится достаточно высоко по данному запросу (например, 11-15-я позиция в поисковой выдаче), и нужно совсем немного, чтобы выдвинуть его в ТОП. Зачастую под SEO-тегами подразумеваются Title, Description и Keywords. Однако тегов намного больше. И в этой статье мы постараемся охватить этот вопрос максимально полно.

Содержание

Что такое мета-теги

Если быть предельно точным, то под мета-тегами следует понимать (X)HTML-теги , с помощью которых можно указать служебную информацию о странице. Такая информация размещается внутри контейнера … и не выводится на экран.

К тегам мета относятся:

  • description — описание веб-страницы,
  • keywords — ключевые слова,
  • http-equiv — тип отправляемого документа и кодировка (charset),
  • generator — CMS сайта,
  • author — автор,
  • copyright — авторские права,
  • robots — правила индексирования страницы для роботов,
  • viewport — данные о настройке области просмотра
  • и другие.

Подробнее можно прочитать в справке по HTML или Википедии.

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

В этой статье мы не будем точны с технической точки зрения и к мета-тегам отнесем те служебные теги, которые 1) важны в SEO и 2) используются в любом месте веб-документа, т.е. не обязательно привязаны к контейнеру . В связи с этим, приведем такое определение.

Мета-теги (англ. meta tags, досл. служебные ярлыки) — это служебные слова, которые содержат важную информацию о веб-документе для поисковых систем. К таким словам (тегам) относятся теги Title, Description, Hx, Robots, Canonical.

Правильные SEO мета-теги для Яндекса и Google

Рассмотрим, как правильно написать мета-теги для сайта, как их добавить и разместить в коде. Нас будет интересовать:

  • синтаксис — то, как правильно должен быть прописан мета-тег в HTML-коде сайта;
  • требования поисковых систем к тегам;
  • примеры правильного и неправильного заполнения тегов.

Следует отметить, что в большинстве CMS (систем администрирования сайта), есть специальные поля для заполнения мета-тегов, и вам не нужно прописывать их непосредственно в HTML-коде. От вас потребуется только вписать содержание тега (Title, Description, Keywords, H1, Canonical) или выбрать подходящее значение (Index/NoIndex, Follow/NoFollow). Однако следует проверять, корректно ли размещаются теги: 1) в правильных местах, 2) правильный синтаксис, 3) значения в тегах соответствуют вашим настройкам. Причем следует проверить не только на главной странице, но и на различных внутренних страницах. Например, у нас сайт интернет-магазин. В этом случае обязательно нужно проверить, корректно ли размещаются мета-теги на главной странице, внутренних информационных, страницах категорий и товаров, поскольку веб-документы каждого из этих типов могут формироваться по своему отдельному шаблону.

Теперь подробнее о каждом из тегов.

Мета-тег Title

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

Синтаксис

Тег должен находиться внутри контейнера … в любом месте.

Требования SEO

  • Заголовок должен быть уникальным на всех страницах сайта, а также не повторять Title на страницах других сайтов (для этого в конце Title можно добавить название организации).
  • Тайтл должен отражать суть страницы, должен быть информативным и кратким.
  • Должны присутствовать запросы, по которым продвигается данная страница, самые важные размещаем в начале тега, заголовок должен обязательно содержать 1-3 ключевых слова.
  • Не включайте в Title слишком много ключевых слов
  • Содержимое тегов Title и H1 должно быть разным — у них разные цели: Title заголовок для сниппета, H1 заголовок веб-страницы.
  • Не используйте специальных символов, пока не убедитесь, что они поддерживаются.
  • Не используйте спецсимволы (= / \ + _ ), знаки препинания и стоп-символы (точка, двоеточие, восклицательный и вопросительный знак) — помните, это знаки, которые разбивают пассажи в Title, что снижает взаимосвязь ключей по разные стороны от стоп-знака.
  • Составляйте тег Title для людей по всем правилам русского языка, заголовок по возможности нужно делать цепляющим и привлекательным.
  • Оптимальная длина Title – от 30 до 65 символов. Google ориентируется на длину в пикселях, рекомендуемая длина — от 200 до 571 пикселей. Если длина Title больше, то в сниппете появляется многоточие, которое также занимает дополнительное место в заголовке. Оно может появиться как в конце заголовка сниппета, так и в начале. Короткие Тайтл тоже плохо, поскольку в него помещается мало ключей. НО: при этом нет смысла придерживаться оптимальных значений длины заголовка для служебных страниц на сайте, которые НЕ продвигаются по ключевым словам.

Примеры правильного заполнения тегов

  • Купить сантехнику в Москве, интернет-магазин Куписантехнику.Ру
  • Окна REHAU в Москве, официальный сайт партнера — Пластиковые окна недорого
  • Мета-теги для сайта, Title и Description в примерах — SEOgio
  • Элемент пола Кнауф — купить в Москве по цене 310 pуб | KNAUF
  • Новости — Компания Ромашка

Ошибки и неудачные примеры мета-тегов

  • Евроремонт, ремонт дома, ремонт квартир в Смоленске, ремонт в Смоленске | Ремонт квартир, cтроительство Смоленск ( простое перечисление ключевых слов )
  • Главная – ООО Ромашка , подарки оптом, подарки сотрудникам, рекламные сувениры, корпоративные подарки. ( вначале должны быть самые главные ключевые слова )
  • Ремонт ( слишком короткий Title )
  • «Автомоечный комплекс №1»: автомойка, шиномонтаж, кафе, сауна, комната отдыха . ( название компании вначале, двоеточие, слова, по которым не будет продвигаться сайт )
  • Новости о юридических услугах и бухгалтерском обслуживании в компании Ромашка ( использование ключевых слов в заголовке страницы, которая по этим словам НЕ продвигается, это может только мешать )

Мета-тег Description

Так же один из важных тегов для продвижения страницы по ключевым словам. Описание может использоваться в сниппете.

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

Мастер Йода рекомендует:  Утомленные яблоком причины бросить Mac OS и выбрать Linux

Пример, когда description в мета и в сниппете отличаются:

Синтаксис

Тег должен находиться внутри контейнера … в любом месте.

Требования SEO

  • Должен отражать суть страницы, написан в виде согласованного текста. Может быть несколько предложений.
  • Должен быть уникальным для всех страниц сайта, не дублировать аналогичные теги на других сайтах (для этого используем название компании в тексте мета-тега).
  • В теге нужно использовать запросы, по которым продвигается данная страница, однако делать это необходимо так, чтобы они были использованы естественным образом, в нужной морфологии. Также не следует просто перечислять запросы через запятую.
  • Содержание тега не должно повторять Title.
  • Длина description должна быть не менее 70 и более 150-200 символов. Google определяет длину в пикселях, рекомендуемая длина от 400 до 930 пикселей.
  • В description желательно отразить основные преимущества компании, товара, услуги.
  • Наиболее важную информацию и фразы лучше разместить в начале мета-описания.

Примеры правильного заполнения тегов (полужирным выделены ключевые слова)

Ошибки и неудачные примеры мета-тегов

  • ( короткий, мало ключевых слов )
  • ( сгенерирован автоматически, просто вырезано начало контента на странице )
  • ( перечисление ключевых слов через запятую, неестественное мета-описание )

Мета-тег H1

Еще один очень важный тег. В нем лучше всего размещать главный, максимально частотный запрос, по которому продвигается данная страница. Заголовок страницы чаще всего должен содержать 1-3 слова. Исключение — страницы статей, товаров, проектов и т.п. То есть страницы, продвигаемые под более специфические, менее частотные запросы.
Синтаксис

Заголовки страницы h1, h2, h3 … h6

Что такое html тег h1…h6?

Теги h1, h2, h3, h4, h5 и h6 представляют из себя заголовки с первого по шестой уровень. Они определяют важность сегмента, который озаглавливают. Градация начинается от h1 — самого приоритетного, и заканчивается h6, который имеет низший приоритет из всех.

При этом на странице может быть не более одного заголовка h1, так как именно этот тег описывает все содержимое страницы целиком.

Заголовков h2…h6 в документе может быть сколько угодно.

Все они имеют крайне простой синтаксис. Начинается заголовок с тега

, далее следует текстовое описание, которое обрамляется закрывающим тегом

Тут находится текст заголовка

На рисунке ниже представлен заголовок внутри HTML страницы.

Заголовки любого уровня, с точки зрения HTML, являются блочными элементами и всегда отображаются на новой строке. Это позволяет визуально разделить текст на смысловые блоки.

Пример заголовка h1

Пример заголовка h1 можно увидеть прямо на странице с данной статьей. Выглядит он следующим образом.

Его синтаксис крайне прост:

Заголовки страницы h1, h2, h3 … h6

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

Пример заголовков h2…h6

Наглядный пример вложенных заголовков h2 и h3 можно увидеть на странице https://dh-agency.ru/title/ (Для удобства, на рисунке мы убрали текст статьи)

Роль тегов h1…h6 в SEO

В SEO продвижении заголовок первого уровня h1 занимает особую роль. Он описывает содержимое всего документа и в отличии от отображается на странице. По сути, это второй по важности тег для поисковой системы после title. Именно в h1 заключается самый частотный запрос, который озаглавливает содержимое всей продвигаемой страницы. Пишется данный тег с учетом множества требований, которые крайне важны для SEO.

Подзаголовки h2, h3, h4, h5 и h6 структурируют документ разбивая его на блоки различной степени вложенности. Опираясь именно на данные теги поисковая система определяет важность того или иного отрывка текста. Не стоит весь материал озаглавливать тегом h1 или h2. От этого он не станет «весомее». Вы просто потеряете возможность «расставлять» приоритетность внутри статьи. В таком случае, робот самостоятельно определит приоритетные и второстепенные отрывки, которые в итоге могут не совпадать с Вашим видением ситуации.

Правильно прописываем h1

Качественный заголовок h1 должен соответствовать ряду серьезных требований.

Кратко и понятно описывать содержимое всей страницы;

Быть написан на том же языке, что и весь материал страницы;

Не содержать в себе сложных аббревиатур, технических параметров и сокращений;

Быть длинной не более 60 символов, при этом располагаться на странице в одну строку;

(Длинные заголовки неудобны для чтения и плохо воспринимаются поисковыми системами.)

Содержать самые важные ключевые слова страницы;

Не содержать в себе SEO СПАМа и не быть похожим на тег keywords;

Не вводить пользователей в заблуждение;

Иметь уникальное содержимое;

Быть одним на странице;

Ошибки при написании h1

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

Слишком длинный заголовок;

Заголовки имеющие длину более 70-100 символов плохо читаются, к тому же поисковой системе сложнее почерпнуть из них суть статьи.

Заголовки состоящие из ключевых слов;

Наличие SEO СПАМа может повлечь за собой исключение из поисковой выдачи. Не стоит превращать содержимое тегов

Если Ваша фирма недостаточно известна, наличие ее названия в h1 повлечет за собой потерю драгоценного места.

Заголовки, которые не описывают суть статьи.

В первую очередь, h1 должен описывать суть страницы, а уже потом быть привлекательным и продающим.

Наличие множества h1 в статье.

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

Правильно прописываем h2…h6

Для заголовков h2…h6 требования немного мягче. Для них справедливо все указанное выше, но при этом:

Тегов одного уровня на странице может быть несколько; (К примеру, можно иметь 3 тега h2 в одном документе)

Они должны описывать только тот блок, который озаглавливают;

Могут иметь длину до 80 символов;

Содержание технических параметров, аббревиатур и сокращений допускается; (Допускается, но не приветствуется)

  • Должны содержать в себе менее частотные ключевые слова; (В сравнении с тегом h1)
  • Ошибки при написании тегов h2, h3, h4, h5 и h6 очень схожи с теми, что допускают при создании h1. Поэтому, мы не будем уделять им внимание.

    Заголовки h1, h2,…h6 для WordPress

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

    Обратите внимание, что добавлять

    в текст статьи не нужно, так как это приведет к дублированию тега. Что для SEO может иметь негативные последствия.

    Символьного ограничения данное поле в WordPress не имеет, поэтому придерживайтесь основных требований написания.

    Заголовки второго, третьего, четвертого, пятого и шестого уровня — h2, h3, h4, h5 и h6 прописываются в теле статьи напрямую в HTML разметке или при помощи визуального редактора.

    Заголовки h1, h2,…h6 для Joomla!

    Так же, как и в WordPress, в Joomla! заголовок выводится из названия статьи. Данное поле не имеет ограничений по количеству символов, поэтому ориентируйтесь на допустимые размеры заголовков.

    Создавая первую статью, обязательно проверьте, корректно ли выводится заголовок и расположен ли он в тегах

    Принцип создания вложенных заголовков при помощи тегов h2, h3, h4, h5 и h6 схож с WordPress. Их так же можно добавить через редактор HTML кода или с помощью визуального оформления.

    (Вид редактора может отличаться в зависимости от версии Joomla! или установленных модулей и настроек.)

    Заголовки h1, h2,…h6 для Opencart

    В Opencart для заголовка отведено отдельное поле, которое так и называется «HTML-тег H1». Это достаточно удобно, так как название может отличаться от фактически выводимого h1.

    Как и в других CMS, никаких ограничений внутри поля тут нету.

    Заголовки второго, третьего и т.д. уровней (h2, h3, h4, h5 и h6) прописываются в статье самостоятельно. Делается это так же, как и в других системах управления при помощи HTML разметки или редактора.

    Использование и оптимизация мета тега h1: примеры использования ключа в теге h1

    В виду последних событий в мире SEO, текстовые факторы стали иметь значительный вес в ранжировании. И если еще пару лет назад можно было махнуть рукой на оформление текста, то сейчас вы за это поплатитесь.

    Мета тег H1: пример оформления и основная информация

    HTML предлагает 6 разноуровневых заголовков, которые обозначают то, насколько важен текстовый блок, идущий после заголовка.

    Таким образом, тег

    является самым важным заголовком первого уровня, а тег

    обозначает заголовки шестого уровня, наименее значительные. По умолчанию, тег заголовка h1 отображается самым крупным шрифтом и выделяется «жирненьким», заголовки, которые ниже рангом, соответственно, должны быть меньше.

    Теги заголовков относят к блочным элементам: тег

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

    Как вставить тег заголовка H1 в текст на сайте?

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

    Использование ключа в теге: оптимизация тега H1

    Мета теги h1 -h6 обязательно следует использовать по назначению, неукоснительно соблюдая иерархию.

    Дело в том, что поисковые роботы очень трепетно относятся к заголовкам и тому, что в них содержится. Важность и степень внимания поисковика определяются уровнем заголовка (понижается от h1 до h6). Поэтому мы настоятельно рекомендуем использовать ключ в теге h1 и фразы в тексте заголовков.

    (заголовок первого уровня) имеет самый большой вес, конечно же. Поэтому к его текстовому содержанию нужно отнестись с особой серьезностью.

    можно только вверху страницы сайта, над заголовками других уровней. Также во многих админках есть специальное поле для заголовка h1.
  • Следует избегать хаотичного использования заголовков разных уровней и размещать их «как повезет». Поисковику (да, и пользователям) это вряд ли понравится.
  • Ни в коем случае не используйте мета тег
  • более одного раза на странице.
  • По-умолчанию в различных браузерах заголовки выглядят по-разному: отличаются размерами шрифта и отступами. Посему советуем вам отрегулировать эти параметры при помощи стилей. НО! Не перебодритесь с уменьшением шрифта, т.к. поисковые роботы обращают на это внимание. Также не рекомендуем делать размер шрифта заголовка меньше, чем основной текст.
  • Делать больший размер шрифта заголовка низкого уровня также не советуем. Если ваш
  • будет больше, чем

    , то поисковой робот отнесется к этому негативно.
    И пожалуйста, перестаньте использовать теги выделения (strong, em, b, i) в оформлении ваших заголовков. Cодержание тегов заголовков имеет большее влияние на релевантность страницы по сравнению тегами выделения.

    По мнению большинства сеошников (и мы к ним присоединяемся) содержание текста внутри тегов strong (жирненький текст) по степени значимости приблизительно соответствует содержанию заголовка уровня h5. А это так себе уровень.

    Как проверить тег h1 на странице

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

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

    Горячие клавиши, которые помогут вам открыть код страницы.

    Можно ли не использовать тег h1 и другие подзаголовки?

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

    В сфере поисковой оптимизации очень сложно дать однозначные ответы на вопросы. Это далеко не связано с компетентностью специалиста, хотя доля правды в этом есть. Каждый вопрос, предположительно, должен преследовать достижение какой-либо цели. Исходя из этого ответы на вопросы уже могут разниться, и вы можете получить совсем другой результат.

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

    Одним из критериев успешного ранжирования является соответствующая запросам пользователя, актуальная и правильно структурированная информация.

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

    Заголовок h1 помогает пользователю понять общий смысл содержания страницы. Как правило, текст на странице имеет вполне конкретную смысловую единицу, она одна, поэтому и главный заголовок должен быть один. Далее контент, если структура предполагает, можно разбить на небольшие смысловые блоки, и каждый блок будет иметь свой подзаголовок. Очень важно соблюдать вложенность, то есть после после H1 необходимо использовать H2, а после H2 используется H3. Все вполне логично.

    Заголовки и подзаголовки должны нести смысловую нагрузку и не использоваться для других целей.

    А теперь вернемся к вопросу:

    Ответ очевиден: Можно, если вам не особо важно продвижение вашего сайта в сети.

    Исчерпывающие правила создания заголовка H1 для страниц сайта

    Что такое тег h1?

    h1 – это HTML-тег , указывающий на заголовок страницы сайта.

    Давайте по порядку.

    • HTML расшифровывается как Hyper text mark-up language – «Язык разметки гипертекста». Большинство сайтов используют этот язык, чтобы создавать веб-страницы.
    • Тег – это тег HTML, который является частью кода. Он посылает браузеру сигнал о том, как отображать ваш контент.
    • Заголовок – в системе HTML есть шесть разных тегов заголовка — h1, h2 и так далее. Тег h1 считается самым важным, а тег h6 наименее значимым. Теги часто отличается друг от друга по размеру – самый большой тег является самым важным, а самый маленький наименее значимым.

    Рис. 1. Теги часто отличаются по размеру

    Если бы Вы хотели создать h1 в HTML, он бы выглядел примерно вот так:

    Привет, меня зовут Заголовок номер один!

    Для примера. Откройте любую веб-страницу и выполните следующие шаги.

    1. Убедитесь в том, что Вы находитесь на веб-странице.

    Рис. 2. Пример веб-страницы

    2. Посмотрите на источник кода.

    Чтобы это сделать, используем правую кнопку мышки (кликаем по пустой области страницы сайта) и выбираем пункт «Исходный код страницы» (инструкция для Firefox).

    Рис. 3. Как просмотреть источник кода на веб-странице

    Вот что Вы увидите, просматривая источник кода:

    Рис. 4. Пример источника кода

    3. Найдите тег h1.

    Нажмите CTRL + F и откройте строку поиска в своем браузере. После нажатия CTRL + F, появляется маленькое окошко поиска в верхнем правом углу окна браузера.

    Введите «h1», затем нажмите кнопку «Enter». Браузер выделит h1 на странице.

    Рис. 5. Тег h1 на странице исходного кода

    Текст между тегом h1 «SEO-продвижение сайта» и есть Заголовок H1.

    Почему тег h1 так важен?

    Тег h1 всегда был очень важным фактором ранжирования.

    Было немало трендов в сфере SEO, которые становились популярными, а затем исчезали, но теги h1 всегда имели большое значение.

    В недавнем обзоре факторов ранжирования от «Moz», теги являются третьим самым весомым фактором ранжирования.

    h1 – это, как правило, визуально самый заметный контент на странице.

    Это, возможно, самая важная SEO-функция тега h1. Хотя поначалу, Вы можете не осознавать всю значимость тегов h1.

    Почему нет? Потому, что они скорее ориентированы на пользователя, чем на техническую оптимизацию страницы, да?

    Да! Именно в этом направлении движется SEO-оптимизация в последние годы. В наши дни SEO в большей степени ориентируется на пользовательскую оптимизацию, чем на оптимизацию в поисковой системе.

    Не забывайте о том, что пользователи должны замечать H1. Этот тег имеет значение!

    Тег H1 является одной из наиболее мощных стратегий SEO и ключевым пользовательским элементом в Вашем арсенале.

    Теперь давайте обсудим, как это работает.

    Как создать убийственный тег h1?

    Тег h1 – это не какая-то секретная стратегия. На самом деле, практически все знают что-то о SEO-оптимизации или HTML и используют теги h1.

    80 % сайтов в топе результатов Google используют тег h1.

    Рис. 6. 80 % сайтов в топе результатов Googleиспользуют тег h1

    Вот правила создания тегов h1. Следуйте моим советам, и у вас будут идеальные теги h1.

    1. Используйте только один тег h1.

    На каждой странице должен быть только один тег H1. Нет причин для использования более одного тега H1.

    Почему так? Если один тег так хорош, почему бы не использовать два или даже шестнадцать?

    Это неправильный ход мысли.

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

    Наличие более одного тега H1 не обязательно собьет поисковую систему с толку, но может рассеять ту силу SEO, которая концентрируется вокруг одного H1.

    2. Ваш тег h1 должен описывать тему вашей страницы.

    На самом базовом уровне, тег h1 должен описывать ваш контент.

    1. Часто тег h1 похож на тег оглавления.
    2. Обычно тег h1 является заголовком статьи в Вашем блоге.
    3. Как правило, тег h1 дает читателю представление о том, что он будет читать.

    3. Длина тега h1 должна составлять 20-70 символов.

    Не зацикливайтесь на длине тега h1. Она не играет такой роли, как раньше.

    Единственная причина, по которой я об этом говорю – это желание Вас предостеречь. Если тег слишком короткий, Вы теряете ценное пространство. Но если он слишком длинный, мощность тега рассеивается.

    Оптимальная средняя длина тега – 20-70 символов.

    4. Ваш тег h1 должен выделяться.

    Тег h1 должен быть самым важным визуальным элементом на странице.

    1. Он должен быть большим.
    2. Он должен быть заметным.
    3. Нужно использовать такие визуальные элементы, форматирование и стиль, которые заставят Ваш тег выделяться.

    Почему это важно?

    Как я уже говорил ранее в статье, пользовательский опыт – это самое важное.

    Блог SmartPassiveIncome – это отличный пример правильного форматирования. Теги h1 Пэта Флинна очень мощные.

    Я взглянул на исходный код и вот, что я увидел:

    Вот еще один пример из блога Рамита Сетхи.

    Можете угадать, где его тег h1?

    Да. Тегом h1 в данном случае является предложение: «А знаете, сколько вы могли бы зарабатывать?».

    То, что я пытаюсь вам сказать, связано с пользовательским опытом. Я остановлюсь на этом подробнее в следующем разделе.

    5. Создавайте такие теги h1, которые обеспечивают хороший пользовательский опыт.

    За последние несколько лет SEO-оптимизация сильно изменилась. Главное изменение связано с огромным влиянием пользовательского опыта на SEO.

    Чтобы лучше понимать соотношение SEO и пользовательского опыта, давайте рассмотрим диаграмму Венна.

    Эта диаграмма была опубликована в 2012 году.

    В 2020 году SEO, вероятно, займет еще меньший круг в сравнении с дизайном и юзабилити.

    Дело в том, что поисковые системы развиваются настолько быстро, что они предсказывают, чего именно хотят пользователи, когда они ищут или просматривают что-то.

    Имейте в виду, что благодаря машинному обучению поисковые системы постоянно меняются. Изменения алгоритма предотвращают массовые сбои в работе поисковых систем и в результатах поиска.

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

    Другими словами, то, как пользователи взаимодействуют с Вашей страницей, непосредственно влияет на то, как будет оцениваться Ваша страница.

    Тег H1 является одним из самых важных элементов на Вашей странице. Он влияет на взаимодействие с пользователем.

    Почему так? Потому что он заметен. Благодаря тегу пользователи получают определенное сообщение. В нем скрыт определенный посыл. И обещание.

    Тег H1 должен напрямую общаться с пользователем!

    В 2015 году компания «Searchmetrics» провела масштабное исследование факторов ранжирования. Согласно исследованию, наибольшее влияние на пользователя имеет не сам тег H1, а способ форматирования тега!

    Вот самое важное предложение из их исследования:

    «Наличие тегов H1 и H2 обеспечивают правильную структуру статьи и разбивают ее на части – эти элементы улучшают пользовательский опыт».

    Это увлекательная часть познаний о теге H1. Имеет значение не просто само наличие тега H1 на странице – это отправная точка.

    Самое главное – это способ форматирования и размещения тега H1!

    6. Тег h1 должен соответствовать пользовательскому намерению.

    Фраза «пользовательское намерение» смущает некоторых людей, но на самом деле это довольно просто.

    Когда Вы создаете контент, обязательно задайте себе вопрос: «Чего хочет пользователь, открывая мою статью? Какие у него намерения?»

    Ваш тег H1 должен удовлетворить это намерение.

    Если кто-то ищет «рискованные тактики в сфере SEO», я могу предположить, что человеку нужны быстрые и действенные методы поисковой оптимизации, которые могли бы повысить его рейтинг.

    Если бы я писал статью на эту тему (ой, подождите, я же уже ее написал!), я попытался бы ответить на вопросы пользователей с помощью своего тега h1.

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

    Во-первых, пользователь понимает, о чем статья. Именно ради этого они используют Google.

    Рис. 7. Пример запроса в Google«Рискованные и действенные тактики в сфере SEO»

    И вот многообещающие результаты.

    Рис. 8. Результаты поискового запроса

    Пользователи щелкают на одну из ссылок! А вот и статья из моего блога на эту тему.

    Рис. 9. Статья о рискованных тактиках в сфере SEO

    Моя цель состоит в том, чтобы мой тег h1 дал пользователю именно то, что ему нужно, – они ведь пришли за простыми, но рискованными тактиками в сфере SEO и хотят увеличить свой трафик.

    Задача тега h1 – удовлетворять пользовательское намерение.

    Вот как это объясняет Марк Плетель из «SEJ»:

    «Чтобы у Вас были отличные теги H1, оптимизированные под алгоритм Hummingbird, попытайтесь понять, кто же такой пользователь».

    Позвольте мне кратко изложить основные правила создания потрясающих тегов H1.

    1. Используйте только один тег h1.
    2. Тег h1 должен описывать тему страницы.
    3. Тег h1 должен выделяться.
    4. Тег h1 должен обеспечивать хороший пользовательский опыт.
    5. Используйте ключевые слова в теге h
    6. Соответствуйте пользовательскому намерению в своем h

    Как быстро определить и изменить теги h1 на сайте?

    Проведите аудит тегов h1. Вот в чем сила тега h1 – это быстро и это просто. И это дает невероятные результаты в рекордные сроки.

    Если у Вас небольшой сайт или блог, выполните следующие шаги.

    Загрузите приложение ScreamingFrog

    Нажмите на кнопку «SEO Spider Tool».

    Затем нажмите на кнопку «Загрузить».

    Приобретать лицензию на использование программного обеспечения не обязательно. Однако если Ваш веб-сайт содержит более 500 страниц, то рекомендуется все таки приобрести лицензию.

    Откройте приложение ScreamingFrog.

    После того, как Вы успешно загрузили Screaming Frog, откройте его.

    Введите свой URL-адрес.

    Нажмите «Начать» и подождите, пока закончится процесс сканирования.

    В зависимости от размера Вашего сайта, на это уйдет от нескольких минут до нескольких часов.

    У приложения Screaming Frog уходит примерно меньше минуты, чтобы отсканировать 500 страниц.

    Щелкните на тег h1 в панели меню.

    Таким образом, вы увидите весь список тегов h1 на вашем сайте.

    Проверьте, не отсутствуют ли какие-либо теги h1.

    Проверьте меню фильтра.

    Выберите вкладку «Отсутствуют»

    Вы увидите все страницы на сайте, которым не хватает тега h1.

    Рис. 10. Страницы на сайте, которым не хватает тега h1

    Ваша первая задача – создать тег h1 для каждой из этих страниц.

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

    Создайте список отсутствующих тегов h1.

    Нажмите на кнопку «Экспортировать».

    Найдите хорошее место для сохранения файла.

    Это файл CSV, поэтому его можно открыть через Excel.

    Отфильтруйте те теги h1, которые дублируются.

    Это можно сделать, нажав на кнопку «дублированный» в меню фильтра.

    Сохраните эту информацию в файле CSV, чтобы использовать ее в будущем.

    Вернитесь к меню фильтра, выберите вкладку «Все».

    На данном этапе у Вас должно быть три файла CSV (отсутствуют, дублируются, все).

    Создайте новый тег h1.

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

    Если Ваш сайт содержит десятки тысяч страниц, начните работу с важнейшими тегами h1, а именно – с отсутствующими.

    Но если у Вас есть время, обновите все свои теги h1 в соответствии с приведенными выше рекомендациями.

    Вы почувствуете большую разницу в росте трафика, рейтинга и общей производительности сайта.

    Вывод

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

    Но что еще более важно – Вы точно знаете, как использовать тег H1 для максимального воздействия в сфере SEO.

    Имейте в виду, что тег h1 по-прежнему очень важен для SEO-оптимизации. Это очень мощный инструмент – Ваш сайт может взлететь, Ваш контент может взлететь, а также Ваш трафик и Ваши рейтинги.

    Надеюсь, что Вы сделаете то, что сделал я – я открыл для себя потенциал тегов h1. Обновите их на своем сайте – всплеск трафика гарантирован.

    Можно ли использовать два тега h1 на странице?

    Поскольку сам являюсь верстальщиком и изучал html5 в разных местах, включая html academy, был полностью уверен, что в html5 допускается использование нескольких тегов H1 на странице, если они заключены в article. То есть для каждой article можно использовать свой тег h1.

    Есть еще сервис html5 outliner, показывающий, что верстка с использованием этих тегов является валидной, даже если таких тегов много на странице.

    Почему задаю вопрос? Меня чуть не съели Seo-шники и некоторые веб-мастера в одном из чатов по веб разработке. Все как один утверждают, что тегов H1 не должно быть несколько на странице. Дают ссылку на какую-то статью, переведенную на русский, где говорится, что в html5.1 убрали вложенные секции с тегом H1. Но ведь к article это не относится? в тег article заключают отдельный контент, который можно перенести в другую часть сайта, например статейку блога. В article должен быть h1 чтоб поисковик выделил правильно ключ.

    Скажите что сами думаете? Мне нужны ссылки на официальный источник. Чтобы я мог отстаивать своё видение перед клиентом. А то СЕОшные конторы только и занимаются тем, что переделают валидную верстку под своё видение и портят нам репутацию. Убирают все повторяющиеся h1.

    • Вопрос задан более двух лет назад
    • 6815 просмотров

    1ndrei: не знаю, можете поискать. Я опять же не понимаю сути спора. Зачем давать одной веб странице 2 и более h1? Даже если отбросить SEO в сторону, это плохо для структуры, дизайна, пользовательского восприятия и еще много чего.
    Например, есть веб страница, на которой две статьи. Называются они «Про мыло» и «Про двери». Оба названия закрываем в h1. А теперь попытаемся ответить на вопрос. На какой запрос отвечает эта страница? Она про мыло или про двери? Под какой запрос она будет продвигаться? А что писать в тайтле? Тайтл то в отличие от h1 один из важнейших SEO факторов и продублировать его не получится.

    Опять же. Возьмем пример с книгами. Я прихожу в магазин и вижу книгу с тремя равноценными названиями: «Основы механики» или «Основы биологии» или «Как выкопать огород». О чем эта книга?? Я как покупатель, например которому нужно выкопать огород, нахрен не вперлась физика с биологией. Зачем мне покупать книгу, на 2/3 состоящей из лишней для меня инфы. Я пойду и куплю книгу только про огород.
    Дублирование главного заголовка на странице (h1) это полнейший бред и идиотизм, для которого не нужно проводить исследование.

    П.С. Я хочу срать стоя на голове. Можете привести мне исследования, что срать сидя удобнее? Вот абсолютно тоже самое.

    О чем спор вообще?
    Даже не с точки зрения SEO, а с точки зрения логики сами подумайте. Каждая страница должна иметь свой уникальный заголовок, чтобы пользователь понимал вообще что здесь происходит. А дальше уже структурируйте как хотите.

    Если у вас на странице несколько статей — логично назвать её — «Страница о нескольких статьях», чем давать 6 разных названий.

    Теперь возьмем микроразметку например. Что вы будете выделять заголовком на этой странице? Ведь по правилам Schema, OpenGraph, JSON-ld, да даже маркера Google в серчконсоли — можно выбрать только 1(. ) заголовок для страницы. Что вы туда собрались писать?

    Тут вопрос даже не столько в SEO, сколько в здравом смысле. Это как спор о том, что книгу можно назвать 6-ю разными названиями. Можно, но зачем?

    Как правильно прописать теги h1, h2, h3 и остальные для лучшей SEO-оптимизации

    Все блогеры знают, что без правильной внутренней оптимизации своих веб-ресурсов счастливое будущее его вряд ли настанет. В этой статье я хотела бы рассказать, как правильно прописывать html заголовки (по-другому — теги) h1, h2, h3 и другие. То есть так, как их предпочитают видеть поисковые системы.

    Вообще, я не мастер писать статьи про html- и css-коды, так как на данный момент моих знаний на эту тему недостаточно. Но я активно занимаюсь самообразованием и всякими «ковыряниями» в файлах моего блога…Итак.

    Как правильно применять html заголовки в WordPress

    Начинающие блогеры думают, что заголовки h1-h6 существуют для выделения текста разными размерами шрифта. Это не так предназначение этих заголовков — оптимизация контента. Судя по последним веяниям SEO-оптимизации, правильно присваивать html-теги нужно в таком порядке:

    Использование и оптимизация тега h1

    По-другому этот заголовок называют «заголовок первого уровня». Когда поисковые роботы сканируют страницы, то они передают самый большой вес фразам, заключенным в тег h1, а потом ранжируют по убывающей фразы в h2, h3, h4 и т. д.

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

    Тег h1 должен быть прописан только один раз на странице. То есть он должен быть либо в заголовке сайта, если это главная страница, либо в названии страницы (поста). В самой статье этот тег использовать не нужно. Для наилучшего SEO-эффекта в названии сайта или поста нужно обязательно употребить ключевые слова.

    Где прописать тег h1

    Открываем админку WordPress.

    Заголовки записей (постов)

    Находим в меню Внешний вид/Редактор/Одна запись (single.php) .

    В файле single.php такой код:

    и делаем его такого вида:

    Заголовки страниц

    Теперь нужно прописать заголовки страниц.

    Открываем Внешний вид/Редактор/Шаблон страницы (page.php) . Вносим изменения.

    Редактирование тега h1 для шаблона WordPress

    Сейчас нужно настроить оптимизированный вывод заголовка сайта. Для этого открываем Внешний вид/Редактор/Заголовок (header.php). В моем случае получились изменения такого вида:

    Сохраняем изменения, обновляемся и проверяем результат.

    Использование тегов h2, h3, h4, h5, h6

    Тег h2

    Этот заголовок используем так:

    Для главной страницы. Если Главная прописана в h1, тогда названия постов на ней прописываются в h2.

    В теле статей. Если заголовок поста заключен в h1, то h2 может использоваться для подзаголовков несколько раз.

    К слову, этот тег не должен использоваться в виджетах сайдбара.

    Тег h3

    Такой тег нужно использовать, если уже был применен тег h2, для написания подзаголовков постов. Его выбираем при оформлении статьи в админпанели.

    Теги h4, h5, h6

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

    В итоге структура страницы сайта/блога должна иметь такой вид:

    В подзаголовках последовательно, один за другим по убыванию применяем h2, h3, h4, h5 и h6.

    В каждый из них очень полезно включать ключевые слова. Но без фанатизма.

    На этом у меня все. Как обстоят дела с правильными заголовками на Ваших ресурсах? Все верно прописано? Пишите об этом в комментариях.

    Теги h1-h6: как их правильно прописать?

    Заголовок представляет собой броское, привлекающее внимание название, в котором заключён смысл всей публикации или её отдельной части. Однако при работе с сайтом на эту часть текста возлагается дополнительная задача − непосредственное участие в оптимизации. С помощью правильно прописанного заголовка можно существенно повысить шансы на попадание вашего интернет-ресурса в ТОП поисковой выдачи. Для создания нужной текстовой комбинации нужно соблюсти всего лишь два условия. Какие? Рассмотрим ниже.

    Условие №1. Наличие ключевых фраз или слов в заголовках

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

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

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

    Вот пример явного перебора с ключевиками, такой подачи стоит избегать.

    » title=»Слишком частые ключевые слова рядом с заголовком

    Главный заголовок даёт возможность понять, какой товар предлагается, поэтому подобное агрессивное исполнение не приветствуется. Кроме того, не стоит использовать в нём все ключи для данной страницы, название должно читаться легко и естественно. Это оценят и ваши гости, и поисковые роботы.

    Условие №2. Использование тегов h1-h6

    При размещении текстов на сайте необходимо помнить о правильной расстановке тегов. Для заголовков текста используются такие из них, как h1-h6. Впрочем, современные тексты редко бывают длинными, поэтому в большинстве случаев достаточно тегов h1-h2, в масштабной вложенности просто нет необходимости.

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

    Придерживайтесь очерёдности. В основу проставления тегов h1-h6 положен принцип иерархии, h1 важнее, чем h2. На практике это выглядит следующим образом:

    Поисковики любят порядок, расположение заголовков разных уровней в правильной последовательности и негативно реагируют на нарушение иерархии.

    Расстановка приоритетов. Длинные заголовки не допускаются. В них должны быть отражены только самые важные сведения. Если вам нужно обыграть длинную маркетинговую составляющую, используйте подзаголовки. Длинно − плохо:

    » title=»Не допускается использовать длинные заголовки в

    Чётко, с приоритетом для ключевого слова − хорошо:

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

    на страницу» title=»Только один заголовок

    на страницу» />

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

    » title=»Не допускайте ошибок в заголовке

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

    Таким образом, чтобы заголовки были красивыми и эффективными, нравились и людям, и ботам, нужно придерживаться ряда достаточно простых правил. Нет навыков работы с тегами и текстами в целом? Вам на помощь готовы прийти специалисты нашей веб-студии.

    Добавить комментарий