Что означает h1-h6?
Начать в любом случае нужно с теории, потому что без этого невозможно двигаться дальше. Итак, это html-теги, в которые помещают текст, который должен стать заголовком. H1 – это главный заголовок страницы, он должен быть единственным, h2 – подзаголовок статьи или раздела главы (если речь идет о книге), h3 – заголовок в разделе и т.д.
В сайтостроении, как правило, чаще всего используются h1-h3, последние три тега используются крайне редко, так как нет необходимости в разбивке текста на такие мелкие части, если только речь не идет об огромной по объему текстовой публикации.
По умолчанию заголовки уже имеют некоторое стилевое оформление. Например, буквы в заголовках выделены жирным шрифтом, а их размер в 1,5 – 3 раза больше обыкновенного текста на странице.
Основные правила работы с заголовками
Сколько h1 может быть на сайте? Сколько угодно, ведь интернет-ресурс может состоять из множества страниц. Тут гораздо важнее придерживаться другого правила – на каждой отдельной странице вашего сайта должен быть ОДИН h1. Все потому, что это главный заголовок, а главным всегда должен быть один.
Но что будет, если проигнорировать это правило? Как показывает реальная практика, ничего катастрофического, вероятно, не случится. Я бы не писал об этом, но мне известно несколько случаев, когда у веб-мастеров было несколько h1 на странице, при этом все их статьи сохраняли свои позиции в поисковых системах.
Так-то оно может и так, только вот не нужно специально создавать несколько h1 на странице. Все равно это не правильно и вред от того все равно может быть. Например, в приведенных выше ситуациях у веб-мастеров были уже возрастные раскрученные сайты, поэтому несколько h1 на странице не ухудшили ситуацию.
Однако при раскрутке молодого сайта очень важно соблюдать разные тонкости, чтобы ресурс максимально быстро получил одобрение поисковиков и начал приносить трафик.
Очевидно, что h1 должен быть в самом начале статьи. Это не то же самое, что мета-тег title. Title виден при поисковой выдаче и в названии вкладки браузера, а h1 – непосредственно на странице. Остальных заголовков (h2-h6) может быть сколько угодно, в любом количестве.
Как проверить наличие h1 на странице?
Теперь мы переходим к самому главному. Как же определить, нормально ли у вас все на сайте с заголовком? Есть как минимум несколько вариантов, как вы это можете сделать.
Во-первых, открыть исходный код и произвести в нем поиск. Исходный код открывается с помощью комбинации клавиш Ctrl + U. Далее вам понадобится комбинация Ctrl + F, чтобы открыть поиск. Введите в нем название нужного тега, а именно – h1.
Правильно будет, если вам найдет два результата – открывающий и закрывающий тег соответственно. Если результатов больше, нужно вносить правки в код шаблона сайта. Если h1 вообще отсутствует, тоже нужно принимать меры, чтобы он появился.
Во-вторых, вы можете воспользоваться каким-нибудь сервисом, который анализирует сайт на показатели его поисковой оптимизации и выдает отчет. Таких сервисов очень много, я приведу лишь некоторые: pr-cy.ru, audit.megaindex.ru/
В сервисе “Мегаиндекс” есть возможность проверить релевантность страницы, то есть то, насколько она оптимизирована под определенную ключевую фразу. Введите адрес одной из страниц вашего сайта и основную ключевую фразу. В случае проверки лишь h1 эта ключевая фраза может быть любой.
Как видите, проверка показала, что на странице всего 1 h1 – это хорошо. Если бы было больше, проверка бы обязательно это определила. Как видите, это важный фактор, хотя и не критический. Его несоблюдение не приведет к чему-то катастрофическому, но при поисковой оптимизации подобные проблемы должны быть убраны в первую очередь.
Если проблема найдена, как ее решать?
Решать очень просто, нужно всего лишь немного подправить код вашего шаблона. В первую очередь тут нужно знать, на каком движке у вас сайт. Структура шаблонов у всех движков может быть немного разной, но все же много общего.
Например, в WordPress вам нужно будет редактировать файлы page.php (шаблон страницы) и single.php (шаблон записи). Также полезно будет просмотреть файлы index.php (главная страница) и archive.php (архивы по дате и автору), а иногда в темах есть еще category.php (записи отдельной рубрики).
Ну, допустим, нашли и открыли вы нужный файл, что делать дальше? Дальше воспользуйтесь все тем же поиском (Ctrl + F). Вновь введите туда название тега. Если кода в файле немного, то вы и сами можете просмотреть его и найти нужные строчки. Тут ваши действия зависят от того, что именно нужно исправить.
Например, в одном шаблоне название поста выводилось в h2. Возможно, его разработчик не разбирается в SEO, поэтому и допустил такую ошибку. Но это легко исправляется. Редактируем single.php и меняем в нем h2 на h1. Это можно сделать как вручную, так и с помощью функции автоматической замены.
Возможно, так же понадобится редактирование боковой колонки (sidebar.php). Собственно, лишние h1 могут быть где угодно: в заголовках виджетов, в меню и даже в футере (footer.php). Все это нужно найти и убрать.
Ну а что делать, если в самой статье несколько h1? Тогда проблема решается еще легче – редактированием самой статьи. Уберите все лишние h1, оставив только один главный верхний заголовок.
Как видите, справиться с этой проблемой можно самостоятельно абсолютно без проблем. Для этого вам не нужны даже знания в области сайтостроения, а просто элементарное умение находить и открывать файлы, пользоваться поиском и изменять немного нужные строчки. Да и к сео-специалисту нет нужды обращаться теперь, по крайней мере, по поводу рассмотренного нами сегодня вопроса.
Что ж, теперь вы знаете, как проверить заголовок h1 на странице и правильно настроить шаблон. Конечно, это всего лишь одна из множества настроек, которые помогут вам раскрутить и монетизировать сайт. Намного больше информации вы можете найти, если изучите и его выводе на доход от 20 тысяч рублей в месяц в самое кратчайшее время. Успехов вам во всем и хороших позиций в поиске!
02.12.15
44.1K
Зачастую начинающих веб-мастеров мучает вопрос, почему одни сайты ранжируются выше и обходят конкурентов в поисковой выдаче. Причиной этого могут быть неправильно расставленные теги h1
, h2
…h6
. Если эти теги расставлены неверно, без учета специфики ресурса, то поисковикам сложнее получить точную информацию о статьях и содержащихся в ней ключевых словах.
Теги h1
—h6
позволяют выделить заголовки различных уровней. Они дают понять, какие части текста более точно отражают тему статьи и обеспечивают преимущества в ранжировании.
Грамотная расстановка тегов позволяет поисковым системам более точно отображать станицу по запросам в выдаче, что благоприятно сказывается на позиции ресурса:
Зачем нужны теги h1-h6?
В теги заключается название сайта, заголовки и подзаголовки текста:
В
HTML теги заголовков обозначаются h
от английского «header
», что в переводе означает «
заголовок, шапка
». Вот пример того, как это выглядит:
Заголовок
Расстановка тегов заголовков должна производиться на каждой странице ресурса. При этом важность заголовка будет зависть от его цифры, чем она меньше, тем заголовок важнее:
- наиболее важные теги
- менее значимые теги...
- последние по важности теги
Однако относиться к их расстановке следует с осторожностью. Неправильное использование может привести к тому, что ваш ресурс попадет под санкции поисковых систем.
Синтаксис тегов h1-h6
Название текста
Подзаголовок 1
...
Подзаголовок 2
Подзаголовок 3.1
...
Подзаголовок 3_2
Подзаголовок 3
Наибольшей популярностью пользуются теги h1
h2
h3
.
Как правильно использовать тег h1?
Игнорируя тег h1
, веб-мастера, лишают себя такого важного преимущества, как оптимизация контента. На движках он часто прописывается автоматически, однако не всегда, и данный факт следует учитывать.
HTML
тег h1
– самый значимый в своем роде. В него заключают название сайта и заголовок статьи. Однако не стоит его путать с тегом
(<span>заголовком страницы
</span>). Title
отражается в браузере вверху экрана с левой стороны в тот момент, когда открыта страница ресурса. Title
прописывается в шапке страницы между <head></head>, в то время, когда h1
—h6
указываются в самом «теле
» страницы и заключаются в теги <body></body>.</p>
<p>На странице может присутствовать только один h1
тег. Если указать несколько заголовков с тегом h1
, поисковики могут расценить это как переспам, что в свою очередь грозит баном:</p>
<p><img src='https://i0.wp.com/internet-technologies.ru/wp-content/uploads/articles/201512/kak-pravilno-ispolzovat-030726.jpg' width="100%" loading=lazy></p><br>
Правила составления главного заголовка h1
:
<ul><li>В теге должны использоваться <a href="/configuring-wi-fi/podbor-klyuchevyh-slov-statistika-klyuchevyh-slov-google-i.html">ключевые слова</a>, применяемые для продвижения страницы;</li>
<li>Не стоит делать заголовок h1
слишком объемным, вполне достаточно нескольких слов;</li>
<li>Текст заголовка должен быть читабельным;</li>
<li>Мета тег h1
не должен содержать ничего кроме самого текста. Если желаете его выделить, поставьте коды за пределами тега;</li>
<li>Перед тем, как вручную прописывать h1
, убедитесь, что движок не задает его автоматически;</li>
<li>Содержание h1
должно соответствовать тематике, указанной в title
страницы;</li>
<li>При составлении h1
обязательно используйте ключевую фразу, по которой продвигается страница;</li>
<li>Содержание заголовка должно быть уникальным, емким и тематичным. Не стоит делать h1
полной копией тега Title
. Важно, чтобы на каждой странице ресурса были прописаны уникальные h1
—h6
, поэтому избегайте повторений;</li>
<li>Нельзя перечислять в заголовке <a href="/computer-literacy/gde-luchshe-nachat-reklamu-odnostranichnika-kak-reklamirovat.html">ключевые фразы</a> через запятую. Содержание h1
должно быть понятно не только поисковикам, но и посетителям ресурса.</li>
</ul><p><img src='https://i0.wp.com/internet-technologies.ru/wp-content/uploads/articles/201512/pravila-sostavlenija-glav-030726.jpg' width="100%" loading=lazy></p>
<h3>Как правильно использовать теги h2-h6?</h3>
<p>Кроме h1
для расстановки заголовков, которые идентифицируются поисковыми системами, используются теги h2
, h3
, h4
, h5
, h6
и т.д.</p>
<h4>Тег h2</h4>
<p>Как правило, используется для заголовков постов в ленте, размещенной на <a href="/useful-programs/yandeks-nachalnaya-stranica-ustanovit-kak-sdelat-glavnuyu-stranicu-yandeks.html">главной странице</a> или для подзаголовков в статье.</p>
<h4>Теги h3, h4</h4>
<p>Зачастую с их помощью выделяют названия подзаголовков, рубрик и виджетов в sidebar
.</p>
<h4>Теги h5, h6</h4>
<p>Предназначены для еще более мелких элементов страниц, которые следует отделить от остального текста.</p>
<p>Расстановка заголовков h1
— h6
в <a href="/tips-for-beginners/sposoby-vklyucheniya-bluetooth-na-raznyh-versiyah-windows-kak-vklyuchit-blyutuz.html">разных версиях</a> движков может быть реализована по-разному.</p>
<p>Правила расстановки h2
—h6
:</p>
<ul><li>Структура заголовков. Должна быть соблюдена иерархия заголовков;</li>
<li>Размер шрифта. Чем ниже уровень заголовка, тем <a href="/useful-programs/kak-sdelat-melkii-shrift-na-noutbuke-uvelichenie-shrifta-na.html">мельче шрифт</a>. Редактирование шрифтов производится в стилях. Но, как правило, шрифты имеют <a href="/tips-for-beginners/kakie-chasy-epl-votch-luchshe-vybiraem-pravilnyi-razmer-apple-watch.html">правильные размеры</a> по умолчанию;</li>
<li>Не допускается применение тегов заголовков вместе с другими тегами акцентирования. В заголовках рекомендуется использовать ключевые слова, по которым данная станица будет продвигаться в поиске;</li>
<li>В отличие от h1
, теги h2
—h6
могут быть прописаны на странице несколько раз.</li>
</ul><p><body>
<h1>Я главный в иерархии заголовков</h1>
<h2>Мои дети</h2>
<h3>Мои внуки</h3>
<h3>Мои внуки</h3>
<h3>Мои внуки</h3>
<h2>Мои дети</h2>
<h3>Мои внуки</h3>
<h3>Мои внуки</h3>
<h3>Мои внуки</h3>
<h4>Мои правнуки</h4>
<h4>Мои правнуки</h4>
<h4>Мои правнуки</h4>
</body></p>
<ul><li>Не должно быть никакого спама;</li>
<li>Составление текста h1
— h6
должно производиться с использованием синонимов и учетом правил морфологии;</li>
<li>Основные <a href="/the-security-of-your-computer/statistika-poiskovyh-zaprosov-podbor-klyuchevyh-poiskovyh.html">ключевые запросы</a> лучше разместить ближе к началу заголовка;</li>
<li>Ключевые фразы, прописанные в заголовках, должны встречаться в тексте страницы;</li>
<li>Теги h1
— h6
должны быть краткими, емкими и информативными:</li>
</ul>
<p>Здравствуйте, друзья! Рады приветствовать вас на блоге Андрея с Дашей – Thebizfromscratch. Что-то давно мы ничего не писали о SEO и в этой статье хотим наверстать упущенное, ведь тема на сегодня – Влияние заголовков H1, H2 – H6 на продвижение сайта. Мы расскажем, по каким правилам и принципам прописываем заголовки на своём блоге и надеемся, что наш опыт окажется для вас полезным.</p>
<h2><span>Как правильно расставлять мета-теги H1, H2…H6
</span></h2>
<p>Итак, оформляя публикацию, мы прописываем мета-теги в следующем порядке:</p>
<p>Является наиболее значимым заголовком, поэтому в теги h1 принято заключать желательно разбавленный нейтральными словами основной поисковой ключ, т.е. разбавленный title.</p>
<p>Следующий по значимости заголовок, с помощью которого выделяют подобранный к основному запросу <a href="/configuring-windows/chastotnost-zaprosov-vysokochastotnye-i-nizkochastotnye-zaprosy.html">низкочастотный запрос</a>.</p>
<ol><li><b>H3, H4,H5, H6
</b></li>
</ol><p>По сути, не имеют особого влияния на продвижение. Однако включение ключивиков в них может привести к переоптимизации, что вызовет лишь негативный отклик у поисковых ботов. Поэтому данные мета-теги мы используем только для красивого структурирования статьи. Чтобы посетителям было удобнее читать и сразу понимать, где заканчивается одна мысль и начинается другая. Тем более, не забывайте, что все посты пишутся исключительно для читателей и увлекаться частым повтором одних и тех же слов/фраз – не стоит.</p>
<p>А чтобы упомянутая выше информация правильно была понята, давайте рассмотрим пример! Пусть вы написали статью под <a href="/tips-for-beginners/kak-posmotret-statistiku-poiskovyh-zaprosov-vidy-chastotnostei.html">поисковой запрос</a> – «Как сделать сайт». Эту фразу нужно прописать в поле Title и повторить минимум 2 раза без изменений в самом тексте. Или как делают многие – повторяют поисковой запрос 1 раз на 1000 символов.<br><img src='https://i0.wp.com/thebizfromscratch.ru/wp-content/uploads/2016/12/syuda-tittle.jpg' align="center" width="100%" loading=lazy></p>
<p>Если дальше вы нуждаетесь в выделении структуры, то смело используйте H2, содержащий низкочастотный запрос. Опять же в рамках примера – «Как качественно сделать сайт на <a href="/windows-10/nastroika-wordpress-proizvodimaya-srazu-posle-ustanovki-dvizhka-nastroika.html">движке WordPress</a>». Остальные мета — теги пишите без ключей.<br><img src='https://i1.wp.com/thebizfromscratch.ru/wp-content/uploads/2016/12/struktura.jpg' align="center" width="100%" loading=lazy></p>
<ol><li>Не проставляйте в заголовках ссылки на другие продвигаемые страницы. Код ссылки будет расцениваться <a href="/internet-tips/search-engines-in-the-browser.html">поисковыми машинами</a>, как ключевые слова, и только навредит ранжированию.</li>
<li>Не располагайте заголовки низшего порядка над более значимыми. Первым должен следовать H1, затем H2 и далее по нарастающей. Должна вырисовываться древовидная структура.</li>
<li>Рекомендуется использовать H1 единожды, H2 не более 3-х раз, а H3-H6 сколько угодно (только без ключей и только, если это необходимо).</li>
</ol><p>Пожалуй, это были основные принципы и правила, которыми мы пользуемся при оформлении статей. Надеемся, что тема – влияние заголовков H1, H2 – H6 на продвижение сайта – раскрыта и вы нашли для себя <a href="/windows-10/mem-poleznaya-informaciya-chto-takoe-mem-i-kak-na-nih-zarabotat-memy-chto.html">полезную информацию</a>. В случае вопросов – обязательно задавайте их в комментариях, постараемся помочь.</p>
<br style="clear:both;">
<h2>SEO разметка текста.. или семантическая верстка сайта.</h2>
<p>Семантическая верстка сайта - за этим страшным определением скрывается одна <a href="/tips-for-beginners/kak-izmenit-parol-email-kak-izmenit-parol-v-maile-prostye-istiny.html">простая истина</a>: сайт должен быть не просто сверстан, а свёрстан логично! Так что можно сказать примерно так: семантическая верстка это - логичная верстка.</p>
<p>Для того что бы Вам было понятнее о чем идёт речь приведу несколько примеров где логика отсутствует..</p>
<p>Итак, плохие примеры:</p>
<ul><li>Использование заголовков <b><h1> - <h6>
</b> лишь с той целью чтобы увеличить или уменьшить размер буковок..</li><li>Неуместное использование тегов логического форматирования , например, вместо текста <b><address>г. Самара</address>
</b> просто какой то текст, который никоем образом к адресу не относится.. например: <b><address>Установка окон</address>
</b>.</li><li>Использование тегов для формирования списков <b><ul> <ol> <li>
</b> для простой декорации текста или например для создания отступов в тексте.. и наоборот формирование некого списка, перечня например того же меню сайта с помощью других тегов.</li><li>И даже использование таблицы в качестве каркаса сайта (табличная вёрстка) вместо того чтобы использовать таблицу по её прямому назначению, а именно для вывода данных в табличной форме.. расписания движения электричек например.. это тоже НЕ семантическая верстка сайта.</li>
</ul><p>Много всяких примеров приводить можно.. суть же одна: семантическая верстка - эта верстка, при которой каждый тег на странице работает по своему прямому назначению и никак иначе.</p>
<p>Думаю сейчас многие испугались "ааа.. у меня сайт таблицей свёрстан!", "а у меня меню сайта не является списком.." не пугайтесь сильно! конечно к "правильному" построению сайта нужно стремиться, но если по-другому никак не получается то можно чем то и пренебречь, однако некоторые вещи всё же лучше соблюдать!</p>
<p>Заострим внимание на правильной разметке текста, так как это наиболее важно для оптимизации сайта под поисковые системы..</p>
<p>Многие начинающие веб-мастера думают, что заголовки <b><h1> - <h6>
</b> это всего лишь способ выделить текст размером, сделать его крупнее - это не так!! На самом деле теги <b><h1> - <h6>
</b> во-первых выделяют именно <b>заголовки
</b> в тексте, а во вторых выделяют их по степени "важности" например заголовок <b><h1>
</b><b>Как создать сайт?
</b><b></h1>
</b> в глазах поисковых систем куда более важен чем заголовок <b><h6>
</b><b>Как создать сайт?
</b><b></h6>
</b> и если бы это были заголовки двух <a href="/the-security-of-your-computer/yandeks-glavnaya-stranica-izo-kak-yandeks-sdelat-startovoi.html">разных страниц</a> то при прочих равных условиях <a href="/internet-tips/kak-rabotayut-poiskovye-mashiny-interneta-chto-takoe-poiskovaya.html">поисковая машина</a> по запросу пользователя <b>"Как создать сайт?"
</b> выдаст в результатах поиска на первом месте ту страницу, в которой используется заголовок первого уровня <b><h1>
</b>.</p>
<p>Однако не стоит хвататься переделывать все заголовки на Вашем сайте с <b><h2>,<h3>..<h6>
</b> в <b><h1>
</b> ни к чему хорошему в плане оптимизации это не приведёт! В идеале на странице должен присутствовать всего один заголовок первого уровня который как бы содержит в себе два-три заголовка второго уровня в которых в свою очередь "вложены" заголовки рангом поменьше и так далее.. структура документа должна иметь примерно такой вид:</p>
<p>То есть заголовки должны быть, как бы вложены друг в друга по степени важности и иметь древовидный вид. Сам же текст желательно разбить на параграфы с помощью тега <b><p>
</b> - где текст каждого абзаца несет в себе одну логическую часть текста.</p>
<p>Такая разметка текста легко "усваивается" поисковыми системами и другими программами работающими с HTML документами, например, позволяет выхватить один из параграфов для описания сайта в результатах поиска, не ломая голову где начинается и где заканчивается определённая логическая часть текста или учитывая уровни заголовка автоматически составить содержание документа.</p>
<p>Так как текст в заголовках <b><h1>- <h6>
</b> имеет куда более большее значение для поисковых систем, да и просто для человека просматривающего страницу, нежели чем просто текст то их следует наполнять ключевыми словами!</p>
<p>Добрый день, уважаемые посетители.</p><p>Сегодня будет статья по теме заголовков H1-H6 для на сайте.</p> <i>
</i> <p>Наверняка, все уже знаю, что это за заголовки такие, но уверен, что не каждый знает тонкие моменты в их употреблении и не догадываться, что их использование на страницах ресурса преследует всего лишь 2 задачи.</p><h2>Цели и примеры использования</h2><p>Основные 2 цель заголовков в тегах H1-H6 - оформление и структуризация контента на страницах ресурса с целью сделать его более читаемым и легко потребляемым посетителями сайта. Никаких других целей мы не должны преследовать от этих тегов.</p><p>Кроме простого употребления в качестве элементов структуризации контента и его оформления, посетители часто используют данные теги, чтобы придать необходимый дизайн отдельным фразам или даже целым предложениям. Получается ситуация, когда тег H6 (например) имеет дизайн просто жирного шрифта и вместо того, чтобы выделить строчку в тексте тегом <strong>, они заключают его в тег H6. Это в корне неправильно.</p><p>Заголовки в данных тегах должны использоваться лишь для разбиения текста на логические части. Никаких выделений целых предложений и отдельных фраз.</p><p>К тому же заголовки H1-H6 имеют иерархию, что делает их различным по оформлению, как минимум по размеру шрифта. Каждый <a href="/solving-problems/programmy-dlya-formatirovaniya-i-lecheniya-zhestkih-diskov.html">низший уровень</a> должен быть менее заметный, чем вышестоящий над ним.</p><p>На изображении видно правильное оформление заголовков в данных тегах, когда размер шрифта идет по убыванию от <a href="/computer-literacy/domen-chto-eto-takoe-urovni-domena---pervyi-verhnii-vtoroi.html">верхнего уровня</a> к низшему. Если же у вас будет ситуация отличная от этой, то уже стоит обратиться к стилям оформления вашего сайта и отредактировать их должным образом.</p><p>Но тут один момент - проследите, чтобы заголовки нижнего уровня (ближе к H6) были похожи на заголовки и не сливались с обычным текстом. Они должны быть похожи на заголовки, а не просто на <a href="/configuring-wi-fi/kak-sdelat-zhirnyi-shrift-v-bloknote-zhirnyi-tekst-s-pomoshchyu-html-i-css.html">жирный шрифт</a>.</p><p>Исходя из такого оформления, мы можем понять, что заголовки должны выдерживать свою иерархию при употреблении их в качестве элементом структуризации текста. Не может быть такого, что сначала идет первый заголовок H1, а затем сразу H5 или H6. После первого уровня логично и правильно будет использовать только заголовок в теге H2. Это важно, как с точки зрения самого оформления материала, так с точки зрения выдержки правильной структуры.</p><p>Поисковые системы сейчас обращают внимание на данные теги. Но не как на СЕО элементы, а как на элементы структурирования. Поэтому странно будет, если идет H1, а потом сразу H6.</p><p>При использовании данных тегов мы обязательно выдерживаем структуру. Если опускаемся на уровень вниз, то никаких прыжков через уровень. Структуру должна быть следующей: H1-H2-H3-H4-H5-H6.</p><p>Стоит сказать, что употребление заголовка уровня H1 в данных случаях не будет уместно, так как он должен употребляться один единственный раз на странице и должен содержать в себе название материала.
Поэтому, в тексте его употреблять нет необходимости.</p><p>Сейчас я расскажу основные моменты использования заголовка H1, но перед этим дам пару <a href="/the-security-of-your-computer/tormozit-android-chto-delat-obshchie-rekomendacii-i-sovety-po.html">общих советов</a>, которые справедливы для заголовков всех уровней.</p><ul><li>Не заканчиваются точкой;</li><li>Выдерживаем иерархию при употреблении;</li><li>Нет цели разместить ключевые слова;</li><li>Имеют место быть даже в очень коротких статьях, так как любой текст можно разбить на логические части;</li><li>В заголовке вписывает <a href="/hardware-solutions/kratko-i-po-suti-o-tegeranskoi-konferencii-poslednyaya.html">краткую суть</a> последующего текста, а не что-то "лишь бы было".</li>
</ul><h2>Основы использования H1</h2><p>Вышеперечисленные правила также актуальны, но кроме них имеются обязательные именно для этого уровня заголовка.</p><ul><li>H1 всегда один раз на каждой странице;</li><li>Побуждаем пользователя к прочтению материала, поэтому имеется смысл использовать цепкие слова (например, секреты, лучшие фишки и так далее);</li><li>Делаем отличным от <a href="/computer-literacy/podrobnoe-posobie-po-ispolzovaniyu-tega-title-chto-takoe-teg-title.html">тега title</a>, который отображает название страницы в поисковой выдаче и побуждает переход на страницу сайта из поиска. Он должен быть немного отличным, но обязательно должен давать понимание того, что контекст материала на странице не изменился;</li><li>Употребляем ключевое слово статьи, но в разбавленной форме, а не в точном вхождении;</li><li>Не рекомендуется использовать знаки препинания.</li>
</ul><h3>Использование на практике</h3><p>Выше я писал, что H1 используется всего лишь 1 раз на странице и он должен быть встроен автоматически в верстку шаблона сайта и подставляться также будет автоматически в заголовок. Проверьте этот момент. Проанализируйте свои заголовки статей и посмотрите, чтобы они были заключены в H1. Если это не так, то редактируем свой шаблон.</p><p>Распространенная ситуация, когда вместо H1 стоит H2. Это не является грубой ошибкой, но лучше такого не допускать.</p><p>Если мы говорим об использовании остальных уровней заголовков H2-H6, то их уже стоит использовать в <a href="/windows-10/chem-otkryt-fail-cab-ustanovka-cab-i-msu-failov-obnovlenii-windows-v.html">ручном режиме</a>.</p><p>Использовав какую-нибудь CMS для создания сайта, данные заголовки добавляются в статьи очень просто. Например, в WordPress на панели форматирования в редакторе страницы всегда имеется пункт заголовков, где можно выбрать нужный уровень, ранее выделив нужный текст, который необходимо заключить в заголовок.</p><p><img src='https://i2.wp.com/kostyakhmelev.ru/wp-content/uploads/2015/02/zagolovki-v-Wordpress.jpg' align="center" height="512" width="288" loading=lazy></p><p>Так с каждым движком. Если же используете HTML верстку сайта и необходимо добавлять теги в ручном режиме, то сложностей тут не возникнет. Стоит лишь заключать нужные части текста между открывающим и закрывающим тегами с нужным уровнями. Смотрите ниже примеры.</p> <p><h2>заголовок 2го уровня</h2>
<h3>заголовок 3го уровня</h3>
<h4>заголовок 4го уровня</h4>
<h5>заголовок 5го уровня</h5>
<h6>заголовок 6го уровня</h6></p><p>Что касается стилей оформления для каждого уровня, то в файле стилей стоит добавить правила к каждому уровню.</p> <p>Заметьте, что перед названием уровня заголовка в стилях нет никаких точек и решеток. Внутри скобок указываем сами стили: тип шрифта, размер, цвет, фон и так далее.</p> <h2>Дизайн заголовков H1-H6</h2><p>Если вы сделаете свои заголовкам уникальный выделяющийся дизайн, то посетители вас за это только поблагодарят и оформление контента будет на <a href="/computer-literacy/chto-takoe-uroven-sar-v-sovremennom-telefone-ili-smartfone-uroven-sar.html">высшем уровне</a>. Сейчас простые заголовки с большим размером шрифта и жирным выделением уже уходят в прошлое.</p><p>В моду приходят простые, но в то же время оформление заголовки с помощью <a href="/internet-tips/sozdanie-kontura-obekta-figury-iz-vydeleniya-v-programme-fotoshop.html">различных выделений</a> линиями, подчеркиваниями с помощью фоном и так далее.</p><p>Я когда-то давал уже некоторые примеры таких дизайнов. Даже, если взять мой блог, то главный заголовок в H1 оформлен не просто большим шрифтом на белом фоне с остальным текстом. Он отделен серой рамкой на общем фоне сайта, что делает его более заметным и акцентирует внимание на нем.</p><p>Приведу вам еще 2 примера оформленных заголовков в H1.</p><p>Как видим, это не просто жирный шрифт, а красивый фон с волнистой нижней поверхностью и подчеркнутой верхней.</p><p>Также интересное оформление можете сами посмотреть на <span>этой странице
</span>.</p><p>Что касается заголовков H2-H6, то их не просто можно оформлять каким-то фоном, а делать им нумерацию (если используете содержание в начале страницы) в виде <a href="/configuring-wi-fi/kak-sdelat-krasivye-nadpisi-na-kartinke-kak-napisat-tekst-na-kartinke.html">красивых картинок</a>. Опять же, это не должны быть <a href="/windows-10/obeshchannyi-platezh-bilain-kak-vzyat-kombinaciya-cifr-kak.html">простые цифры</a>. Вот <a href="/internet-tips/virtualnyi-shl-m-kak-vybrat-ochki-virtualnoi-realnosti-nyuansy-sovety.html">хороший пример</a> такой задумки.</p><p>Когда вы знаете то, чего не знают, а тем более не делают большинство, можно перейти и рассмотреть основные ошибки в употреблении заголовков всех уровней на вашем сайте.</p> <h2>Ошибки в употреблении</h2><p>Все ошибки вы уже могли и сами додумать, изучив весь материал выше, но имеются некоторые нюансы. Перечислю все, что может относится именно к вам и то, что немедленно необходимо исправить.</p><ul><li>Больше одного H1 на странице. Это не правильно. Только один раз в каждом документе;</li><li>Использования тегов H1-H6 для оформление дополнительных элементов сайта. В самом начале я писал, что предназначение этих документов - оформление и структуризация контента. Поэтому, их стоит использовать только в контенте. Большинство шаблонов сайтов содержат данные теги в боковых колонках для придания стилей их названий и так далее. Ярко выражено это в <a href="/useful-programs/wordpress-kak-sozdat-shablon-stranicy-sozdanie-shablona-dokumenta.html">шаблонах WordPress</a>, когда название каждого виджета в сайдбаре заключено в H3 или в другие теги.Если такая ситуация имеется, то заменяете заголовочные теги в служебных элементах сайта на другие, например на тег "span";</li><li>Специально вписываем ключевые слова. Раньше бытовало мнение, что вписав ключевые слова в прямом вхождении в заголовки всех уровней, можно повысить их плотность и позиции такой страницы будет выше. Но сейчас это уже "карается законом" поисковых систем и накладываются санкции за спам в заголовках. Тем более, данные теги ранжируются по другим алгоритмам. Вывод:
нет цели вписать ключевые слова;</li><li>Частое употребление точек и знаков препинания. Точки в заголовках вообще употреблять не стоит, так как это неправильно с точки зрения, как копирайтинга, так и <a href="/internet-tips/kak-zapustit-vosstanovlenie-sistemy-na-noutbuke-asus-vosstanovlenie.html">общих правил</a> оформления текстов. Количество знаков препинания также стараемся минимизировать, чтобы повысить читаемость заголовков. Сюда же можно отнести и <a href="/internet-tips/safari-ne-otkryvaet-stranicy-na-aifone-safari-ne-udaetsya-otkryt.html">большое количество</a> слов - не делаем слишком длинные заголовки;</li><li>Не соблюдается выдержка структуры с точки зрения иерархии. Старайтесь соблюдать логическую цепочку в построении иерархии тегов H2-H6 на каждой странице;</li><li>Использование тегов H1-H6 для оформления других элементов текста, а не заголовка. Это то, о чем я говорил выше, когда некорректно настроены стили оформления каждого тега и вместо обычного выделения жирным можно использовать заголовок какого-нибудь уровня.</li><li>Заголовок не уместен или не несет контекст текста, который идет за ним. Чтобы научиться создавать логические заголовки, возьмите пару хорошо оформленных книг, которые вам было легко читать. Также ориентируйтесь на структуризацию контента на сайте Википедии;</li><li>Неиспользование заголовков H1-H6 вообще или же отсутствие на небольших текстах. Просто полное отсутствие и говорить не о чем, а вот про отсутствие на небольших страницах - момент сомнительный, так как любой текст (даже минимальные 1000 символов) имеют логическую структуру. Переход от одной темы к другой. Почему бы его не разбить на логические части подзаголовками различных уровней?</li>
</ul><p>Вот и все, дорогие веб-мастера. Материал про заголовки на сайте подошел к концу. Вышел он довольно затянутый. Где-то я повторялся, но это только, чтобы акцентировать ваше внимание на ключевых мыслях статьи. Надеюсь, что <a href="/the-security-of-your-computer/arhiv-rubriki-knigi-po-sql-podborka-materialov-dlya-izucheniya-baz-dannyh-i.html">данный материал</a> вам пригодился.</p><blockquote><p>Кстати, сможете найти небольшой недочет по моим заголовкам на сайте? Если да, то пишите в комментарии. <a href="/computer-literacy/kakov-status-yazyka-rust-v-dannyi-moment-c-chego-nachat-yazyk.html">Данный момент</a> не сильно заметен, но он имеется.</p>
</blockquote><p>До встречи в следующих материалах. Все еще впереди.</p><p>С уважением, Константин Хмелев!</p>
<script type="text/javascript">
<!--
var _acic={dataProvider:10};(function(){var e=document.createElement("script");e.type="text/javascript";e.async=true;e.src="https://www.acint.net/aci.js";var t=document.getElementsByTagName("script")[0];t.parentNode.insertBefore(e,t)})()
//-->
</script><br>
<br>
<script>document.write("<img style='display:none;' src='//counter.yadro.ru/hit;artfast_after?t44.1;r"+
escape(document.referrer)+((typeof(screen)=="undefined")?"":
";s"+screen.width+"*"+screen.height+"*"+(screen.colorDepth?
screen.colorDepth:screen.pixelDepth))+";u"+escape(document.URL)+";h"+escape(document.title.substring(0,150))+
";"+Math.random()+
"border='0' width='1' height='1' loading=lazy>");</script>
</div>
</article>
<div class="center"><em>Эта статья также доступна на следующих языках: <a href="/th/ebay-100/">Тайский</a><br><br></em>
</div>
<div class="share42init" data-url="/luchshie-magazinyi-ebay-spisok-100/" data-title="Лучшие магазины eBay: список 100+"></div>
<script type="text/javascript" src="/wp-includes/share42/share42.js"></script>
<div id="disqus_thread">
<div id="dsq-content">
<ul id="dsq-comments">
<li class="comment even thread-even depth-1" id="dsq-comment-1071">
<div id="dsq-comment-header-1071" class="dsq-comment-header">
<cite id="dsq-cite-1071">
<span id="dsq-author-user-1071">Next</span>
</cite>
</div>
<div id="dsq-comment-body-1071" class="dsq-comment-body">
<div id="dsq-comment-message-1071" class="dsq-comment-message"><p>Огромное Вам СПАСИБО за очень полезную информацию в статье. Очень понятно все изложено. Чувствуется, что проделана большая работа по анализу работы магазина eBay</p>
</div>
</div>
<ul class="children">
<li class="comment odd alt depth-2" id="dsq-comment-1072">
<div id="dsq-comment-header-1072" class="dsq-comment-header">
<cite id="dsq-cite-1072">
<a id="dsq-author-user-1072" href="/" target="_blank" >rootshell</a>
</cite>
</div>
<div id="dsq-comment-body-1072" class="dsq-comment-body">
<div id="dsq-comment-message-1072" class="dsq-comment-message"><p>Спасибо вам и другим постоянным читателям моего блога. Без вас у меня не было бы достаточной мотивации, чтобы посвящать много времени ведению этого сайта. У меня мозги так устроены: люблю копнуть вглубь, систематизировать разрозненные данные, пробовать то, что раньше до меня никто не делал, либо не смотрел под таким углом зрения. Жаль, что только нашим соотечественникам из-за кризиса в России отнюдь не до шоппинга на eBay. Покупают на Алиэкспрессе из Китая, так как там в разы дешевле товары (часто в ущерб качеству). Но онлайн-аукционы eBay, Amazon, ETSY легко дадут китайцам фору по ассортименту брендовых вещей, винтажных вещей, ручной работы и разных этнических товаров.</p>
</div>
</div>
<ul class="children">
<li class="comment even depth-3" id="dsq-comment-1073">
<div id="dsq-comment-header-1073" class="dsq-comment-header">
<cite id="dsq-cite-1073">
<span id="dsq-author-user-1073">Next</span>
</cite>
</div>
<div id="dsq-comment-body-1073" class="dsq-comment-body">
<div id="dsq-comment-message-1073" class="dsq-comment-message"><p>В ваших статьях ценно именно ваше личное отношение и анализ темы. Вы этот блог не бросайте, я сюда часто заглядываю. Нас таких много должно быть. Мне на эл. почту пришло недавно предложение о том, что научат торговать на Амазоне и eBay. И я вспомнила про ваши подробные статьи об этих торг. площ. Перечитала все заново и сделала вывод, что курсы- это лохотрон. Сама на eBay еще ничего не покупала. Я не из России , а из Казахстана (г. Алматы). Но нам тоже лишних трат пока не надо. Желаю вам удачи и берегите себя в азиатских краях.</p>
</div>
</div>
</li>
</ul>
</li>
</ul>
</li>
<li class="comment odd alt thread-odd thread-alt depth-1" id="dsq-comment-1281">
<div id="dsq-comment-header-1281" class="dsq-comment-header">
<cite id="dsq-cite-1281">
<a id="dsq-author-user-1281" href="/" target="_blank" >rootshell</a>
</cite>
</div>
<div id="dsq-comment-body-1281" class="dsq-comment-body">
<div id="dsq-comment-message-1281" class="dsq-comment-message"><p>Еще приятно, что попытки eBay по руссификации интерфейса для пользователей из России и стран СНГ, начали приносить плоды. Ведь подавляющая часть граждан стран бывшего СССР не сильна познаниями иностранных языков. Английский язык знают не более 5% населения. Среди молодежи — побольше. Поэтому хотя бы интерфейс на русском языке — это большая помощь для онлайн-шоппинга на этой торговой площадке. Ебей не пошел по пути китайского собрата Алиэкспресс, где совершается машинный (очень корявый и непонятный, местами вызывающий смех) перевод описания товаров. Надеюсь, что на более продвинутом этапе развития искусственного интеллекта станет реальностью качественный машинный перевод с любого языка на любой за считанные доли секунды. Пока имеем вот что (профиль одного из продавцов на ебей с русским интерфейсом, но англоязычным описанием):<br />
https://uploads.disquscdn.com/images/7a52c9a89108b922159a4fad35de0ab0bee0c8804b9731f56d8a1dc659655d60.png</p>
</div>
</div>
</li>
</ul>
</div>
</div>
</div>
<div id="sidebar-bottom">
<aside id="sidebar-1" class="sidebar">
<div id="categories-2" class="widget widget_categories"><h4 class="widgettitle">Разделы</h4> <ul>
<li class="cat-item"><a href="/category/configuring-windows/">Настройка Windows</a>
</li>
<li class="cat-item"><a href="/category/hardware-solutions/">Аппаратные решения</a>
</li>
<li class="cat-item"><a href="/category/windows-10/">Windows 10</a>
</li>
<li class="cat-item"><a href="/category/internet-tips/">Интернет-подсказки</a>
</li>
<li class="cat-item"><a href="/category/useful-programs/">Полезные программы</a>
</li>
<li class="cat-item"><a href="/category/configuring-wi-fi/">Настройка Wi-Fi</a>
</li>
<li class="cat-item"><a href="/category/tips-for-beginners/">Советы начинающим</a>
</li>
<li class="cat-item"><a href="/category/solving-problems/">Решение проблем</a>
</li>
</ul>
</div><div id="text_icl-3" class="widget widget_text_icl"> <div class="textwidget"><p><a href="" rel="alternate" type="application/rss+xml"><img src="//feedburner.google.com/fb/images/pub/feed-icon32x32.png" alt="" style="vertical-align:middle;border:0"/ loading=lazy></a> <a href=""
rel="alternate" type="application/rss+xml">Подписаться на RSS</a></p></div>
</div><div id="text_icl-7" class="widget widget_text_icl"> <div class="textwidget"><div class="center"></div></div>
</div><div id="text_icl-8" class="widget widget_text_icl"> <div class="textwidget"></div>
</div><div id="text_icl-13" class="widget widget_text_icl">
</div><div id="text_icl-14" class="widget widget_text_icl">
</div>
</aside>
<aside id="sidebar-2" class="sidebar">
</aside>
</div>
</section>
<footer id="footer">
<div class="center">Разрешается копирование материалов сайта с обязательной ссылкой на <a href="/">makewap.ru</a>
</div>
</footer>
</div>
<script type='text/javascript'>
/* <![CDATA[ */
var scriptParams = { "google_search_engine_id":"007248068859778613277:ewdxetioq-u"} ;
/* ]]> */
</script>
<script type='text/javascript' src='https://makewap.ru/wp-content/plugins/wp-google-search/assets/js/google_cse_v2.js?ver=1'></script>
<script type='text/javascript' src='/wp-includes/js/comment-reply.min.js?ver=4.9'></script>
<script type='text/javascript' src='/wp-includes/js/wp-embed.min.js?ver=4.9'></script>
<script>
window.__bp_session_timeout = '900';
window.__bp_session_freezing = 0;
!function() {
window.bizpanda || (window.bizpanda = { }), window.bizpanda.bp_can_store_localy = function() {
return !1
} , window.bizpanda.bp_ut_get_cookie = function(e) {
for( var n = e + "=", i = document.cookie.split(";"), o = 0; o < i.length; o++ ) {
for( var t = i[o]; " " == t.charAt(0); ) {
t = t.substring(1);
}
if( 0 == t.indexOf(n) ) {
return decodeURIComponent(t.substring(n.length, t.length))
}
}
return !1
} , window.bizpanda.bp_ut_set_cookie = function(e, n, i) {
var o = new Date;
o.setTime(o.getTime() + 24 * i * 60 * 60 * 1e3);
var t = "expires=" + o.toUTCString();
document.cookie = e + "=" + encodeURIComponent(n) + "; " + t + "; path=/"
} , window.bizpanda.bp_ut_get_obj = function(e) {
var n = null;
return (n = window.bizpanda.bp_can_store_localy()
? window.localStorage.getItem("bp_ut_session")
: window.bizpanda.bp_ut_get_cookie("bp_ut_session"))
? (n = JSON.parse(n), n.started + 1e3 * e < (new Date).getTime() && (n = null), n)
: !1
} , window.bizpanda.bp_ut_set_obj = function(e) {
e.started && window.__bp_session_freezing || (e.started = (new Date).getTime());
var e = JSON.stringify(e);
window.bizpanda.bp_can_store_localy()
? window.localStorage.setItem("bp_ut_session", e)
: window.bizpanda.bp_ut_set_cookie("bp_ut_session", e, 5e3)
} , window.bizpanda.bp_ut_count_pageview = function() {
var e = window.bizpanda.bp_ut_get_obj(window.__bp_session_timeout);
e || (e = { }), e.pageviews || (e.pageviews = 0), 0 === e.pageviews && (e.referrer = document.referrer, e.landingPage = window.location.href, e.pageviews = 0), e.pageviews++, window.bizpanda.bp_ut_set_obj(e)
} , window.bizpanda.bp_ut_count_locker_pageview = function() {
var e = window.bizpanda.bp_ut_get_obj(window.__bp_timeout);
e || (e = { }), e.lockerPageviews || (e.lockerPageviews = 0), e.lockerPageviews++, window.bizpanda.bp_ut_set_obj(e)
} , window.bizpanda.bp_ut_count_pageview()
} ();
</script>
</body>
</html>
