Работа с объектами в javascript - Используем функции - Теория и практика. Работа с объектами в JavaScript: теория и практика

03.04.2019

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

Всего тегов заголовков существует шесть. Это h1, h2, h3, h4, h5 , h6. Эти теги применяются для форматирования текста на странице. H1 самый весомый среди них как для посетителе, так и для поисковиков.

Приветствую Вас на страницах . В этой статье поделюсь с Вами некоторыми моментами при использовании заголовка H1 на страницах блога под управлением CMS WordPress.

Тег H1 — значение для продвижения

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

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

Правила заполнения заголовка H1

Для получения хорошего результата при продвижении страниц сайта следует выполнять следующие правила его заполнения:

Каждая страница должна содержать ОДИН тег H1.
Тег должен содержать одно ключевое слово, по которому продвигается страница.
Содержимое заголовка H1 должно быть уникальным для каждой страницы.
Тег H1 не должен быть гиперссылкой.
Желательно, чтобы тег не содержал классов, идентификаторов и других CSS элементов, а был в «голом» виде.
Не рекомендуется использовать в содержимом знаков препинания, запятых, двоеточий и так далее.
Размер тега не должен быть более двух предложений, лучше одно.

В html-коде заголовок страницы должен выглядеть таким образом:

Тег H1 это заголовок страницы

Наиболее типичные грубые ошибки – это отсутствие тега H1 на странице или присутствие более одного заголовка. Такие ошибки обычно характерны для страниц разделов, в которых перечислены статьи, входящие в эти разделы.

Контроль заполнения тега H1 по всему сайту проводится в рамках . Для проведения такого аудита есть немало достойных инструментов. Я же порекомендую Вам сервис от Мегаиндекса – audit.megaindex.ru .

Тег H1, применение в WordPress

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

Эта же недоработка обнаружилась и на моем блоге, после того как я создал при помощи программы Artisteer. При просмотре HTML-кода было обнаружено, что все заголовки страниц выводятся с тегом H2.

Для устранения этого пришлось редактировать файл single.php , именно так в большинстве шаблонов называются файлы, которые выводят информацию по каждой отдельной записи. Как я это сделал сейчас продемонстрирую наглядно.
В теле файла single.php ищем часть кода, которая выводит заголовок. В моем случае этот выглядело таким образом:

Меняем выделенные красным цветом теги h2 на необходимые h1 и файл single.php исправлен и готов к использованию. Оказалось, что это довольно просто, поменял пару символов и готово. Теперь этот блок стал выглядеть так:

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

Аналогичные изменения мне пришлось проделать с еще одним файлом темы page.php , который отвечает за вывод страниц блога. Как известно блог на CMS WordPress содержит записи и страницы.

Функции создания и изменения их находятся в разных разделах администрирования блога, они хранятся в разных местах и соответственно за их вывод отвечают и разные программные модули.

В итоге отрезок кода в файле page.php , который выводит заголовок страницы стал выглядеть вот так:

» rel=»bookmark» title=»»>

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

Ведь использование двух и более заголовков этого типа на одной странице не рекомендуется. Поисковые системы могут это расценить как переоптимизацию и сделать соответствующие выводы.

Тег H1, корректировка шаблона WordPress

В конце концов решил подправить эту недоработку, тем более, что хлопот больших это не принесло. Сейчас я Вам обо всем подробно доложу.

Для этого надо было внести поправки всего в два файла.

Первый header.php — это файл вывода заголовка блога.

Второй style.css — файл описания стилей блога.

Изменения header.php

/»>

Находим в header.php фрагмент, который выводит заголовок блога и меняем тег заголовка h1 (выделил красным цветом те символы, которые изменяю) на тег абзаца p . В результате получили такой код.

/»>

Изменения в файле style.css

Синим цветом я выделил наименование класса css, который нам придется подправить в файле style.css , чтобы шрифт и размер вывода заголовка блога остался прежним, таким же как и до изменений. Далее открываем файл стилей, ищем поиском необходимый класс «art-Logo-name», фрагмент ниже

