Теги h1 h2 h3, все о заголовках и подзаголовках. Заголовки h1-h6: детальный обзор, примеры

HTML теги h1, h2, h3, h4, h5, h6 — это шесть заголовков показывающих относительную важность блока после заголовка в зависимости от уровня заголовка h1, h2, h3 и т.д. Тег h1 — заголовок первого уровня , тег h2 — второго, тег h3 — третьего, тег h6 — наименее значимый заголовок из всех. Заголовок h1 — второй по важности для элемент на странице после тега title (заголовка страницы) и самый важный тег из всех тегов H.

Использование html тега заголовка h1 на странице допускается не более одиного раза и по умолчанию, заголовок первого уровня H1 отображается самым крупным (среди прочих тегов H) шрифтом жирного начертания. Остальные теги заголовков H имеют шрифт меньшего размера в зависимости от уровня.

Пример использования заголовка h1

Заголовки h1, h2, h3,…, h6 — html теги имеющие обязательный закрывающий тег. Они относятся к блочным элементам и всегда отображаются с новой строки. Элементы следующие после заголовка H также начинаются с новой строки без использования
. Так же, до и после заголовка h1-h6 добавляется отступ. При использовании тега h1 и других тегов заголовков допускается использование атрибута align, который определяет выравнивание заголовка. По умолчанию, все html-теги h1-h6 выравниваются по левому краю (h1 align left), при помощи атрибута align можно выровнять тег h1 по центру (h1 align center) или по правому краю (h1 align right).

Так же, нежелательно использование тегов внутри H1, H2, H3,…,H6. Особенно совместное использование заголовков H с html-тегами: STRONG, B, EM и A.

Теги h1,h2,h3 пример:

Название статьи

Вступление.

Заголовок статьи 1

Часть статьи 1.

Подзаголовок статьи 1

Пункт 1 части 1.

Подзаголовок статьи 2

Пункт 2 части 1.

Заголовок статьи 2

Часть статьи 2.

Подзаголовок статьи 2

Пункт 1 части 2.

Поскольку теги h1 ,…,h6 призваны акцентировать внимание поисковых систем на определённых участках текста, их используют при , например для отображения h1 заголовка текста или иного контента. Однако использование заголовков h2-h6 зачастую не ограничивается и выходит за рамки текста. В результате заголовки и их свойства используются для оформления меню категорий и даже элементов сайдбара или футера. В подобных случаях может быть нарушен не только порядок размещения заголовков H на странице по уровню, но и крайне важный принцип оригинальности заголовков h1,h2,h3,h4,h5,h6 в рамках всех страниц сайта. Об этом ниже.

HTML тег h1 что писать и как заполнять

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

Как использовать заголовки h1-h6:

1. Иерархия заголовков. Заголовок h1 должнт быть выше всех остальных заголовков h на странице. Остальные заголовки по порядке уровня.
2. Градация шрифтов. Чем выше уровень заголовка (h1 — самый высокий) — тем больше шрифт заголовка.
3. Не больше одного H1 на странице. HTML-тег h1 можно использовать только один раз на странице. Два заголовка h1 введут в заблуждение поскового робота, что может привести к непредсказуемым последствиям при индексации сайта.
4. Ничего лишнего в заголовках H. Не используйте в заголовках H1-H6 ничего кроме текста. Избегайте использования других тегов акцентирования (strong, b, em) и ссылок внутри тегов H.
5. Не злоупотребляйте заголовками h2,h3,h4,h5,h6 . Чрезмерное количество «важных» элементов страницы может быть истолковано как спам или переоптимизация сайта.

Текст заголовка h1,h2,h3,…,h6

Теги h1-h6 должны содержать коротокое описание соответствующей секции текста с харатерными ключевыми словами. Не стоит включать в содержимое заголовка ничего лишнего. При заполнении h1,h2,h3,h4,h5,h6 заголовков, а так же и прочих атрибутов, желательно придерживаться следующих правил при оценке значимости заголовка.

1. Прямое вхождение ключевого слова в заголовке. Точное соответствие ключевого слова в заголовке по соответствующему запросу.
2. Уникальность заголовка относительно других страниц сайта. Повторяющиеся заголовки на разных страницах сайта могут не учитыватся поисковыми системами.
3. Близость заголовка к началу документа. Чем ближе к началу html-кода находится заголовок, тем больше его значение относительно других элементов страницы и тем более значимым является содержимое заголовка.
4. Близость ключевого слова к началу заголовка. В идеале, заголовок должен начинаться с ключевого слова.
5. Длина заголовка h1,h2,h3,…,h6. Длина заголовка не должна превышать 60 символов. Поисковые системы обрабатывают ограниченое количество знаков, длинные заголовки не будут восприняты полностью.
6. Грамотность заголовков. Грамматические ошибки в заголовке снижают релевантность заголовка.
7. Плотность ключевых слов в заголовке. Все заголовки оцениваются на переоптимизацию. По этому, не стоит впихивать в заголовок все больше ключевых слов, заголовок может быть проигнорирован.

