Теги h2, Title, Keywords, Description на главной странице — AdvantShop
Статья актуальна для версии магазина: 10.0 Другие версии | 8.0
В данной статье рассмотрим для чего используется заголовок h2 и как его добавить на главную страницу.
- Для чего нужен h2 на главной
- Добавление h2
- Мета теги главной страницы
Для чего нужен h2 на главной
Тег h2 является тегом заголовка текста на странице – h2 это заголовок первого уровня на странице, поэтому использоваться он может только один раз. Этот тег – смысловой, и служит для указания поисковым системам (а также посетителям страницы) содержания страницы. Влияет на ранжирование. Аналог тега h2 – заголовок статьи в журнале: он может быть только один, и, в идеале, должен раскрывать основную суть статьи.
Таким образом, тег h2 должен содержать основные ключевые слова, по которым продвигается страница (но при этом быть ёмким и не длинным) и отражать основную суть страницы.
Главная страница не исключение, вы также можете добавить емкое ключевое слово, которое будет отображать основную суть страницы или всего сайта, например, на главной странице — это может быть наименование магазина или зазывающий рекламный заголовок.
Добавление h2
Тег h2 можно добавить в статические блоки на главной странице: «Текст между каруселью и товарами», «Текст между новостями и товарами», подробнее можете ознакомиться в инструкции.
Но самым оптимальным вариантов добавления тега служит статический блок «Текст между каруселью и товарами»
Для этого перейдите в панели администрировании в пункт меню «Мои сайты» — «Редактировать» напротив Вашего магазина (рис. 1).
Рисунок 1.
Перейдите во вкладку «Страницы и блоки», выберите пункт «Блоки», с помощью поиска найдите нужный блок (например, TextOnMain), активируйте блок и перейдите к его редактированию (рис. 2).
Рисунок 2.
В открывшемся редакторе блока перейдите в режим «Источник», и в поле нужно добавить необходимый текст, обёрнутый в тег h2 (рис.
3).
<h2>Это тег h2, укажите тут название вашего магазина</h2>
Рисунок 3.
В исходном коде странице браузера тег будет отображаться, как на рис. 4. Это необходимо для поисковых систем. Визуально в клиентской части он выглядит, как на рис. 5.
Рисунок 4.
Рисунок 5.
Мета теги главной страницы
Заметка
По умолчанию для всех полей (Title, Keywords, Description) в качестве мета-информации используется название магазина.
Вы также можете изменять данные поля. Для этого перейдите в пункт меню «Настройки — SEO и счётчики» (рис. 6), вкладка «SEO параметры» и в разделе «Главная страница» соответсвующие поля можно заполнить (рис. 7).
Рисунок 6.
Рисунок 7.
Готово. Мы рассмотрели, что такое тег h2 и как его прописать на главную страницу.
Другие статьи по теме
- SEO продвижение
- Webmaster Yandex и Google
- Мета-теги
- Настройка SEO-модуля
- Микроразметка «Протокол Open Graph»
Статья оказалась полезной?
Да Нет
Благодарим за отзыв.
Как мы можем улучшить статью?
Проблема в
…Не могу закончить настройку, слишком сложная инструкцияСледовал инструкции, но ожидаемого результата не добилсяНедостаточно описаны вспомогательные элементыПохоже что инструкция устарелаТема статьи не раскрытаДругое
А именно с
Комментарий
Не нашли нужную статью? Предложить свою тему
Не нашли нужную статью?
На какую тему не нашлась статья?
Ваш email
Комментарий
Благодарим за отзыв.
Тэги: Тег h2 на главной странице, тег h2, h2, на главной, главная, сео, seo h2 главной страницы, как прописать title главной страницы, Title, Keywords, Description, метатег
… — HTML — Дока
Кратко
Скопировано
Используйте теги от <h2> до <h6>, чтобы размечать заголовки на странице.
Пример
Скопировано
<h2>Самый важный заголовок</h2><h3>Заголовок уровня 2</h3><h4>Заголовок уровня 3</h4><h5>Заголовок уровня 4</h5><h5>Заголовок уровня 5</h5><h6>Заголовок уровня 6</h6>
<h2>Самый важный заголовок</h2>
<h3>Заголовок уровня 2</h3>
<h4>Заголовок уровня 3</h4>
<h5>Заголовок уровня 4</h5>
<h5>Заголовок уровня 5</h5>
<h6>Заголовок уровня 6</h6>
Открыть демо в новой вкладкеКак понять
Скопировано
Цифра в теге означает уровень заголовка в иерархии: от самого общего или главного <h2> до самого второстепенного <h6>. По умолчанию <h2> — самый крупный заголовок на странице, а <h6> — самый мелкий.
Как пишется
Скопировано
Заголовки <h2>.
..<h6> всегда отображаются с новой строки. Перед заголовками и после них добавляется расстояние, которое можно регулировать с помощью CSS-стилей.
Подсказки
Скопировано
💡 Основной заголовок <h2> может быть только один на странице.
💡 Не пропускайте заголовки разных уровней: после <h2> может быть только <h3>, но не <h4>.
💡 Уровень заголовка выбирайте по иерархии, а не по внешнему виду. Для уменьшения или увеличения шрифта используйте CSS-свойство font, а не уровень заголовка.
💡 С помощью тегов <h2>…<h6> можно автоматически создавать оглавления для документов.
💡 Для создания заголовка используют и обычные текстовые блок. Но информация из <h2>…<h6> легче попадает в поисковики, поэтому для заголовков лучше использовать именно эти теги.
Ещё примеры
Скопировано
<h2>Каталог тортов</h2><p> У нас вы можете заказать самые вкусные десерты от свадебных тортов до сочных тартов.</p><h3>Свадебные торты</h3><p>Выберите начинку и внешний вид для торта своей мечты.</p><p>Мы выполним торт любой сложности и любой тематики по вашему эскизу или по фотографии.</p>
<h2>Каталог тортов</h2>
<p>
У нас вы можете заказать самые вкусные десерты от свадебных тортов до сочных
тартов.
</p>
<h3>Свадебные торты</h3>
<p>Выберите начинку и внешний вид для торта своей мечты.</p>
<p>Мы выполним торт любой сложности и любой тематики по вашему эскизу или по фотографии.</p>
Открыть демо в новой вкладкеНа практике
Скопировано
Дока Дог советует
Скопировано
🛠 Используй <h2> на странице не больше одного раза; <h3> — не больше двух, максимум трёх раз; <h4> — можно 4-5 раз и так далее.
Как вообще эти теги работают? Допустим, есть сайт «Ели от дяди Васи», который рассказывает про голубые сибирские ели. Если ты вводишь запрос в Яндексе «как ухаживать за голубыми елями», а на сайте дяди Васи есть заголовок
Ели от дяди Васи — Как ухаживать за голубыми елями
Ели от дяди Васи — Как ухаживать за голубыми елями
Теги <h2>…<h6> должны соответствовать ключевым запросам, вопросу пользователя. Через них сайт настраивается для выдачи в поисковиках.
🛠 Часто у тебя в проекте есть боковое меню и второстепенный баннер о партнёрах или график работы — это то, что люди не гуглят и что не является семантически важным на странице. Помещать такую информацию в теги <h2>.
..<h6> не стоит.
Обычно я прописываю стили для <h2>…<h6>, а следом задаю точно такие классы: class, class и так далее с точно такими же параметрами. Когда мне нужно графически отобразить тег заголовка, например, h5 над второстепенным блоком, который не несёт семантической ценности, то я пишу не тег <p> или <span>, добавляю ему класс h5: <p class — он внешне выглядит, как заголовок h5, но не индексируется, как нечто важное. Тогда вспомогательные блоки не мешают основному контенту сайта.
🛠 У любого тега есть стандартный набор стилей, который стоит по умолчанию в браузере. Иногда бывает, что начинающие ставят тег <h2>, <h3>, <h4>, задают им какой-нибудь шрифт, например, font, начинают их использовать — и вроде всё красиво отображается по размеру.
Алёна Батицкая советует
Скопировано
🛠 Важно соблюдать порядок заголовков не только из-за их внешнего вида, но и ради удобства людей с ограниченными возможностями.
Такие люди часто используют так называемые скринридеры — программы чтения с экрана — для навигации по сайтам.
Если заголовки расставлены правильно и логично, то скринридер составит карту навигации по заголовкам и пользователю будет удобно на вашем сайте.
🛠 Если углубиться в интернеты, то можно найти следующее: внутри каждого блока section может быть заголовок h2. Это немного сбивает с толку, потому что все кругом твердят, что на странице сайта должен быть только один заголовок первого уровня.
Но в этом утверждении описаны технические возможности разметки. Ваше тело, например, может обходиться без воды три дня, а без еды вообще все семь. Это технические возможности. Но это не значит, что нужно пить раз в три дня, а есть раз в неделю.
Также с заголовками. Технически допустимо вставлять по заголовку первого уровня в каждую секцию. Но делать это не нужно. Причина в поисковых роботах. Они берут заголовок первого уровня для поисковых сниппетов. Если заголовков будет много, то робот не сможет сам понять, какой из них взять в сниппет и понизит рейтинг вашего сайта. Просто так, на всякий случай.
Поэтому на одной странице сайта должен быть всего один заголовок первого уровня.
На собеседовании
Скопировано
Задать вопрос в рубрику❓
Почему важно использовать h2–h6 и каким пользователям они приносят пользу? Зачем соблюдать иерархию заголовков?
Скопировано
🤚 Я знаю ответ
Это вопрос без ответа.
Вы можете помочь! Почитайте о том, как контрибьютить в Доку.
Что такое тег h2? Примеры и рекомендации по поисковой оптимизации
Что такое теги h2?
Тег h2 — это элемент HTML, который используется для обозначения заголовка или основной темы веб-страницы. Текст h2 используется для создания наиболее визуально заметного заголовка на вашей странице, а также для обозначения основной темы вашей страницы для поисковых систем. В HTML-коде теги h2 заключаются в квадратные скобки:
Здесь находится заголовок главной страницы
Теги h2 являются важной частью SEO на странице. Ниже мы более подробно рассмотрим теги h2, почему они важны, и рассмотрим несколько примеров.
Почему важны теги h2?
Тег h2 является важным сигналом, позволяющим поисковым системам узнать, о чем ваша страница. Google, Bing и другие поисковые системы будут строго учитывать текст в вашем h2 при принятии решения о ранжировании вашей страницы в результатах поиска по заданному ключевому слову.
Помимо того, что они являются сигналом для поисковых систем, правильно используемые теги h2 могут улучшить ваш пользовательский опыт. Когда вы разрабатываете свою страницу, тег h2 должен быть первым заголовком, который видит пользователь при загрузке контента. Он указывает, о чем ваша страница, и что они должны продолжать читать ваш контент после нажатия на него из поисковой системы или другого источника трафика. Теги h2 должны мгновенно позволить вашим читателям или потенциальным клиентам сказать себе: «Да, я нашел страницу, которую искал».
Теги заголовков также позволяют упорядочить содержимое вашей страницы в удобную иерархию. Можно использовать шесть доступных тегов заголовков HTML, от до . При разработке вашего сайта теги h2 должны быть наиболее заметными на странице. Теги h3 должны быть немного меньше, чем h2s, теги h4 должны быть немного меньше, чем h3s, и так далее.
Теги h2 vs h3
Вообще говоря, вы должны использовать только один тег h2 на странице.
Вы можете и должны использовать несколько тегов h3, чтобы разделить свой контент на разделы, которые пользователям будет легко пролистать. Теги h3 — отличное место для включения упоминаний вашего основного ключевого слова в дополнение к связанным терминам, сгенерированным с помощью инструмента подсказки ключевых слов. Вы также можете получить идеи для своих тегов h3, просмотрев поле «Люди также спрашивают» в результатах поиска. Google получает эти данные из вопросов, которые задают люди и которые связаны с введенным вами ключевым словом. Это дает представление о вопросах, на которые Google стремится ответить своим пользователям. Предоставление ответов на эти вопросы в вашем контенте — это хороший способ не только повысить ваши шансы на размещение в разделе «Люди также спрашивают», но и сделать вашу страницу более насыщенной и адаптированной для потенциальных читателей.
Примеры тегов h2
На странице, которую вы сейчас читаете, текст «Теги h2» — это наш h2.
Это самый высокоуровневый способ классифицировать, о чем эта страница, поэтому он назначается тегом h2 в HTML этой страницы. По мере того, как мы переходим к более конкретным темам и вопросам, касающимся тегов h2, мы используем h3 для классификации подразделов страницы.
В этом примере от Nordstrom в качестве h2 используется «Женская обувь». Когда дело доходит до тегов заголовков, лучше всего делать это просто и по делу. При этом текст хоть и не особо крупный, но все равно хорошо виден, не отвлекая пользователей от контента на странице:
В сообщении в блоге или в длинной статье заголовок сообщения, как правило, является лучшим выбором для тега h2. В этом примере сообщения в блоге из The New York Times заголовок сообщения в блоге служит привлекательным заголовком для страницы.
Обратите внимание, что размер, шрифт и другие элементы дизайна тега h2 можно указать в таблицах стилей CSS. В следующем примере элементу h2 присваивается атрибут class, указывающий, какой стиль CSS следует применять к этому конкретному тексту.
Лучшие походные ботинки
Рекомендации по использованию тегов h2
Многие веб-дизайнеры или владельцы веб-сайтов, которые плохо знакомы с поисковой оптимизацией, будут использовать заголовки HTML только в качестве элемент дизайна, без учета влияния их использования на SEO. h2s следует использовать как способ оптимизации вашей страницы для вашего целевого ключевого слова, а не просто как выбор стиля. Использование инструмента подсказки ключевых слов, такого как Moz’s Keyword Explorer, позволит вам определить лучший тег h2 для вашей страницы.
Может ли страница иметь несколько тегов h2?
Как правило, каждая веб-страница должна иметь только один тег h2, хотя в некоторых случаях, когда страница действительно охватывает несколько тем высокого уровня, можно использовать несколько тегов h2. По словам Джона Мюллера из Google, поисковая система не будет наказывать страницы с несколькими тегами h2.
Тем не менее, мы рекомендуем придерживаться одного тега h2 на странице, чтобы ваш контент был тематически сфокусирован и чтобы предотвратить проблемы с каннибализацией ключевых слов на вашем сайте в целом.
Каждая страница вашего сайта должна иметь тег h2
Теги h2 должны быть обязательной функцией на всех страницах вашего сайта. Даже если страница не является содержательной статьей с четко определенным заголовком, вы все равно должны придумать оптимизированный для ключевых слов h2, который четко указывает поисковым системам и пользователям, о чем страница.
Длина тега h2
Длина тега h2, как правило, не должна превышать 60 символов. Технических ограничений на количество символов в теге h2 нет, однако мы рекомендуем не превышать 60 символов, чтобы заголовок был легко читаемым. Это также позволяет вам использовать один и тот же текст как в h2, так и в мета-заголовке, о чем мы поговорим в следующем разделе.
Теги h2 и теги заголовков
Теги заголовков — еще один важный элемент HTML.
Как и теги h2, теги заголовков указывают, о чем ваша страница, как для пользователей, так и для поисковых систем. Однако есть некоторые ключевые различия между тегами h2 и тегами title.
Теги заголовков появляются на страницах результатов поисковой системы (SERP), что означает, что они являются заголовком страницы, которую пользователи увидят до того, как перейдут на ваш сайт. Они также отображаются на вкладках браузера. Теги заголовка HTML имеют номер , а не .виден в любом месте содержимого страницы. Для сравнения, теги h2 заметно видны пользователям на веб-странице.
Ключевое отличие состоит в том, что теги заголовков в основном видны в поисковой выдаче, а теги h2 видны на вашей странице. Важно включить ваше основное целевое ключевое слово для страницы как в тег заголовка, так и в h2.
Могут ли ваши теги title и h2 совпадать?
В некоторых случаях теги title и h2 могут (и должны) содержать один и тот же текст.
В примере Nordstrom, показанном выше, «Женская обувь» — это и мета-заголовок, и h2 страницы.
В примере с New York Times h2 и мета-заголовок страницы отличаются. Мета-заголовок — «Лучшие походные ботинки 2023 года | Обзоры Wirecutter». В некоторых случаях вы можете захотеть включить в заголовок несколько функций, повышающих рейтинг кликов, которые вы не обязательно хотите видеть на своей странице. В данном случае это название бренда, слово «лучший» и год публикации статьи.
Проанализируйте теги h2 вашего сайта с помощью SEO-аудита
Важно убедиться, что каждая страница вашего сайта имеет один тег h2, оптимизированный для ключевых слов. Самый простой способ выполнить этот анализ — провести SEO-аудит с использованием такого инструмента, как сканирование по запросу Moz. Moz идентифицирует все страницы вашего сайта с отсутствующими или недействительными тегами h2. Вы можете экспортировать эти результаты в CSV или просмотреть их в приложении.
Это самый простой и быстрый способ выделить все страницы вашего сайта, на которых есть проблемы, связанные с их тегами h2.
Продолжайте учиться
- Нужны ли теги h2 для ранжирования? [Эксперимент SEO]
- Что такое теги заголовков?
- Основное руководство по исследованию ключевых слов SEO
Насколько важен тег h2 для SEO?
Проще говоря, теги заголовков h2 важны.
Но дело не только в том, чтобы убедиться, что мы используем h2 на веб-страницах, или даже в том, как мы их используем.
На самом деле это понимание того, что такое h2 (в современном определении) и как он вписывается в организацию страницы.
Что еще более важно, важно знать, как h2 и другие теги заголовков (h3, h4, h5 и т. д.) вписываются в общий пользовательский интерфейс этой страницы и веб-сайта в целом.
Технически этот основной тег заголовка даже не обязательно должен быть h2.
Но, будь то тег h2 или другой тег заголовка, этот основной заголовок невероятно важен.
Позвольте мне объяснить.
h2 уже не тот, что раньше
h2 раньше был систематизированным и стандартизированным; но не больше, так как поиск умнее, чем когда-либо прежде, и становится умнее с каждым днем.
Идея использования h2 в качестве основной категории — заголовка, если хотите — не изменилась.
Но роль этого заголовка больше связана с общим пользовательским интерфейсом страницы и тем, как он помогает улучшить этот опыт, а не с включенными в него вариантами ключевых слов и порядком, в котором h2 отображается в иерархии заголовков.
Таким образом, этот главный заголовок не обязательно должен быть h2, но основные принципы, лежащие в его основе , действующие как h2, остаются.
Главный заголовок веб-сайта, который легко может быть h2, должен представлять собой всеобъемлющее краткое изложение содержимого страницы.
И остальная часть содержимого страницы должна удобно располагаться под ним на странице, вероятно, в виде подзаголовков.
Чтобы лучше понять важность h2 и то, как создавать идеальные для вашего контента, полезно понять, откуда взялись h2 и как они развивались.
Потому что теперь их цель важна, но их формальность не ограничивается правилами или предпосылками.
Каким h2 был раньше
Раньше к h2 предъявлялись довольно простые требования в отношении SEO.
- Включите наиболее важные ключевые слова.
- Не используйте больше (или меньше) одного h2 на странице.
- Убедитесь, что h2 является первым и самым большим текстом на странице.
Но Google ясно дал понять, что это больше не правила страны.
Веб-сайты развивались, как и то, как они представлены, как они сканируются (поисковыми системами) и как они потребляются (людьми).
Что такое h2 сейчас
Наличие нескольких h2 не проблема.
На самом деле это довольно распространенная тенденция в Интернете, особенно с HTML5, согласно Джону Мюллеру из Google в видео, ссылка на которое приведена выше.
И не следует задумываться о том, сколько элементов h2 или где они выстраиваются на странице, если структура заголовков определенной страницы является лучшим и наиболее организованным способом представления содержимого на этой странице.
«Ваш сайт будет идеально ранжироваться без тегов h2 или с пятью тегами h2», — сказал Мюллер в конце 2019 года.
Мы всегда должны отдавать предпочтение пользовательскому опыту, а не плотности ключевых слов или даже иерархии заголовков.
(Поскольку некоторые CMS используют стили, которые могут сделать другие заголовки более заметными, чем h2 по какой-либо причине дизайна.) значения ключевых слов (если это имеет смысл и по-прежнему обобщает содержимое страницы), создание заголовков на странице должно выполняться без особого внимания к тем элементам, которые представляют собой h2 над h3 или наоборот.
Нужно просто убедиться, что содержимое организовано практичным и разумным образом.
Мюллер назвал три способа работы системы Google для понимания заголовков страниц и того, как они поддерживают страницу.
Они включают страницу с:
- Один заголовок h2.
- Несколько заголовков h2.
- Стилизованные фрагменты текста (без семантического HTML).
Это явно иллюстрирует большую свободу, когда речь идет о стиле и организации страницы, а также о тегах заголовков в целом.
И многие сайты получают вознаграждение за использование всех трех вышеупомянутых макетов.
Теги заголовков, включая h2, также полезны для доступности.
Специально для посетителей сайта с нарушениями зрения, у которых нет возможности увидеть сайт и его дизайн.
Программное обеспечение, которое помогает пользователям с ограниченными возможностями просматривать веб-сайты, будет читать заголовки в том порядке, в котором они их видят.
Таким образом, h2 являются значительной частью веб-сайта, взаимодействующего с этими пользователями, но несколько h2 не повлияют на эффективность этой страницы даже для слабовидящих.
Помните, речь идет о пользовательском опыте.
В 10 случаях из 10 наличие семантической структуры, указывающей на четкую организацию контента на странице, будет работать в пользу этой веб-страницы с точки зрения сканируемости, удобоваримости и, в конечном счете, видимости.
Получение максимальной отдачи от тегов h2 и заголовков
Хотя было сказано, что h2 не напрямую влияют на органическое ранжирование (т. е. включение ключевых слов, несколько тегов и т. д.), было бы невозможно не учитывать их быть важной частью общей оптимизации каждой веб-страницы и, следовательно, представления.
Если заголовки могут помочь людям понять содержимое страницы более простым способом, вполне вероятно, что они могут помочь поисковым системам аналогичным образом.
Так и есть.
Считайте, что ваш основной заголовок, который вполне может быть h2, является точным описанием страницы и ее содержимого.
Все остальные темы и категории на этой странице, скорее всего, будут располагаться под этим основным заголовком в качестве подзаголовка, как правило, более подробно раскрывая тему в этом основном заголовке.
Подумайте о семантической структуре страницы простым способом:
- Основной заголовок (может быть h2).
- Подзаголовок 1 (может быть h3).
- Подзаголовок 2 (может быть другой h3).
- Дополнительный подзаголовок 1 (может быть h4).
- Дополнительный подзаголовок 2 (может быть h4).
- Подзаголовок 3 (может быть другой h3).
- Дополнительный подзаголовок 1 (может быть h4).
- Дополнительный подзаголовок 2 (может быть h4).
- Дополнительный подзаголовок 3 (может быть h4).
- Подзаголовок 4 (может быть другой h3).
- Подзаголовок 5 (может быть другой h3).
Некоторое содержимое не будет иметь много подзаголовков.
У некоторых будет несколько.
Опять же, речь идет о контенте и о том, как лучше всего представить его аудитории.
Заголовки важнее, чем h2s
Заголовки могут быть h2s, но не обязательно.
Главным заголовком страницы может быть h2, но это не обязательно.