H1 — заголовок первого уровня

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

H1: что это?

Зачем нужен заголовок и что значит H1? Он нужен для того, чтобы у документа была структура: на главной странице или второстепенных. Ее соблюдение важно для пользователей, поисковых систем (Яндекс, Google) и даже самого владельца интернет-проекта.

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

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

Что такое H1 в html?

Заголовки, подзаголовки всех уровней являются тегами. Они заключают заголовок страницы в рамки, которые помогают сделать его структурированным. Иерархия устанавливается от меньшего к большему, т.е. H1 — это самый верхний заголовок и т.д.

В html-разметке он прописывается как <h1>Заголовок</h1>. Другие теги внутри разметки по аналогии. Текст, который будет указан, будет показан браузерами графически, т. е. с собственным шрифтом, размером и проч.

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

Чем отличается Title от H1

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

Зачем нужен H1?

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

Сколько тегов H1 должно быть на странице?

Какое число заголовков первого уровня считается допустимым? Разберемся, сколько раз можно использовать его на странице. Вообще, он может быть написан для каждого <article> или <section>, однако на практике лучше располагать на странице только один заголовок первого уровня и помнить об остальной иерархии внутри документа: соблюдении рубрики и т. д. Если он повторяется больше чем один раз, то у поисковых систем могут возникнуть вопросы к вашей странице. Если ресурс небольшой, то пусть он будет один на весь интернет-проект.

Длина

Для чего нужна регламентированная длина заголовка? Поисковые системы учитывают только до 60 символов, поэтому делать заголовок 1 длиннее нет никакого смысла. Если же передать то, о чем пойдет в статье речь, в 60 символах становится проблематично, то напишите заголовок длиннее. Однако в идеале не стоит выходить за размерные рамки, т. к. он используется для формирования динамического сниппета, а его размер ограничен. Ограничений по тому, сколько он не должен превышать слов, нет, главное считать сколько символов он вышел.

Рекомендации

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

Как выглядит?

Это самый крупный яркий текст на странице. Обычно он находится сверху, по-другому его называют оглавлением статьи, например: «Десять способов снизить вес на 5 килограмм за 2 недели» или «Как выбрать квартиру в новостройке».

Где находится?

Где отображается этот html оператор? Обычно он находится вверху в центре страницы, однако, может стоять по ее краям: слева или справа. В html-коде он обозначается следующим образом: <h1>Заголовок</h1>.

Как проверить?

Его можно проверить на странице тремя следующими способами:

1. Нажмите правой кнопкой мыши на участок текста, кликните в открывшемся меню «Посмотреть код» для браузера Chrone и ««Исследовать» для браузера Firefox. Должна открыться панель вебмастера с кодом html, а в ней разметка текста. Так вы поймете, html h1 перед вами или нет.

2. Нажмите на клавиши Ctrl+Shift+C. Перед вами откроется панель вебмастера. Действуйте по аналогии с предыдущим пунктом.
3. Нажмите на кнопку F12. Перед вами откроется панель разработчика. Действуйте аналогично способам выше.

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

Что писать?

Главное — не переспамить, указывая высокочастотные слова.  Если у вас есть запрос «Как выбрать смартфон», здесь вы можете прописать «Как выбрать топовый смартфон» или «Как выбрать смартфон в 2021 году» и т. д. Не следует употреблять одни и те же слова, ограничивать длину заголовка двумя предложениями, а в идеале — одним. Перед тем, как написать этот текст, нужно сесть и хорошо продумать, из чего он будет состоять.

Пример заголовка на странице

Хорошим примером всегда будет такой, который находится в начале страницы, не дублируется с другими тегами, отражает суть статьи, имеет длину меньше или равную 60 символам. Плохим примером всегда будет такой, который слишком переоптимизирован, не отражает смысл контента, превышает установленную длину. Заказывая копирайтинг для ресурса, всегда ориентируйтесь на эти параметры.

H1 в Wordpress

В WordPress его вставить легко. Он формируется из окна для текста над ссылкой записи или страницы. В принципе, любую CMS можно настроить под свой вкус и WordPress не исключение. Если основного заголовка по каким-то причинам в редакторе нет, то его всегда можно вызвать с помощью визуального редактора выпадающим списком со словом «Абзац».

Выводы

Заголовок H1 должен быть на странице только один раз! Длина заголовка не должна превышать больше 60 символов. Составлять H1 нужно ёмко и включить в него самые высокочастотные запросы и не должен дублировать Title.