Заголовок H1: секреты и правила написания
Проверьте наличие и корректность тега Н1 на любой странице сайта.
Что такое тег H1 и зачем он нужен
H1 — заголовок первого уровня. Пользователи видят его в верхней части страницы под хедером. Этот заголовок стоит вверху иерархии заголовков страницы и может быть только один.
H1 не имеет принципиального значения для SEO, при ранжировании страниц поисковые системы в первую очередь обращают внимание на Title. H1 имеет значение для пользователей — он должен емко передавать суть контента на странице, чтобы пользователь задержался как можно дольше.
Title — тоже заголовок страницы, но именно его считывают поисковые роботы при формировании выдачи. Он же отображается в сниппете и во вкладке браузера.
В случае, если Title отсутствует, поисковый робот возьмет заголовок H1, но такая страница, скорее всего, не будет ранжироваться высоко.
Основные правила написания заголовка H1
Длина заголовка H1
Рекомендуем использовать текст из 10-60 символов с обязательным вхождением основного ключа страницы. У некоторых CMS существуют специальные плагины, анализирующие контент страницы, с их помощью можно контролировать длину заголовков.
Отличия H1 и Title
Важно запомнить, что это разные мета-теги с разными задачами и очень желательно, чтобы они не дублировались. Лучше всего использовать одни и те же ключи, но можно менять окончания. Тем не менее, если вы разместите в двух тегах один и тот же текст, страница не будет пессимизирована.
Важно! Для формирования быстрых ссылок в сниппете стоит сделать H1 и Title одинаковыми, содержащими одно-два слова.
Содержание H1
Вставьте основной ключ ближе к началу заголовка, не разбивайте его знаками препинания. По возможности избегайте стоп-слов — чрезмерного количества предлогов или вводных конструкций. Знаки препинания используйте минимально, в конце заголовка не нужно ставить точку, только восклицательный или вопросительный знак, если это уместно.
H1 в иерархии заголовков
H1 может быть только один и должен размещаться выше остальных заголовков. В некоторых случаях H2-H6 можно не ставить, но H1 прописывать обязательно. Текст заголовка должен быть уникален как для отдельной страницы, так и для всего сайта.
Не переусердствуйте с остальными заголовками. Как правило, достаточно разбить текст до уровня H3. Слишком большое количество заголовков запутает пользователя и оттолкнет.
В некоторых случаях, например, в лонгридах, можно поставить несколько H1, но лучше этого избегать.
Ссылки в H1
В заголовке первого уровня не должно быть ссылок. Дело в том, что поисковая система считает не то, что видит пользователь, а код сайта. И все знаки, необходимые для добавления ссылки в текст через HTML, может принять за содержимое заголовка. Допустимо ставить ссылки в заголовки H2-H6, если это оправдано и полезно для внутренней перелинковки. Также нежелательно в
вкладывать стили.
Как написать привлекательный заголовок?
В первую очередь, нужно помнить, что этот текст вы пишете для людей, а не для поисковых систем. Старайтесь избегать сложных несогласованных конструкций или перечисления ключей. «Кухня под ключ — заказать онлайн, бесплатный замер» — плохой пример. Подойдет в лучшем случае для Title.
«Заказ кухни под ключ не выходя из дома» — вариант для H1. УТП можно добавить в H2: «Замерим бесплатно, изготовим за 30 дней».
Если вы пишете заголовки для интернет-магазина, постарайтесь конкретизировать, что продаете. «Каталог» ни о чем не говорит пользователю, лучше написать «Холодильники и морозильные камеры».
Пишите как можно короче, выбирайте для заголовков высокочастотные запросы и добавляйте их целиком. Если хотите расширить семантику, прописывайте «хвосты» в H2-H6. Например, вместо «Как снять диск с болгарки» напишите «Как снять диск с болгарки без ключа». В любом случае, поисковые роботы почти не интересуются заголовками низших уровней, так что они вообще не обязаны содержать ключевые запросы.
Проверить правильность написания заголовков можно в нашем сервисе «Анализ сайта». При общей проверке он покажет заголовок главной страницы, а заголовки внутренних страниц можно увидеть в соответствующем блоке.
H1 — базовый заголовок первого уровня
Как оптимизировать страницу с помощью html заголовка первого уровня H1? Какая должна быть его длина и сколько тегов H1 можно использовать на странице? Примеры хороших и плохих заголовков. Обо всем подробнее читайте в данной статье.
H1 — это базовый заголовок страницы первого уровня. В Html разметке существует всего 6 заголовков, показывающих важность блоков стоящих под ними. Наиболее важный заголовок H1, наименее — H6.
Синтаксис заголовка H1
В Html-коде страницы заголовок H1, как правило, размещается в пределах парного тега body как можно ближе к началу страницы. Выглядит вот так:
Пример использования тега h1 на данной странице:
H1 является парным тегом. Текст расположенный между открывающим тегом
и закрывающим тегом
Важно! Заголовки H1-H6 должны иметь иерархическую и смысловую последовательность. Заголовок третьего уровня не должен содержать в себе блок с заголовком второго уровня, также как и заголовок четвертого уровня не должен находиться внутри блока с заголовком второго уровня.
Простой пример правильной иерархической структуры заголовков:
Для чего нужен заголовок H1?
Заголовки в целом нужны для правильной структуризации документа. Соблюдение структуры web-страницы необходимо как для пользователей, которые визуально воспринимают информацию на сайте, так и для роботов поисковых систем. Для первых понятная структура страницы является залогом простоты восприятия информации, для вторых заголовки и блоки под ними представляют семантическую важность.
Особенности заголовка H1
Что писать в H1?
Как уже говорилось ранее, H1 — это заголовок первого уровня как в визуальном плане, так и в смысловом. Базовый заголовок должен отражать содержание всей страницы, а не отдельных ее частей. H1 не должен дублировать тег title, но также как title и description должен содержать главное ключевое слово страницы. У тега H1 высокая вероятность попасть в заголовок динамического сниппета, поэтому дублирование H1 и title является плохой практикой. Вы таким образом сужаете вариативность и релевантность своего сниппета по низкочастотным запросам.
Главное требование к H1 — это релевантность содержимому страницы. Заголовок помимо наличия ключевого слова должен привлекать внимание и быть интересен пользователю. Пример корректно составленного H1:
Размер и длина заголовка H1
Начнем с размера. Во многих SEO-блогах можно найти информацию о том, что заголовок H1 обязательно должен быть визуально больше остальных заголовков, в противном случае поисковые системы посчитают это содержание за неоптимизированный контент, и позиции сайта могут понизиться в выдаче. Есть ли у этой информации объективная основа? Нет. Ни в спецификации HTML, ни в справочной информации поисковых систем вы не найдете данных, отражающих важность визуальных стилей заголовков.
Более того, многие начинающие оптимизаторы по ошибке принимают текст самого большого размера за заголовок первого уровня, хотя зачастую это бывает не так. Вот отличный пример:
По запросу «Купить мужские джинсы» в ТОП-5 выдачи Яндекс (на момент написания статьи) присутствует один из лидеров E-commerce интернет-магазин Lamoda.ru. На скриншоте видно, что заголовок первого уровня «Мужские джинсы» гораздо меньше по размеру, чем описательный блок
Визуальное отображение — это вопрос юзабилити, а семантика — это вопрос поисковой оптимизации. Не стоит путать эти два понятия. В вашем конкретном проекте стоит руководствоваться здравым смыслом, эстетикой ресурса и удобством представления информации для пользователей.
Сколько заголовков H1 может быть на странице?
Согласно спецификации HTML 5 количество заголовок первого уровня возможно использовать для каждого тега article или section. Яндекс в разделе представления информации о сайте не упоминает о возможном количестве использования H1, а лишь говорит о том, что должна быть соблюдена иерархия использования заголовков. Официальный представитель Google Джон Мюллер на официальном канале youtube Google Webmasters отмечает, что использование множественных заголовков H1 на одной странице не является проблемой, если это не нарушает иерархию web-документа.
Что говорит практика? На практике подавляющее большинство оптимизаторов, seo-компаний и подрядчиков использует при структуризации страниц только 1 заголовок H1. Заголовок первого уровня также не используется при оформлении элементов интерфейса: меню, сайдбары и т.д. Нет объективных исследований по влиянию количества заголовков H1 на повышение позиций сайта в выдаче или переоптимизацию ресурса, да и согласно официальным данным поисковых систем такие исследования не нужны.
Проверить заголовок H1 на странице
Существует 3 простых способа проверить заголовок H1 на странице:
8 ошибок при написании H1
Мы систематизировали наиболее часто встречающиеся ошибки при составлении заголовков первого уровня. Проверьте, есть ли эти ошибки на вашем сайте:
[su_list icon=»icon: minus» icon_color=»#005a8c»]
Примеры: Хороший H1 vs Плохой H1
Давайте рассмотрим на паре живых примеров заголовок первого уровня H1
Пример #1
[su_list icon=»icon: plus» icon_color=»#005a8c»]
[su_list icon=»icon: minus» icon_color=»#005a8c»]
Пример #2
[su_list icon=»icon: plus» icon_color=»#005a8c»]
[su_list icon=»icon: minus» icon_color=»#005a8c»]
Как вставить тег H1 в популярных CMS?
WordPress
В WordPress заголовок первого уровня формируется из текстового поля над постоянной ссылкой записи или страницы. Любую CMS можно кастомизировать на свой вкус. В случае отключения основного заголовка, есть возможность вывода H1 с помощью визуального редактора — выпадающий список со словом «Абзац».
Bitrix
В панели управления заголовок H1 по-умолчанию формируется во вкладке «Раздел» или «Элемент» в поле «Название». Либо во вкладке SEO в поле «Заголовок раздела», предварительно установив галочку «Изменить для этого раздела и его подразделов».
Joomla
В Joomla аналогично другим системам заголовок H1 формируется очень просто. Текстовое поле Title, либо выпадающий список «Paragraph».
Помимо стандартных средств в каждой CMS можно добавить заголовок первого уровня с помощью визуального редактора, либо перейдя в режим исходного кода. В режиме исходного кода вы руками можете прописать H1 согласно его синтаксису.
Если вы нашли неточности, либо у вас есть замечания к статье, пожалуйста, пишите в комментарии.
Исчерпывающие правила создания заголовка H1 для страниц сайта
Что такое тег h1?
Давайте по порядку.
Рис. 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 должен описывать ваш контент.
3. Длина тега h1 должна составлять 20-70 символов.
Не зацикливайтесь на длине тега h1. Она не играет такой роли, как раньше.
Единственная причина, по которой я об этом говорю – это желание Вас предостеречь. Если тег слишком короткий, Вы теряете ценное пространство. Но если он слишком длинный, мощность тега рассеивается.
Оптимальная средняя длина тега – 20-70 символов.
4. Ваш тег h1 должен выделяться.
Тег h1 должен быть самым важным визуальным элементом на странице.
Как я уже говорил ранее в статье, пользовательский опыт – это самое важное.
Блог SmartPassiveIncome – это отличный пример правильного форматирования. Теги h1 Пэта Флинна очень мощные.
Я взглянул на исходный код и вот, что я увидел:
Вот еще один пример из блога Рамита Сетхи.
Можете угадать, где его тег h1?
Да. Тегом h1 в данном случае является предложение: «А знаете, сколько вы могли бы зарабатывать?».
То, что я пытаюсь вам сказать, связано с пользовательским опытом. Я остановлюсь на этом подробнее в следующем разделе.
5. Создавайте такие теги h1, которые обеспечивают хороший пользовательский опыт.
За последние несколько лет SEO-оптимизация сильно изменилась. Главное изменение связано с огромным влиянием пользовательского опыта на SEO.
Чтобы лучше понимать соотношение SEO и пользовательского опыта, давайте рассмотрим диаграмму Венна.
Эта диаграмма была опубликована в 2012 году.
В 2017 году 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.
Как быстро определить и изменить теги 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. Обновите их на своем сайте – всплеск трафика гарантирован.
Эксперт в области SEO-продвижения и интернет-маркетинга. Опыт работы более 10 лет. Более 45 000 часов активных тренингов и практик.
