HTML заголовки h1, h2, h3

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

Heading-TagsДля начала, думаю, нужно сказать для чего вообще нужно, чтобы заголовки h1, h2, h2 отображались правильно. Дело в том, что есть такое понятие SEO (search engine optimization – поисковая оптимизация) которое включает в себя определённые правила для того, чтобы к вашему сайту хорошо относились поисковые системы (Яндекс, Google и другие). Это хорошее отношение нужно, чтобы ваш сайт был как можно выше в выдаче поисковых систем и вы получали больше посетителей. Но не будем вдаваться в подробности SEO, так как там целая наука (раньше занимался этим и вел свой seo-блог), а скажу лишь то, что правильная расстановка тегов h1, h2, h3 положительно влияет на продвижение вашего сайта.

h1, h2, h3 – это html-теги или по-другому это заголовки: 1 уровня (h1), 2 уровня (h2), 3 уровня (h3). Также есть еще и заголовки уровня 4 (h4), 5 (h5) и 6 (h6), но на них поисковые системы особо не смотрят, поэтому их я не рассматриваю. Больше всего внимания поисковые роботы обращают на заголовки 1 уровня (h1), чуть меньше на 2 уровня (h2) и еще меньше на заголовки 3 уровня (h3). Поэтому рекомендуется отображать информацию в заголовках по степени значимости, например в h1 – название статьи, h2 – описание статьи, h3 – название частей статьи (если она разбита на части) или название блога. Т.е. должна выстроиться логическая цепочка по которой поисковый робот должен понять о чем статья и по какому запросу её выдавать в поисковой выдаче. Как-то так, фух.

Инструкции о том как настроить заголовки здесь не будет, так как на каждом сайте или блоге все индивидуально, при желании можно найти в интернете статьи о том как настраиваются HTML заголовки на определённом движке и по образу и подобие настроить на своем сайте. Я хотел бы показать схему по которой настроил отображение заголовков на этом блоге. Думаю, что такая схема подойти для любого блога, так что можете ей воспользоваться.

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

Также, когда я решил настроить отображение заголовков, написал небольшую программу на языке C#, которая находит заголовки 1,2 и 3 уровня на веденной странице. Т.е. чтобы постоянно не лазить в исходный код страницы и не искать там заголовки, программку и смастерил, правда выкладывать её не собирался, но может кому-нибудь пригодиться, вот ссылка, а вот скриншот:

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

На этом у меня все, если что-либо не понятно пишите в комментариях, всем пока!

Категория: Web-разработка
Понравилась статья? Поделись в социальных сетях:

  • Aleksey Sh.

    Нормальный ход.

    • http://programmict.ru/ Дмитрий

      Спасибо, думаю поисковым роботам тоже понравится :)

  • http://kingsofcontent.biz/ Хороший контент-KingsOfContent

    не советую везде дублировать название и описание сайта – это лишний текст. который пользы не принесет.