h1 .art-Logo-name, h1 .art-Logo-name a, h1 .art-Logo-name a:link, h1 .art-Logo-name a:visited, h1 .art-Logo-name a:hover
{

font-size: 29px;
text-decoration: none;
padding:0;
margin:0;
color: #E0EDF0 !important;
}

Все выделенные красным цветом h1 меняю на p и получаю в результате

p .art-Logo-name, p .art-Logo-name a, p .art-Logo-name a:link, p .art-Logo-name a:visited, p .art-Logo-name a:hover
{
font-family: Arial, Helvetica, Sans-Serif;
font-size: 29px;
text-decoration: none;
padding:0;
margin:0;
color: #E0EDF0 !important;
}

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

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

На этом позволю себе закончить, а Вам пожелать успехов.

Полезные Материалы:

Привет, ребята! Чувствую, обстановка накаляется, в комментариях начал прорываться мат, оскорбления в мой адрес. Что ж, а то я уже заскучал по этим временам. 🙂 Самое худшое - это игнорирование. А когда ругают - это же хорошо, значит кого-то задеваю. Радует. 🙂 Эге-ге-гей, товарищ комментатор, привет!!! 🙂 Но из-за мата мне, твой комментарий пришлось удалить, я не раз говорил, что ругательства подобного плана терпеть не стану.

Многие обвиняют меня в продажных статьях. Да, было время, но я же обещал, что их количество будет уменьшаться. Но некоторые до сих пор думают, что если я делаю обзор какого-то сервиса - этот пост продажный. Думайте, что хотите, такие господа. Моя совесть чиста и улыбаюсь я во все кривые свои 32 зуба. Настроение у меня прекрасное, да и моих преданных читателей оно будет таким, по крайней мере я буду стараться. 🙂

В прошлом уроке я рассказывал, про SEO расширение для браузеров . Я не просто так решил поднять давно изъезженную тему. Я решил поставить точки над И. Многи читатели у меня спрашивают, как правильно использовать заголовки h1, h2, h3 и т.п.? Я уже когда-то в далеком 2012 году. Делая аудиты многих сайтов я вижу одни и те же ошибки, которых я не признаю. Значит, пришло время немного дополнить тот урок.

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

Правила использования заголовков h1, h2, h3, h4 на странице с точки зрения SEO

Правило №1: на странице должен быть только 1 тег h1.