Тег h1 joomla, wordpress — заголовки в CMS

Многие CMS поддерживают использование заголовков h1,…,h6. Иногда заголовки расставляются автоматически. Однако не всегда с учетом специфики сайта. Правильная расстановка заголовков в тегах h1,2,3,4,5,6 на joomla, wordpress и сайтах других современных CMS может дать потрясающий результат для СЕО сайта. По этому, не жалейте времени на настройку движка сайта. Поверьте, окупится.

H1-H6 заголовки имеют чрезвычайно важное значение. Не стоит ими пренебрегать, но и злоупотреблять тоже не стоит. Заголовки могут как поднять, так и опустить сайт.

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

Пишите коротки, емкие и грамотные заголовки.

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

Что такое заголовки H1 и H2?

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

Тексты на сайтах также должны иметь заголовки. Этому существует как минимум 2 причины:

1. Заголовки структурируют текст, делают его более удобным для чтения. Сплошной текст (часто его называют «простыней») труден для восприятия, читать его не хочется. А так как поведенческие факторы (совокупность действий посетителей на сайте) сегодня учитываются поисковыми системами, вы заинтересованы в том, чтобы пользователь прочел текст на вашем ресурсе, а не закрыл страницу, испугавшись «простыни».

2. Заголовки дают понять поисковым системам, какая информация содержится в той или иной части текста. Опираясь на заголовки, поисковики оценивают, насколько данная информация соответствует ожиданиям пользователей. Именно поэтому они так важны при оптимизации текстов.

Теперь вы понимаете, что пренебрегать использованием заголовков в текстах на страницах сайта не стоит? Тогда следуем дальше!

Что же обозначают термины H1 и H2? Нам придется немного затронуть вопросы, касающиеся html-верстки. Н1 и H2 (а, точнее,

и

) - html теги, которые показывают важность текста, следующего после них. Их еще называют тегами акцентирования. В html-документе это выглядит так:

На веб-странице такие заголовки по умолчанию имеют разное форматирование:

Вообще-то, существует 6 уровней заголовков: от H1 до H6. Соответственно, наибольший вес имеет заголовок H1, заголовок H2 является второстепенным, а заголовок шестого уровня H6 наименее значим. Однако для сео продвижения наиболее важны заголовки H1 и H2. О правилах их использования для оптимизации текстов мы и поговорим.

Что нужно знать для грамотной расстановки заголовков H1 и H2?

Заголовок H1 играет важную роль не только при оптимизации текста, но и при оптимизации всей страницы. Именно он сообщает поисковой системе, насколько контент, представленный на странице, соответствует заголовку страницы (Title), а, следовательно, отвечает ожиданиям пользователей.

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

Основные правила использования заголовка H1

Заголовок H1 должен быть кратким, но емким. Важное условие - естественное вхождение в него ключевых слов. Приведем пример. Допустим, вы оптимизируете страницу, на которой представлен каталог женской обуви. Для продвижения данной страницы выбраны следующие запросы (о том, что такое поисковые запросы, вы можете прочесть в нашем материале «Понимай своего сео-специалиста» ): «женская обувь» (частотность - 3896), «женская обувь в Минске» (частотность - 490), «купить женскую обувь» (частотность - 384), «обувь для женщин» (частотность - 207), «женская обувь каталог цены» (частотность - 318). Для текста на данной странице логичнее всего использовать заголовок H1 «Женская обувь», так как он является наиболее общим, но в то же время описывает содержание контента, а также может быть конкретизирован заголовками более никого уровня.

Заголовок H1 должен встречаться на странице только один раз.

Данный заголовок помещается в самом начале текста, желательно вверху страницы.

Заголовок H1 должен располагаться выше заголовков других уровней (перед ним не допускается ставить, например, заголовок H2).

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

Примеры составления заголовков H2

Каким образом составляются заголовки H2? Их в тексте может быть несколько. Как правило, они конкретизируют заголовок H1 и структурируют весь текст. Вернемся к нашему примеру со страницей, на которой представлена женская обувь. Для данной страницы можно написать продающий текст, в котором будут описаны преимущества моделей, предлагаемых покупательницам, и представлена таблица размеров. Также на странице пользователь сможет найти каталог обуви с фото и ценами. При этом заголовки в тексте могут быть такими:

