Как правильно в SEO прописать "H1 тег" для заголовков 👇

У меня в управлении было очень много сайтов больше 30 штук например и на всех этих сайтах неправильно использовался Теги <h1> — заголовок первого уровня.

Содержание:

• Как проверить тег на сайте H1
• Правильность использования
• Размышления о URL
• Повторение тега
• Связность с H2-H6
• неправильный h1
• дополнение для FF подсветка тега

Этот пост блога в формате видео — скринкаста:

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

Опишу, 2 варианта, один через плагин, второй более быстрый через закладку с JS скриптом.

Рекомендую, плагин для браузера FF (на 2021 год есть и под Хром) aka Mozilla под названием RDS bar www.recipdonor.com/bar и их новая функция

Если лень ставить старый неуклюжий плагин, есть быстрый вариант через кусок в HTML-коде который вставляем в панель обычных закладок в браузер

сам код ниже
javascript:(function()%7Bvar style%3Ddocument.getElementById(%27bstrongemhighlight%27)%3Bif(style)%7Bstyle.remove()%3B%7Delse%7Bvar bStngEm%3Ddocument.createElement(%27style%27)%3BbStngEm.setAttribute(%27type%27,%27text/css%27)%3BbStngEm.setAttribute(%27id%27,%27bstrongemhighlight%27)%3BbStngEm.innerHTML%3D%27h1:before %7Bcontent: %5Cu0022H1 - %5Cu0022 !important%3B%7D h2:before %7Bcontent: %5Cu0022H2 - %5Cu0022 !important%3B%7D h3:before %7Bcontent: %5Cu0022H3 - %5Cu0022 !important%3B%7D h4:before %7Bcontent: %5Cu0022H4 - %5Cu0022 !important%3B%7D h5:before %7Bcontent: %5Cu0022H5 - %5Cu0022 !important%3B%7D h6:before %7Bcontent: %5Cu0022H6 - %5Cu0022 !important%3B%7D h1 %7Bbackground-color: pink !important%3B border: solid !important%3B padding: 2px !important%3B color: black !important%3B%7D h2 %7Bbackground-color: orange !important%3B border: solid !important%3B padding: 2px !important%3B color: black !important%3B%7D h3 %7Bbackground-color: yellow !important%3B border: solid !important%3B padding: 2px !important%3B color: black !important%3B%7D h4 %7Bbackground-color: aquamarine !important%3B border: solid !important%3B padding: 2px !important%3B color: black !important%3B%7D h5 %7Bbackground-color: lightskyblue !important%3B border: solid !important%3B padding: 2px !important%3B color: black !important%3B%7D h6 %7Bbackground-color: plum !important%3B border: solid !important%3B padding: 2px !important%3B color: black !important%3B%7D%27%3Bdocument.getElementsByTagName(%27body%27)%5B0%5D.appendChild(bStngEm)%3B%7D%7D)()%3Bvoid(0)%3B
результатом будет клик по закладке, которая исполнит JS код и подсветит все H1 теги на странице и вообще все H теги, как на скриншоте

Правильное использование H1 тега для SEO и Распространенные ошибки при создании H1

В постах в блоге стояло так:
<H1><a href="урл-линк">текст заголовка</a></H1>

И это по сути ни к чему не приводило, но когда прочитал пост ранее топового эксперта, мелким шрифтом было про то что многие неправильно используют H1 заголовки, далее форум https://searchengines.guru/ru/forum изучал до последнего по этой теме.

Правильно только вот так:
<H1> этот заголовок </H1>

Вы можете мне не верить, но есть еще и HTML-валидатор кода который вам скажет то же самое, внутри H1 тега не должно быть никакие других html тегов.

Размышления по теме

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

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

Хотя тоже интересно, одним из главных методов успеха это анализ конкурентов, пройдясь по сайтам конкурентов можно выяснить какая структура сайта и HTML-документа, какие ссылки на сайт и прочее... Ну и конечно все мелочи включающие заголовки с использованием <H1> Если ты лентяй или оболтус, лучше не совать свою голову в то что неинтересно, а именно SEO...

Часто встречаю сайты с заголовками: <h2> но при этом ссылка на главную страницу сайта обвернута тегом <h1> (есть мнение что ссылки в тег h1-h6 передает больший вес чем просто ссылка). Это уже надо проверять экспериментами всякими, время и анализ... Что думаете?

В редких случаях это может работать, но не уверен, что это правильно.

Отсутствие H1 на странице: каждая страница должна содержать один H1

Конечно это так, но например на 2025 г. под Яндекс (влияние на позиции сайта в поисковой выдаче) можно иногда игнорировать этот тег, точнее лучше его делать, но даже без этого тега можно легко поставить сайт в топ 10. Но то же самое нельзя сделать под Google.

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

Это все болтовня, на самом деле, никаких плюсов ни Google ни Яндекс сайту не даст, за то что у вас будет правильно иерархия.

Дублирование H1 на разных страницах сайта: каждая страница должна иметь уникальный H1.

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

Слишком длинный тег H1: старайтесь уложиться в 60 символов.

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

Несоответствие H1 содержанию страницы: заголовок должен точно отражать основную тему.

Это тоже очень важный момент, если у нас на странице в заголовке будет слово интент (H1: Программирование для детей), а страница интент (H1: Игра для программирования для детей), то будет огромная вероятность, что это будет вредить этой странице. Да и будет вредить не только этой странице, но и странице если такая есть на сайте по направлению (Игра для программирования для детей). Чтобы избежать подобной штуки, нужно выгрузить вообще все заголовки со всех страниц вашего сайта и отправить их на любой платный сервис по кластеризации с учётом той поисковой системы под которую выдвигаете в первую очередь ваш сайт.

Игнорирование H1 на главной странице: даже главная страница нуждается в четком H1.

Это особенно важно если вы двигаете ваш сайт по Google, там этот придает самое ощутимое по весу и результату. Но в любом случае даже от Яндекс если вы посадите сайт в топ по ключевой фразе то сайт в целом будет лучше продвигаться, а без этого тега посадить сайту в топ 10 будет сложнее чем без него.

Переоптимизация ключевыми словами и грамматические ошибки: избегайте неестественного звучания заголовка.

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

По поводу H2 и остальной линейки до H6 тегов — Зачем нужны правильные заголовки.

Начнем с H2 тега и вопросов:

• Что позволяет, сделать тег h2 — он предназначен для подзаголовка, который может содержать ключевые слова, поисковые системы часто подсвечивают в результатах выдачи поискового запроса. Тем самым ПС подчёркивают важность такого вида разметки
• тег h2 при продвижении сайта — все банально и просто, в данном теге помечаем все то что не влезло в Title или H1
• тег h2 нужен ли? — да он нужен в контентной части страниц, но не в служебных местах типа сайтбара.

Еще интересный факт, H2 очень заметнее влияет на ключи чем остальные H3-6 заголовки.

Есть, очень хороший плагин для FF под названием RDS bar — скачать тут http://www.recipdonor.com/bar

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

HTML5

Поведенческие факторы или как привлечь пользователей заголовком H1

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

Как вставить тег H1 в популярных CMS

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

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