Запомните, только 1, а не 2, тем более не 3. Многих интересует, как же узнать количество данных тегов на странице и очень часто вебмастера начинают лезть в исходный код страницы и в ручную искать эти теги. Я тоже так делал до тех пор, пока мой "братан по интернету" Виталий (http://mojwp.ru/) не подсказал мне очень хитрую вещь, которая, оказывается, встроена в мой любимый SEO bar.

Что вам требуется?

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

Правило №2: заголовки h2, h3, h4 должны быть только в самой статье.

В моем случае Вы видите, что h2 используется очень даже правильно, а вот в теге h3, h4 у меня - "мусор". То есть данные словосочетания не несут никаких полезностей в плане SEO. Более того, используя теги h в ненужных местах мы снижаем значимость этих тегов для поисковых систем, так как их "вес" раскидывается на ненужные словосочетания. Поэтому, теги h должны быть только внутри статьи. Да, бывают исключения, когда ключевые слова очень грамотно вписывают в отдельные блоки по сайту, но туда впихивают никак не фразу "Подпишитесь на сайт" и т.п.

Как исправить эти ошибки?

Для исправления подобных ошибок нам снова понадобится очередное дополнение, о котором я уже рассказывал - это (для Chrome он тоже есть).

Мы находим элемент в ненужном нам теге h на странице, например, для примера возьму выражение "Подписка" и "Сайт", про которые мне подсказал RDS bar (они в h4, см. картинку выше). Нашел я эти 2 элемента на сайте (можете воспользоваться поиском в браузере Ctrl+F, вбив необходимую фразу для поиска), "инспектируем" с помощью Firebug один из них:

И справа мы видим стили данного тега h4 (в моем случае):

Они сейчас нам пригодятся. Открываем файл style.css нашей темы и прямо в конце дописываем характеристики данного стиля (см. на стрелку картинки выше), просто назвав его как-то по-другому (я решил назвать new4, не забываем в начале точку):

Так как данное выражение "Подписка" находится у меня в подвале, я открываю файл footer.php, вбиваю фразу "Подписка" через CTRL+F, вот он:

И вместо h4 прописываем наш новый класс (в моем случае "new4"), то есть после видоизменения будет такая картина:

Сохраняем файл, открываем Firefox, обновляем страничку и видим, что тег h4 со словом "Подписка" пропал:

Так как стили слов "Подписка" и "Сайт" у меня не отличаются, я аналогично в подвале вместо тега h4 к слову "Сайт" прописываю класс "new4", и мы видим, что теперь на странице "мусорных" h4 нет:

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

Если же у Вас вдруг статья не в h1, просто откройте файл темы single.php, найдите там вывод заголовка статьи (ищите в поиске через выражение "the_title") и обрамите его в h1:

Правило №3: на главной странице крайне желательно использовать тег h1.

На данный момент на моем сайте на главной странице нет h1, что, как я считаю, нарушают структуру.

Я считаю, что на странице не может быть тега h3, если выше него нет h2, также не может быть использован h2, если нет h1. Аналогично, использование h1 и h3, например, без h2 - тоже неправильно. Причем все четко должно идти по структуре: h2 не может стоять выше h1 на странице, h3 не должен стоять выше первого тега h2 и т.д.

Что же запихнуть в h1 для главной страницы? Это может быть текст, куда грамотно включены наиболее запрашиваемые ключевые слова, по которым вы продвигаетесь. Повторюсь, ГРАМОТНО вписанные, а не тупое перечисление.

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

Запомните: заголовок h1 должен быть отличен от title страницы. Это будет полезно для поискового продвижения.

Обычно, где-то в этом месте встречается описание сайта (в моем случае его нет):
Но тут возникает некая проблема: если мы пропишем это описание в h1 в шапке сайта, то оно внутри статей тоже будет в h1, что снова неправильно.

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

И мой еще один "братан по интернету", на этот раз уже с Казани, которого зовут Рамиль (жаль у него нет блога, поставил бы сейчас ссылку), любезно поделился этой PHP функцией (вы же знаете, в PHP я не "шарю"), вот она:

Описание сайта

Описание сайта

Тут вы заранее должны задать в style.css одинаковые стили для h1 и для стиля "description", чтобы визуально посетители не видели отличий.

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

или

По-моему, все. Если будут вопросы - пишите, по-любому отвечу. И да, продолжайте писать веселые комментарии, они вызывают у меня улыбку и поднимают настроение. 🙂

» Использование заголовков H1-H6

Использование заголовков H1-H6

В данной статье мы постараемся объяснить что такое теги h1-h6 и как их правильно использовать с учётом продвижения сайта. Так как правильное использование заголовков поможет вам быстро и без особых усилий выйти на более высокие позиции в поисковых системах. Заголовки H1-H6 являются самыми важными тегами акцентирования и на ряду с мета-тегами title обладают огромным значением для правильной seo оптимизации сайта. Без этой важной связки вывести страницу в топ, в конкурентной тематике просто невозможно.
Приведем с начало некоторые правила составление заголовков в порядке их значимости:

Используйте ключевые слова в заголовках
Спам запрещён в заголовках любого уровня
Тег H1 должен использоваться только один раз
Ключи из заголовка должны реально присутствовать на странице
Заголовок первого уровня должен быть как можно выше в коде страницы
Указывайте важные ключевые фразы как можно ближе к началу заголовка
Заголовки должны быть информативными и при этом не очень длинными
Ключевые фразы в подзаголовках старайтесь составлять с учетом морфологии и синонимов
В первом предложении после заголовка должен использоваться ключ из него

Ну давайте разберем подробнее как использовать эти теги и дадим вам несколько советов по их составлению.

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

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

ваша ключевая фраза между тегами

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

Наиболее значимым для seo является тег H1 и служит он для главного заголовка страницы. Это может быть название статьи, новости или имя товара, словом текст заключенный в H1 играет важнейшую роль и между этим тегом обязательно должна находится ключевая фраза, которая должна иметь наибольший вес на странице. Стоит заметить что заголовок H1 должен использоваться только один раз и содержать главные и самые значимые ключевые слова под которые вы и планируете продвигать эту страницу. Правила написания заголовков практически идентичны рекомендациям составления мета заголовка Title, советуем ознакомится с ними если это вы ещё не сделали.

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

В отличии от заголовка первого уровня другие (H2-H6) могут употребятся несколько раз на странице, но как вы уже догадались вес они имеют в порядке убывания. Эти теги используются для подзаголовков и в них также рекомендуется заключать значимые ключевые фразы в так сказать разбавленном или в уточняющем виде. Используйте в них синонимы вписывайте свой ключ с учётом морфологии, но не делайте их слишком похожими с заголовком H1. Используемые слова и фразы обязательно должны присутствовать на странице помимо заголовков и идти в логическом порядке, причем первое предложение после заголовка желательно должно максимально ему соответствовать.

Никогда не стоит делать заголовков такого плана: "Добро пожаловать на страничку..." и им подобных. Это не принесет странице ни чего хорошего и отнимет у нее львиную долю веса. Любой заголовок на вашей странице должен быть предназначен не только для посетителей сайта, но и для поисковых систем. Заголовки на странице должны быть не только информативными, но и не слишком длинными, при составлении заголовков необходимо найти золотую середину. Яндексу и Google необходимо понять о чем идет речь на странице, вставляйте в теги H1-H6 ключевые слова, но без фанатизма иначе можно сделать только хуже.

Стоит отметить что теги заголовков H1-H6 должны идти строго в порядке убывания на странице. Именно на странице а не в тексте, так как часто бывают случаи, когда например в бесплатных шаблонах это далеко не так и это также снижает вес желаемых ключевых слов. Бытует мнение что заголовки ниже H3 не имеют ни какого значения для поисковых систем и это конечно может оказаться правдой, но мы всё же рекомендуем использовать их для разметки текстового содержания, а не заголовков и блоков других элементов сайта. Для этого есть огромное количество других html-тегов.

Частые ошибки при использовании тегов заголовков

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

Еще одна распространенная ошибка, которая присутствует в некоторых шаблонах, это ошибки верстки по отношению к seo и не следование стандарту W3C. Довольно часто можно встретить что на некоторых сайтах в теги H заключают ссылки, изображения, логотипы в шапке сайта и т.д. Что плохо отражается на всём сайте в целом.

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

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

Первый заголовок, на который часто посетитель сайта не обращает внимание — тот, который показан на вкладке браузера (). Для поисковой системы он самый главный, так как именно его Яндекс, 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%

...

Утверждение 2: есть небольшая разница в том как располагать ссылку: внутри тега h или тег h внутри ссылки. И она заключается в том, что в первом случае ссылкой является только текст, а во-втором — весь блок.

только текст

весь блок (прямоугольная область)

Должен ли title отличаться от h1 ?

"Может ли title быть таким же как h1 ?" — да, может.

"Различный title и h1 полезны для SEO?" — да, полезны. В рассматриваемые теги можно добавить дополнительные ключевые слова, чтобы увеличить хвост запросов, по которым приходят на сайт. Или чтобы сделать более привлекательный сниппет, в title внести, скажем, название компании, коли фирма на слуху, или номер телефона (для такси, например).

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

Нужно ли заголовки боковых блоков брать в h ?

Если заголовки индексируются (см. ), то пусть лучше будут в теге h . Всё равно они употребляются на каждой странице сайта и вес этих слов ("Реклама", "Последние сообщения", "Подписка" и т.п.) завышен. Можно предположить, что родитель aside должен уменьшать их значение.

К тому же для слабовидящих будет понятно что к чему, а не сплошные untitled .

SEO разметка текста.. или семантическая верстка сайта.

Семантическая верстка сайта - за этим страшным определением скрывается одна простая истина: сайт должен быть не просто сверстан, а свёрстан логично! Так что можно сказать примерно так: семантическая верстка это - логичная верстка.

Для того что бы Вам было понятнее о чем идёт речь приведу несколько примеров где логика отсутствует..