Если вы вспомните поисковые запросы, которые мы используем для продвижения нашей страницы в данном примере, то поймете, что в заголовки H2 мы включаем расширенные запросы, которые имеют более низкую частотность. Они могут быть представлены в непрямом вхождении (их можно склонять, «разбавлять» другими словами). А главное - они конкретизируют наш заголовок H1 и сигнализируют поисковой системе о том, что текст, идущий после них, действительно отвечают поисковым запросам, прописанным в заголовке страницы (Title).

Наиболее распространенные ошибки использования заголовков H1 и H2

При использовании заголовков для оптимизации текстов постарайтесь избежать следующих ошибок:

Использование тегов

и

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

и

заключены, например, названия блоков. Допустим, такие как «Популярные товары», «Последние новости», «Мы в социальных сетях» и проч. Такой прием вводит в заблуждение поисковые системы и не приносит ничего хорошего. Поэтому при проведении сео-аудита сайта специалист обязательно проверяет, «по назначению» ли используются заголовки. Запомните важное правило - H1 и H2 должны применяться лишь для структурирования текста!

Использование одинаковых заголовков для разных страниц. Это, конечно, нонсенс, однако и такое встречается. Как минимум заголовки H1должны быть уникальны для каждой страницы!

Помещение в заголовки гиперссылок.

Присутствие на странице двух и более заголовков H1. Мы помним, что это недопустимо! Наш девиз: «Одна страница - один заголовок H1»!

В заключение нашей статьи обратим ваше внимание на еще один важный момент. Речь снова пойдет о шаблонах сайтов. Известны случаи, когда в стандартных шаблонах страниц вовсе нет заголовков H1. Вместо них идут заголовки H2. Даже если в административной части сайта вам предлагается ввести текст в поле «Заголовок материала», на деле может оказаться, что он будет заключен в теги

О важности правильной расстановки заголовков текста следует напомнить и разработчику, мало знакомому с seo, при верстке уникального сайта.

В предыдущей я описывал основные факторы ранжирования для поисковых систем.

В данной статье разберем как правильно составлять заголовки на страницы сайта. Этот фактор относится к внутренним факторам ранжирования и обязателен при правильной оптимизации контента на страницах сайта.

Ранее я уже по их важности и роли для SEO. Сегодня подробнее разберем именно теги типа H. Всего существует 6 таких тегов, но в основном используются только первые 3 - теги h1, h2 и h3.

SEO заголовок страницы h1 и его значимость

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

Очень часто встречаю в самописных сайтах или просто в непрофессионально собранных шаблонах такой момент, что тега h1 просто нет. На месте заголовка страницы заместо h1, находится тег h2. Это еще в лучшем случае - бывает что вообще нет заголовков типа H на странице. А то что выглядит типа заголовка, просто обычный div или span блок с прописанными заранее стилями походящими на заголовок.

Обязательно проверяйте наличие тега h1 на странице в самом начале оптимизации или еще ранее - на этапе проведении сайта. К тому же тег h1 должен быть всего 1 на странице.

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

Последний сайт что я взял на оптимизацию - это как раз таки одностраничный сайт собранный на Muse и когда я заглянул на код сайта обнаружил аж 7 заголовок размеченных тегом h1 - это ужасная ошибка.

Заголовок h2 и его важность для продвижения

Если h1 многие все же придерживаются правил и используют на страницах своего сайта, то тегом h2 многие пренебрегают, а зря! Этим тегом обычно размечаются подразделы статьи, страницы.

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

Рассмотрим пример страницы товара в магазине фототехники - если заголовок h1 страницы имеет вид "Canon 6d Body", то тегом h2 мы будем примерно разбивать на части (подразделы) описание самого товара на странице и иметь вид "Характеристики Canon 6d Body" и "Преимущества фотоаппарата Canon 6d Body".

Тем самым мы за счет заголовков типа h2 захватим важные моменты, которые также могут интересовал посетителя сайта помимо самого названия. Теперь сайт будет конкурировать с остальными не только по запросу по основному "Canon 6d Body", но и по дополнительным запросы касаемо преимуществ и характеристик данной модели фотоаппарата. А охват большего числа запросов в свою очередь - это рост трафика на сайт.

Кстати говоря, замечал и на своем блоге и на клиентских сайта случаи, когда заголовок типа h2 попадал в сниппет результатов поиска. Туда как правило попадает либо h1, либо title - они оба самые сильные по важности заголовки страницы и за ними преимущество, но не исключено и влияние h2 на сниппет.

Например данная статья может с легкостью выйти в ТОП по запросу "Заголовок h2", только потому что эта фраза есть в теге h2.

Пару слов о заголовке h3 и нужен ли о вообще

Я в своих статьях очень редко использую заголовок с тегом h3. В случаях если статья набирает в себе 5000 символов и выше и то не всегда - можно обойтись и разбаить статью на подразделы и разметить их тегом h2.

