Тег H1 в SEO — правильный заголовок в HTML формате 💎
Для начала мне было загадка этот самый «H1 тег», потому как на всех моих сайтах он использовался, но использовался неправильно.
Содержание:
- Как проверить H1 на сайте
- Правильность использования
- Размышления о URL
- Повторение тега
- Связность с H2-H6
- неправильный h1
- дополнение для FF подсветка тега
Этот пост блога в формате видео — скринкаста:
Как проверить H1 на сайте
Опишу, 2 варианта, один через плагин, второй более быстрый через закладку с JS скриптом.
Рекомендую, плагин для браузера FF (на 2021 год есть и под Хром) aka Mozilla под названием RDS bar www.recipdonor.com/bar и их новая функция
Если лень ставить старый неуклюжий плагин, есть быстрый вариант через кусок кода который вставляем в панель обычных закладок в браузер
сам код ниже
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><a href="урл-линк">текст заголовка</a></H1>
И это по сути ни к чему не приводило, но когда прочитал пост ранее топового эксперта, мелким шрифтом было про то что многие неправильно используют H1 заголовки, далее форум https://searchengines.guru/ru/forum изучал до последнего по этой теме.
Правильно только вот так:
<H1>заголовок</H1>
Вы можете мне не верить, но есть еще и HTML-валидатор кода который вам скажет то же самое, внутри H1 тега не должно быть никакие других html тегов.
Размышления по теме тега H1
Вот тоже момент интересный, зачем вам ссылка с вашего поста сама на себя, на сколько известно, это не влияет на вес страницы, да и клацать по ней вы вряд ли будете.
Почему пишу это плохо? Да у меня душа обливается, когда вижу блоги ребят по цеху, у которых заголовки сайта неправильно сделаны и они кроме продажи ссылок больше ничего не понимают.
Хотя тоже интересно, одним из главных методов успеха это анализ конкурентов, пройдясь по сайтам конкурентов можно выяснить какая структура сайта, какие ссылки на сайт и прочее... Ну и конечно все мелочи включающие заголовки с использованием <H1> Если ты лентяй или оболтус, лучше не совать свою голову в то что неинтересно, а именно SEO...
Часто встречаю сайты с заголовками: <h2> но при этом ссылка на главную страницу сайта обвернута тегом <h1> (есть мнение что ссылки в тегах h1-h6 передает больший вес чем просто ссылка). Это уже надо проверять экспериментами всякими, время и анализ... Что думаете?
Повторение H1 на странице более раза.
В редких случаях это может работать, но не уверен, что это правильно. Некоторые умники всегда пытаются быть умнее других и проставляют H1 более раза на своем сайте в результате поисковики либо вообще отключают вес h1 для этой страницы либо накладывают фильтр. Вот отличный скрин как морда сайта в топ 4-5 по ВЧ запросу со спамом =).
По поводу H2 и остальной линейки до H6 тегов.
Начнем с H2 тега и вопросов:
- Что позволяет, сделать тег h2 — он предназначен для подзаголовка, который может содержать ключевые слова, поисковые системы часто подсвечивают в результатах выдачи поискового запроса. Тем самым ПС подчёркивают важность такого вида разметки
- тег h2 при продвижении сайта — все банально и просто, в данном теге помечаем все то что не влезло в Title или H1
- тег h2 нужен ли? — да он нужен в контентной части страниц, но не в служебных местах типа сайтбара.
Еще интересный факт, H2 очень заметнее влияет на ключи чем остальные H3-6 заголовки.
Пример неправильного H1
Дополнение firefox подсветка тегов h1
Есть, очень хороший плагин для FF под названием RDS bar — скачать тут http://www.recipdonor.com/bar
Почему у тебя в блоге ты выше пишешь что смысла ставить ссылки саму на себя на странице бессмысленно, но мы видим ты так реализовал у себя. Отвечаю, дело в том что при анализе в какой-то момент, заметил ссылка сама на себя увеличивала шанс сильнее ранжирование конкурентных сайтов. Да по сути это глупо, но самый простой способ поставить ссылку саму на себя можно из заголовка в H1 как на скриншоте ниже.
HTML5
Еще в сети можно прочесть на сайтах веб-страниц, мол в HTML5 — тег H1 можно по правилам и спецификация дублировать на странице среди материалов бесконечно раз, да можно, но для SEO-результата это сильно хуже, чем упомянуть 1 раз данный тег вовсе.
Подписаться на Telegram