Теги заголовков: простое (но полное) руководство по HTML-тегам заголовков H1, H2 и H3 для SEO
Опубликовано: 2020-08-25
Это полное руководство по тегам заголовков в 2021 году.
В этом новом руководстве вы точно узнаете, как использовать теги от H1 до H6 для повышения рейтинга в поисковых системах, даже если вы новичок в тегах заголовков SEO или вас обманули (Google), заставив думать, что теги заголовков не работай.
Вы собираетесь узнать все, что вам когда-либо нужно было знать об элементах заголовков HTML, от того, что они из себя представляют (просто говоря), до продвинутых стратегий заголовков, которые, как доказано, увеличивают охват и вовлеченность вашего контента.
Вот краткий обзор того, что покрыто:
- Что такое теги заголовков и как их использовать
- Разница между тегами H1, H2 и H3 и когда правильно использовать каждый тип
- Пять причин, по которым теги заголовков необходимы прямо сейчас
- Анатомия идеально структурированной иерархии тегов заголовков
- Как создать теги от H1 до H6, которые обеспечивают более высокий рейтинг (и продажи)
- Еще больше
Давайте начнем.
СКАЧАТЬ: Бесплатный контрольный список, который покажет вам, как именно реализовать советы по оптимизации тегов заголовков, содержащиеся в этом посте.
Что такое теги заголовков? Свободное определение жаргона
Проще говоря:
Теги заголовков — это элементы HTML, используемые для определения заголовков страницы.
Они отличают заголовок <h1> и подзаголовки от <h2> до <h6> от остального контента.
Число от 1 до 6 определяет важность и положение заголовка в общей иерархии структуры заголовка.
Как и в случае с большинством SEO-терминов, существует множество синонимов, которые взаимозаменяемо используются для описания заголовков:
Теги заголовков, заголовки HTML и теги H — это еще несколько способов описать одно и то же.
Так что, если вы уже слышали эти SEO-термины, теперь вы знаете, что они означают.
Все они просто теги заголовков под разными именами.
С другой стороны, « заголовок HTML » — это раздел кода между элементом <header> на веб-странице.
Это контейнер для вводного контента, такого как навигация, логотип, информация об авторе и сведения о заголовках.
Другими словами, это контейнер, который может включать ваши теги заголовков (среди прочего).
Вам также НЕ следует путать теги заголовков с элементом < head > HTML-кода.
< head > — это контейнер для метаданных (данные о данных), который размещается между тегами < html > и тегами <body> на вашей веб-странице. Его содержимое не отображается на странице, но имеет решающее значение для SEO.
Это место в вашем коде, где размещаются заголовок страницы, мета-описание и скрипты, такие как Google Analytics.
Все еще со мной?
Отлично, продолжим.
Что такое тег H1?
Предположим, вы ничего не знаете о H1.
Я поделюсь с вами очень простым определением:
H1 — это HTML-тег, обозначающий основной заголовок веб-страницы.
Давайте распакуем это.
- Это элемент HTML, то есть тег H1 находится внутри кода вашего сайта.
- Он используется для разметки основного заголовка, обычно первого видимого заголовка на странице.
Чтобы текст выделялся, тег H1 обычно отображается крупнее и заметнее, чем остальной текст на вашей странице или в публикации.
Самый простой способ понять, как вы будете использовать тег «Заголовок 1», — представить, что вы пишете план документа.
Главным заголовком вашего документа должен быть ваш <h1>.
Он должен представлять общую тему документа и отображаться в начале крупным шрифтом.
Пример тега H1:
Используя приведенный выше пример из Smart Passive Income, тег H1 имеет значение «Изучите этический партнерский маркетинг».
При просмотре в HTML тег H1 выглядит следующим образом:
<h1>Learn Ethical Affiliate Marketing</h1>Конечно, страницам вашего сайта может понадобиться более одного заголовка.
Здесь вступают в действие другие теги заголовков.
Что такое тег H2?
Принимая во внимание, что ваш тег H1 используется для основного заголовка вашего документа ;
Ваши основные пункты заключены в подзаголовки, известные как H2.
Другими словами:
Тег <h2> определяет заголовки второго уровня на вашей веб-странице.
Но теги заголовков не ограничиваются H2.
Подпункты под вашими тегами <h2> используют теги заголовков <h3>:
А подпункты под тегами <h3> используют теги заголовков <h4>.
Эта последовательность может продолжаться вплоть до тегов <h6>, которые являются наименее важными в иерархии тегов заголовка.
Однако:
Довольно редко вы будете писать контент настолько глубоко, что вам понадобятся теги H4, H5 и H6.
(Если ваш контент не очень длинный и технический).
Как и в случае с оптимизацией изображений, большинство сообщений в моем блоге содержат более 5000 слов.
И даже в этом случае мои подзаголовки состоят из простых H2 и H3:
Итак, давайте закончим с тегами H2:
Теги подзаголовков H2 используются для разделения контента и делают его сканируемым и удобным для чтения.
H2 используются для выделения важных фрагментов информации и заголовка подразделов на вашей странице.
При необходимости вы можете использовать теги H3 в качестве заголовков для подпунктов под вашими H2.
Используя приведенный выше пример, вот как выглядит тег H2 в HTML-коде:
<h2>How To Claim Your Business On Google</h2>Понятно? Хорошо.
Далее мы углубимся в теги заголовков и способы их кодирования в HTML.
Теги заголовков в HTML: и важность H1
Теги заголовков и, в частности, тег H1, выполняют важную функцию в структуре HTML.
Позволь мне объяснить:
HTML-файл можно определить как комбинацию узлов, при этом тег заголовка является отправной точкой, от которой разветвляются другие узлы.
Таким образом, файл HTML должен (теоретически) иметь только один заголовок H1.
Почему? Потому что тег H1 — это корень, от которого начинаются все остальные узлы.
Напротив, заголовки ниже по порядку (от H2 до H6) можно использовать сколь угодно часто.
Однако они должны поддерживать логическую иерархию — об этом позже.
С точки зрения кода теги заголовков используются только для отображения текста.
Таким образом, форматирование заголовков должно быть указано в файлах CSS для разделения формата и содержимого.
Примеры тегов заголовков и их кодирование в HTML
Что делает тег заголовка заголовком в коде вашего веб-сайта, так это два простых тега HTML:
Открывающий тег <h> и закрывающий тег </h>.
Внутри этих двух тегов находится текст заголовка, который вы хотите отобразить:
Строки кода для заголовка с двумя подзаголовками выглядят так:
<h1>This is a heading</h2> <h2>This is a sub-heading</h2> <h3>This is a third sub-heading</h3>Конечно, код вашего сайта будет отображать не только заголовки.
Он будет содержать основной текст и другие элементы.
Вот как выглядит HTML-код с включенным рядом заголовков И основного текста:
<h1>This is a heading</h1> <h2>Summary</h2> <p>Some text here...</p> <h2>Examples</h2> <h3>Example 1</h3> <p>Some text here...</p> <h3>Example 2</h3> <p>Some text here...</p> <h2>See also</h2> <p>Some text here...</p>Там не намного больше элементов кода, чем это.
Просто помни:
Каждый тег заголовка начинается с открывающего тега <h> и должен закрываться закрывающим тегом </h>.
Иерархия тегов (1-6) указывается сразу после «h» и должна быть определена как в открывающем, так и в закрывающем тегах.
Ваш текстовый контент записывается между двумя элементами тега.
Со всем этим сказано:
Если вы не кодируете веб-страницу по индивидуальному заказу (что я обычно НЕ рекомендую), HTML-код ваших тегов заголовков будет обрабатываться вашей системой управления контентом.
Как добавить теги H1 в H6 в WordPress
WordPress — самая популярная система управления контентом в Интернете.
По данным WordCamp, в настоящее время существует более 75 миллионов сайтов, использующих WordPress .
Это около 30% всех веб-сайтов во всемирной паутине.
Что делает WordPress таким популярным, так это его удобство для поисковых систем и простота использования.
Добавление функций SEO, таких как настраиваемые заголовки страниц и постоянные ссылки, гиперссылки и оптимизированные изображения, в WordPress очень просто.
То же самое относится и к добавлению тегов заголовков на страницу или сообщение.
Есть два основных способа добавить теги заголовков в WordPress; Я покажу вам оба:
(а). Добавление тегов H1 в WordPress через редактор
Проще всего добавлять заголовки через редактор. Если вы уже используете редактор блоков Gutenberg, нажмите кнопку «+» и выберите «Заголовок»;
Оттуда вы можете выбрать, какой заголовок вы хотите добавить.
Если вы все еще используете классический редактор, это тоже просто.
Просто убедитесь, что вы находитесь на вкладке визуального редактора и перейдите к раскрывающемуся списку стилей текста.
Затем просто выберите «Заголовок 1» или «Заголовок 2»… или любой другой заголовок из выпадающего меню.
Легко, да?
Следующий вариант добавления тегов H1 в H6 в WordPress — это использование HTML.
(б). Добавление тегов H1 в WordPress через редактор
Если вы склонны к этому, вы также можете добавить заголовки в WordPress с помощью HTML.
Я уверен, что вы следили за этим, так что вы уже знаете HTML-код для <h1>, <h2>, <h3> и т. д.
Он начинается с открывающего тега <h> и заканчивается закрывающим тегом </h>, между которыми находится ваш текст заголовка:
Чтобы добавить теги <h1> в <h6> в WordPress с помощью классического редактора, вам нужно будет находиться на вкладке текста:
В редакторе блоков необходимо переключиться на редактирование как HTML.
Для этого нажмите на три вертикальные точки на панели инструментов блока. Затем выберите параметр «Редактировать как HTML».
Вот так:
В любом редакторе просто скопируйте/вставьте тег заголовка, который вы хотите использовать, из приведенных ниже , обновите текст заголовка, и все готово.
<h1>This is an H1 heading</h1> <h2>This is an H2 sub-heading</h2> <h3>This is an H3 sub-heading</h3> <h4>This is an H4 sub-heading</h4> <h5>This is an H5 sub-heading</h5> <h6>This is an H6 sub-heading</h6>Давайте теперь обратим наше внимание на Shopify.
Как добавить (или изменить) теги H1 на H6 в Shopify
С тех пор, как Shopify появился на сцене, он быстро стал предпочтительной платформой для электронной коммерции.
По данным Хостинг-трибунала, Shopify используют почти полмиллиона веб-сайтов.
Как и WordPress, Shopify наиболее привлекательным является его ориентированность на пользователя.
Управление продуктами, добавление и удаление страниц и сообщений невероятно просто.
То же самое можно сказать и о добавлении тегов заголовков <H2> к <H6>.
В редакторе страниц или сообщений просто нажмите на вкладку форматирования:
Затем выберите нужный тег заголовка:
Как и в случае с WordPress и другими системами управления контентом, Shopify также предоставляет редактор кода.
Чтобы добавить заголовки в Shopify с помощью редактора кода, нажмите кнопку <> в окне редактора и добавьте код заголовка:
Довольно просто!
С другой стороны, если вы хотите добавить и оптимизировать теги <H1> и <H2> на других страницах вашего магазина Shopify, таких как главная страница или страница продукта…
Вам потребуется отредактировать файлы темы Shopify.
К счастью, Даниэль Сим из Plugin Useful составил удобное руководство по этому вопросу.
Зачем использовать заголовки?
Итак, мы рассмотрели, как добавлять теги заголовков.
Но, тем не менее, вам может быть интересно, «зачем» вообще использовать заголовки?
Особенно, когда Google назвал использование заголовков для SEO переоцененным:
Несмотря на то, что говорит Google, есть (на самом деле) несколько важных причин , по которым вам следует использовать теги заголовков:
1. Теги заголовков улучшают доступность, что расширяет охват вашего контента
Если вы хотите, чтобы ваш контент был доступен для всех, включая читателей с нарушениями зрения, теги заголовков невероятно полезны.
Технология чтения с экрана использует H1 и другие теги заголовков, чтобы помочь пользователям перемещаться по содержимому, сканировать и искать страницу.
Как вы уже узнали, заголовки встроены в HTML, что означает:
Программа чтения с экрана может использовать HTML для определения структуры контента и чтения заголовков вслух.
В свою очередь, это помогает слабовидящим и слепым пользователям получить представление о том, о чем статья (без необходимости прослушивания дословно).
Затем они могут решить, читать статью полностью или нет.
Более того:
Программа чтения с экрана предложит ярлыки для перехода от одного заголовка к другому.
Другими словами, теги заголовков также используются слабовидящими для навигации .
2. Google использует H1 вместо тегов заголовков (там, где это уместно)
В некоторых (не очень) редких случаях;
Например, когда Google не может найти или обработать ваш тег title.
Google может выбрать извлечение заголовка из следующей наиболее релевантной части вашей страницы.
В большинстве случаев это будет тег «Заголовок 1», так как это наиболее заметный текстовый элемент.
В некотором смысле тег H1 страницы служит той же цели, что и тег title.
Он должен соответствовать поисковому запросу, сообщать читателям, чего они могут ожидать от страницы, и побуждать пользователей читать дальше.
Теперь вы знаете, что Google может отображать ваш H1 в поисковой выдаче; не забудьте создать привлекательный заголовок, достойный кликов.
Я поделюсь советами, как это сделать позже.
3. Заголовки используются в избранных сниппетах
Проверьте этот избранный фрагмент.
Это фрагмент списка, в котором представлены лучшие блоги социальных сетей на 2020 год.
И откуда, по-вашему, берется этот текст?
Ты угадал. Заголовки страницы рейтинга:
Если вы хотите появляться в растущем числе избранных фрагментов, то включение заголовков на вашу страницу имеет решающее значение.
Что подводит меня к следующей причине:
4. Google использует заголовки, чтобы интерпретировать ваш контент (и повысить его рейтинг).
Я подчеркну это двумя заявлениями от Google.
Во-первых, от Джона Мюллера, старшего аналитика тенденций веб-мастеров в Google, который говорит:
«Мы используем теги H, чтобы лучше понять структуру текста на странице».
А во-вторых, от Мэтта Каттса, бывшего сотрудника отдела качества поиска Google.
«Google смотрит на множество разных вещей. Мы рассматриваем более 200 вещей, PageRank — лишь одна из них. Всякий раз, когда мы ранжируем вещи, мы используем вещи в заголовке, в URL-адресе, даже вы знаете , что выделено, например, теги h1 и тому подобное».
Мэтт Каттс, Google
Чтобы расширить это дальше:
Google использует заголовки страницы, чтобы (лучше) интерпретировать содержание.
Поскольку заголовок обычно должен предшествовать блоку контента:
Google просмотрит заголовок, чтобы узнать о следующем содержании: тексте, изображении или видео.
Если ваш заголовок и основной текст совпадают, Google может быть более уверенным, что ваш контент будет давать релевантные ответы на запросы (относящиеся к контенту).
И, в свою очередь, вы получите небольшое повышение рейтинга.
Итак, перейдем к моей пятой причине использования заголовков.
5. Использование заголовков коррелирует с более высокими рейтингами
Почти каждое исследование корреляции SEO, которое я когда -либо видел , показывало небольшую, но положительную корреляцию между более высоким рейтингом и заголовками на странице.
Возьмите это из SEM Rush:
Было обнаружено, что хорошо структурированные статьи (с использованием тегов H2 и H3) с большей вероятностью будут высокоэффективными.
А это от Moz:
Исследование факторов ранжирования Moz показало, что страницы с ключевым словом, включенным в тег заголовка H1, с большей вероятностью будут ранжироваться выше.
Хотя вес, придаваемый тегам заголовков в этих исследованиях, является умеренным, и;
Некоторые оптимизаторы (справедливо) утверждают, что корреляция тега заголовка с более высокими рейтингами не доказывает, что они обеспечивают более высокий рейтинг , я уверен, что вы согласитесь со мной:
Использование хорошо оптимизированных тегов заголовков того стоит.
Или это?
Теги H1 действительно работают (эксперимент SEO)?
Каждое руководство по SEO предлагает один и тот же совет:
Но не все блоги следуют этим так называемым передовым методам SEO, и Moz является одним из них.
Moz.com — один из самых надежных (и посещаемых) веб-сайтов на тему SEO, и все же:
В блоге Moz нет тега H1, вместо него используется тег H2 для основного заголовка.
Заметив, что в блоге Moz для заголовков используются теги H2 (вместо H1), Крейг Брэдфорд из Distilled обратился к Сайрусу Шепарду из Moz.
Вместе Крейг и Сайрус решили провести эксперимент, который, как мы надеемся, раз и навсегда определит , влияют ли теги H1 на рейтинг в поисковых системах.
Для этого они разработали раздельный тест 50/50 заголовков блогов Moz с помощью SearchPilot; инструмент сплит-тестирования SEO A/B.
В ходе эксперимента половина заголовков Moz была изменена на H1, а другая половина осталась на H2.
Затем они измерили разницу в органическом трафике между двумя группами.
Как вы думаете, что произошло, когда основные заголовки были изменены с неправильного тега заголовка (H2) на правильный заголовок (H1)?
Ответ:
Совсем не много!
После восьми недель сбора данных они определили:
Изменение заголовков сообщений в блоге с H2 на H1 не дало статистически значимой разницы.
Что мы можем сделать из этого?
Просто Google в равной степени может определить контекст страницы, если ваш основной заголовок заключен в H1 или H2.
Означает ли это, что вам следует отказаться от лучших практик и отказаться от H1?
Нисколько.
Структура заголовка: Анатомия идеально структурированной иерархии тегов заголовка
Как я уже указывал:
Заголовки сообщают об организации контента на вашей странице.
И сделайте свой контент более доступным для читателей.
Таким образом, несмотря на то, что Google заявил, что даже без «тегов заголовков» они могут определить, что примечательно на странице…
SEO-преимущество использования тегов заголовков и их правильного структурирования делает любые дополнительные усилия перевешивающими отказ от их использования вообще…
Тогда возникает вопрос:
Как структурировать теги заголовков: простая (логическая) иерархия для веб-страницы
Когда дело доходит до структурирования заголовков, следует придерживаться нескольких простых правил:
- Гнездо заголовков по их рангу (или уровню)
- Самый важный заголовок имеет самый высокий рейтинг (<h1>)
- Наименее важный заголовок имеет самый низкий рейтинг (<h6>)
- Заголовки с равным или более высоким рангом начинают новый раздел
- Заголовки с более низким рейтингом начинают новые подразделы, которые являются частью раздела с более высоким рейтингом.
Применяя эти правила, помните о пользователе.
Во-первых, визуальный пользователь, который будет сканировать вашу страницу;
Делает ли ваша иерархия тегов структуру страницы более заметной и легкой для сканирования?
Во-вторых, слабовидящий пользователь;
Описывает ли ваша иерархия тегов каждый раздел (и страницу в целом), позволяя незрячим пользователям переходить непосредственно к той части, которая их больше всего интересует?
Если бы вы прочитали вслух теги заголовков, узнал бы пользователь (точно), какую информацию содержит ваша страница и как она организована?
Если вы ответите «нет» на любой из этих вопросов, ваша структура нуждается в переосмыслении.
Давайте использовать пример:
<h3>Quick Links</h3> <h3>Photography Tutorials</h3> <h1>Setting the Exposure Manually on a Camera</h1> <h3>Set the ISO</h3> <h4>The effect of ISO on image quality</h4> <h4>High ISO cameras</h4> <h3>Choose an aperture</h3> <h4>The effect of aperture on depth of focus</h4> <h4>Vignetting</h4> <h4>Diffraction</h4> <h3>Choose a shutter speed</h3> <h4>Shutter speed limitations for hand-holding a camera</h4> <h4>Long exposures</h4>В структуре выше:
Структура начинается с двух заголовков <h3>, а не <h1>, и ни один из этих заголовков не является основным заголовком веб-страницы.
Вместо этого они являются частью структуры навигации вокруг заголовка в шаблоне.
Более того, как только содержание начинается, структура перескакивает с уровня 1 на уровень 3 без промежуточного уровня заголовка 2.
Как вы можете себе представить;
Пользователь, просматривающий эти заголовки (например, на устройстве для чтения с экрана), может быть несколько сбит с толку.
Предположим, что контент — это не то, что они ищут;
Нажмите кнопку «Назад» и перейдите в другое место.
Посетитель потерялся!
Я уверен, что теперь вы понимаете, почему важна правильная структура заголовков?
Придерживаясь того же примера…
Вот как должна выглядеть структура заголовка в соответствующем порядке:
<h1>Setting the Exposure Manually on a Camera</h1> <h2>Set the ISO</h2> <h3>The effect of ISO on image quality</h3> <h3>High ISO cameras</h3> <h2>Choose an aperture</h2> <h3>The effect of aperture on depth of focus</h3> <h3>Vignetting</h3> <h3>Diffraction</h3> <h2>Choose a shutter speed</h2> <h3>Shutter speed limitations for hand-holding a camera</h3> <h3>Long exposures</h3>Каждый уровень заголовка, от <h1> до <h3>, указывает на отношение одной части содержимого к другим частям.
Содержимое под заголовком логически связано с заголовком над ним.
Точно так же контент в блоке контента <h2> логически расположен под <h1>, который ему предшествует.
Таким образом, структура заголовков иерархически организует содержимое документа.
И делает это очень ясно, что важно.
Бинго!
Проверка тега H1: как провести аудит заголовка
Итак, теперь вы знаете, как структурировать новые страницы на своем сайте, верно!
Но как насчет ваших существующих страниц?
Как вы можете проверить, используют ли они правильные теги заголовков?
Ну, есть несколько способов:
Во-первых, вы можете проверить исходный код вашего веб-сайта .
Для этого перейдите на веб-страницу, которую вы хотите проверить, с помощью Google Chrome.
Затем нажмите «Просмотр», затем «Разработчик», затем «Просмотр исходного кода».
Затем нажмите «Control F», чтобы запустить функцию поиска на странице, а затем «<h1», чтобы найти открывающий HTML-тег H1:
Этот процесс можно повторить для H2, используя поиск '<h2' и так далее.
Вы также можете просматривать теги заголовков с помощью расширения для браузера, такого как SEO Quake.
Установив SEO Quake, откройте страницу, которую хотите проверить, перейдите на вкладку «Диагностика» внутри SEO Quake, затем прокрутите вниз до раздела «Заголовки».
Он покажет вам общее количество тегов заголовков на каждом уровне, а затем перечислит теги заголовков в иерархии, в которой они отображаются.
Беглый просмотр приведенной выше страницы показывает, что на ней используются теги H1, H2 и H3, и теги структурированы в логическую иерархию.
Но может быть проблема.
Страница содержит два заголовка H1.
Теги H1: сколько элементов H1 рекомендуется на одной странице
Как я указывал ранее, на странице должен быть только один тег H1 .
Это потому, что тег H1 является корневым узлом, из которого происходят все остальные заголовки.
И, имея только один тег H1, ваши усилия по SEO сосредоточены вокруг одной основной темы — с несколькими (обширными) подтемами под заголовками, которые используют H2 и H3.
Это идеальная структура для ранжирования в наши дни.
Но как насчет случаев, когда на вашей странице более одного H1?
Или вообще без H1?
Согласно исследованию, проведенному SEMRush, огромный процент веб-сайтов содержит проблемы с тегом H1:
Но, по словам Google, это не повод для беспокойства:
Тем более, что HTML5 может использовать H1 для заголовка нескольких разделов на одной странице.
Итак, что я рекомендую?
Если вы уже используете HTML5, который может иметь отдельные разделы на одной странице, то использование тегов H1 для каждого раздела вполне нормально.
Однако если вы используете код до HTML5, где одна страница обычно означает одну основную тему, тогда придерживайтесь правила один h1/одна страница!
Как создать метки Killer от H1 до H6. Пять советов по написанию заголовков
Далее я собираюсь рассказать, как именно написать заголовок, который снизит показатель отказов, увеличит время пребывания на странице и, в конечном итоге, повысит рейтинг вашего сайта в поисковых системах и конверсию.
Давайте вскочим:
1. Дайте им то, за чем они пришли — овладение поисковым намерением с помощью H1
Google говорит, что использование ключевых слов в ваших заголовках не поможет вам лучше ранжироваться.
Они ошибаются!
Я согласен с тем, что ключевые слова внутри заголовков могут не быть прямым фактором ранжирования , но они все же помогают вам повышаться в рейтинге с течением времени.
Почему?
Два словечка; намерение поиска.
Представьте на мгновение, что вы искали что-то в Google, нажали на соответствующий результат и оказались на целевой странице.
В сценарии A страница, на которую вы попали, имеет четко сформулированный заголовок, который идеально соответствует вашему поисковому запросу.
В сценарии Б заголовок страницы вообще не соответствует поисковому запросу.
На какой странице вы остаетесь?
Страница А, конечно.
Алгоритм машинного обучения Google, известный как RankBrain, использует эту концепцию в качестве фактора ранжирования, измеряя время пребывания пользователей.
Длительное время пребывания (также известное как время на странице) является мерой удовлетворенности пользователя.
Если пользователь проводит продолжительное время на веб-странице — в отличие от немедленного возврата к результатам поиска — Google будет считать, что пользователь нашел то, что искал.
И, в свою очередь, повысить рейтинг страницы.
Проще говоря:
В наши дни максимальное время ожидания и минимизация зависаний необходимы для более высокого рейтинга.
Одним из наиболее важных факторов, влияющих на время пребывания, является то, что пользователи видят, когда впервые заходят на страницу. Другими словами, заголовок.
Как скажут вам все специалисты по платному поиску, если вы ориентируетесь на ключевое слово «хоккейные клюшки», ваша целевая страница должна включать этот термин (или очень близкий вариант) в заголовок. То же самое верно и для органического поиска.
Главное здесь; целевое ключевое слово или близкий вариант .
Конечно, вы можете указать точное ключевое слово, если хотите, но это не обязательно.
Главное — соответствовать цели поиска пользователей, что позволяет использовать вариации и синонимы, чтобы сделать заголовок более естественным и привлекательным.
В любом случае, отражение поискового запроса в заголовке скажет пользователю: «Вы нашли то, что ищете», что увеличивает шансы, что он останется.
Проиллюстрируем это на примере:
Глен Оллсопп из Detailed.com написал этот громкий пост о линкбилдинге.
Он нацелен на ключевое слово «продвинутое построение ссылок».
Чтобы помочь сообщению удовлетворить поисковый запрос, Глен включает свое ключевое слово в заголовок страницы сообщения:
И снова в шапке страницы.
Всем, кто ищет «продвинутое построение ссылок», ясно, что в посте Глена будет то, что они ищут.
Это может только помочь улучшить время пребывания поста Глена и успокоить алгоритм Google RankBrain.
2. Используйте технику «Ну и что» и превратите свои скучные заголовки, ориентированные на функции, в зацепки, ориентированные на выгоду.
Вместо того, чтобы писать просто короткие подзаголовки с акцентом на функции.
Я включаю преимущества как минимум в 50% своих H2:
Почему я это делаю?
Используя преимущества, я намекаю на то, как моя информация поможет моим читателям в их роли специалистов по поисковой оптимизации.
Например:
В этом посте об экспериментах с SEO я мог бы просто написать «Используйте исходящие ссылки» в качестве H2.
Но вместо этого я включил важное преимущество, показывающее проблему, которую эта информация решит.
Если вы SEO-специалист и у вас такая же проблема, вы почти наверняка будете читать дальше.
Итак, как вы создаете заголовки, ориентированные на выгоду?
Спросите: «ну и что?» многократно.
Позвольте мне показать вам пример, который я почерпнул из Enchanting Marketing:
Особенность: духовка быстро разогревается.
И что?
Он быстро готов к приготовлению лазаньи.
И что?
Ваша еда будет на столе раньше.
И что?
Жизнь менее напряженная. Меньше слоняется по кухне, ожидая, пока духовка приготовится. И вам не нужно беспокоиться; вы можете забыть предварительно разогреть духовку.
Ваш заголовок, который начинался как «Функция предварительного нагрева»
Теперь может стать:
«Экономьте время и снизьте стресс с помощью этой уникальной функции предварительного нагрева»
Что с большей вероятностью удержит вас на странице?
3. Сделайте заголовки яркими с помощью выделяющихся шрифтов и контрастных цветов
Вы прибили свой текст, и ваши заголовки идеально соответствуют поисковому запросу, что дальше?
Чтобы помочь читателям лучше ориентироваться в вашем контенте, вы должны сделать заголовки и подзаголовки различимыми.
Другими словами, ваши заголовки должны выделяться на странице.
Быть различимым может включать визуальную дифференциацию по цвету, размеру, шрифту или эффекту.
ИЛИ комбинация всего этого.
Давайте рассмотрим пару примеров:
Блог Ahrefs отлично различает заголовки:
Они используют другой размер шрифта и плавно переходят от черного к серому по мере продвижения вниз по иерархии заголовков.
В качестве бонусных баллов они также используют собственный шрифт, разработанный специально для их бренда.
Другим хорошим примером является Single Grain Эрика Сиу, который использует контрастный оранжевый цвет для заголовков своего блога.
Вы хотите, чтобы ваши заголовки выделялись, чтобы они визуально отличались от других элементов на странице, особенно от призывов к действию .
Слишком большое визуальное перекрытие может привести к меньшему количеству просмотров ваших CTA, что приведет к снижению конверсии.
С этим, на мой четвертый совет
4. Используйте эти изящные методы копирайтинга, снизьте показатель отказов и увеличьте продажи
Если это не заставит вас серьезно относиться к написанию заголовков, ничто не заставит вас:
Это утверждение подчеркивает важность заголовка и то, почему он определяет эффективность всей статьи.
Короче говоря, чем лучше ваш заголовок, тем выше ваши шансы превзойти средние показатели и прочитать то, что вы написали.
Это касается не только основного заголовка (H1), но и подзаголовков (от H2 до H6).
Каждый раз, когда в вашем содержании происходит перерыв, у вашего читателя есть два варианта;
Либо останавливаются, либо читают дальше.
Вот почему так важно использовать привлекательный текст во всех заголовках (от H1 до H6).
Я не эксперт по копирайтингу, поэтому я оставлю это курсу Невила Медхора по копирайтингу, чтобы поделиться некоторыми советами по написанию заголовков.
5. ОСТАНОВИТЕ читателей, вставив эти элементы заголовков в ваш контент
Использование графики превосходно.
Использование заголовков превосходно.
Но когда вы объединяете их вместе, происходит настоящее волшебство.
Как мы уже обсуждали:
Улучшение времени нахождения пользователя на странице улучшает результаты вашего рейтинга.
Длительное время ожидания говорит Google, что ваши пользователи довольны, и, в свою очередь, ваш контент получает повышение рейтинга.
Чтобы улучшить время на странице, есть одна вещь, на которой вы должны сосредоточиться в первую очередь;
Сделайте ваш контент более читабельным .
Помимо;
- Короткие абзацы
- Изображения и мультимедиа
- Блоки котировок
- Отверстия от пуль
- викторины
Есть еще один прерывающий элемент контента, который вы должны вставить рядом с вашими подзаголовками, который обязательно остановит «скиммеры контента» на их пути:
Пользовательская графика заголовка
Взгляните на этот обзор местного SEO в блоге SEO Sherpa.
Наряду с тегами заголовка H2 я добавил пользовательскую графику, которая представляет каждый подраздел поста.
Они не только делают пост НАМНОГО более впечатляющим.
Но они помогают увеличить время нахождения на странице в среднем до приличных 4 минут:
Что значительно выше среднего по сайту:
Создавать эту графику было легко, так как мне повезло иметь в штате двух штатных дизайнеров.
Но если вы не готовы создать собственную команду дизайнеров, есть еще много вариантов.
- Canva — инструмент для редактирования изображений (бесплатно)
- PicMonkey — редактор графического дизайна (бесплатно)
- 99 Designs – дизайнеры-фрилансеры (недорогие)
- Upwork — платформа для фриланса (недорогая)
Какой бы маршрут вы ни выбрали.
В следующий раз, когда вы будете писать длинную часть SEO-контента, добавьте немного графики в заголовок и наблюдайте, как увеличивается время пребывания на странице (и рейтинг).
Итак, у вас есть все, что вам нужно знать о тегах заголовков и о том, как их использовать для улучшения вашей поисковой оптимизации.
Теперь все кончено!
Как применить эти методы на практике на вашем сайте
Я составил бесплатный контрольный список заголовков, который поможет вам воспользоваться этими методами для повышения производительности вашего сайта.
В нем шаг за шагом описывается, как именно использовать стратегии, о которых я говорил в посте.
Как только вы загрузите его ниже , дайте мне знать в комментариях, какой ваш любимый совет по написанию заголовков. Я хотел бы знать.