Все заголовки начинаz с h3 и до h6 несут в себе ту же самую уточняющую и дробящую страницу на подразделы роль, но это используется крайне редко. У вас должна быть просто очень огромная статья, чтобы можно было выстроить такую иерархию из подразделов страницы и задействовать все типы заголовков.

Для примера вложенности подзаголовков я напишу про иерархию заголовков, и размечу заголовок этого раздела тегом h3.

Порядок и иерархия заголовков на странице сайта

Все заголовки должны идти в строгом порядке. Первым на странице всегда идет заголовок типа h1.

Если подразделы для каждого из заголовков h2 получились внушительных размеров и в них затронуты несколько еще более мелких подтем, то внутри каждого или одного отельного подраздела с тегом h2 вы делаете сложенные "мини" подразделы страницы и размечаете их h3.

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

8 лайков

1. 1

   Павел

   Александр, меня очень волнует вопрос по тегам. Пытаюсь правильно и доступно написать о своих услугах. С названием страницы (h1) я все понял, но у меня на этой же странице 12 различных предложений для клиента, напрямую связанные с главной темой страницы. Так вот, могу ли на это странице сделать 12ть заголовков h2? Какое количество текста должно быть под каждым заголовком? И да, я разбавляю их картинками... Заранее спасибо за ответ.

2. 3

   Андрей

   как будет влиять на ранжирование span внутри h1.
   на w3c ошибок много. или лучше сделать ЗАГОЛОВОК

3. 5

   Граттол Казахстан

   Подскажите пожалуйста, что будет если сначала идет h3 а потом h2? У меня магазин на вукомерц и описание товара вот так сделано. Надо ли исправлять? Просто товаров там не мало уже.

4. 7

   Сергей

   А если у меня тег h1 состоит из двух фраз, одна из которых, по задумке дизайнера, сделана другим шифтом. Как тогда обойтись без, скажем, span внутри тега h1?

5. 9

   Юлия

   Александр, подскажите пожалуйста. На сайте по продаже товара, в описании у нас есть и h1 и h2. Вопрос: "Тех. характеристики" и "В комплекте" - можно/нужно ли ставить h3? Думаю это лишнее и лучше обычным жирным шрифтом, верно?

6. 11

   Александр

   Добрый день, Александр. У меня есть 2 вопроса по этой теме:
   1. Хочу сделать микроразметку для товаров интернет-магазина и появился вопрос - можно ли использовать такую конструкцию внутри тега h1? Ничего, что в h1 вложено itemprop...?.

Первый заголовок, на который часто посетитель сайта не обращает внимание — тот, который показан на вкладке браузера (). Для поисковой системы он самый главный, так как именно его Яндекс, Google и др. чаще всего () используют в качестве заголовка сниппета.

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

Важные замечания:

• заголовок доступно поясняет содержание страницы, раздела, подраздела. Это не инструмент оформления текста. Не нужно им выделять пункт меню, который ничего не содержит, кроме заголовка.
• заголовок — это слово, фраза, предложение. Он не должен быть длинным.
• заголовок — это всё предложение, а не его часть. Для оформления одного-нескольких слов существуют такие теги как strong , mark , em и др. ().
• если статья строится в формате "вопрос-ответ" и ответ в большинстве случаев короткий (например, инструкция лекарственного препарата), то вместо тегов h правильней использовать тройку dl , dt , dd .

Проверить h1 страницы

Сейчас фразу в любом теге можно сделать заголовком с помощью стилей CSS: увеличить шрифт и/или размер текста. Для того, чтобы проверить количество тегов h1 и их содержимое, достаточно , никаких дополнительных расширений не требуется. Такой инструмент, можно вывести, если нажать клавишу :

Разница в использовании h1 , h2 , h3 , h4 , h5 , h6 в HTML5 и HTML4

Перед дальнейшим чтением желательно ознакомиться с примерами, описанными в стандартах самостоятельно.

Один h1 на странице (версия HTML4)

• Пошаговое решение судоку
  • Программа решения судоку с объяснениями (онлайн)
  • Правила игры
  • Алгоритм заполнения ячеек кроссворда
    • Способ 1. «Скрытые одиночки»
    • Способ 2. «Одиночки»
  • Методы решения судоку
    • Стратегия 1. Кандидат в двух-трёх клетках одного квадрата
    • Стратегия 2. Группы кандидатов

Название сайта

Утверждение 1: заголовок страницы или его часть не должны быть ссылкой (см. здравый смысл и справка Новости.Google). Отсюда следствие: название веб-проекта на Главной также не должно быть ссылкой. В целом не нужно чтобы страница ссылалась сама на себя (искл. ). А вот так допустимо (на Авито на странице объявления каждой похожей записи дан h3):

Процентные ставки от 1% до 5%