Микроразметка сайта, блога — без особого труда

Привет друзья! Эту статью я считаю очень важной в плане оптимизации блога!

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

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

Почему так важна микроразметка и вообще что это такое? Микроразметка сайта - это особые теги в коде html, которые предназначены идентифицировать элементы на Вашем сайте или блоге, для поисковых систем - например Яндекс и Google.

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

Зачем нужна микроразметка сайта?

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

Как все это выглядит визуально, смотрим изображения:

На сайте применена микроразметка "Schema.org".

Сайт без микроразметки!

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

Что мы увидим, если проанализируем эту страницу на релевантность к ключевому запросу? Она упала! Почему так произошло? Все очень просто, Ваша статья перемешалась с оставленными комментариями. А поисковая система не понимает где у Вас комментарии, а где сама статья. Она весь этот текст примет за статью!

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

В третьих, если ПС понимает Ваш сайт или блог лучше, чем другие, то и повышается релевантность! Об этом пишет и сам Яндекс:

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

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

Что нам потребуется для реализации микроразметки? На сайте Sсhema.org существуют различные схемы разметки, наша задача выбрать ту схему, которая наиболее точно описывает тематику Вашего сайта.

Допустим если у Вас Блог, то подойдет схема BlogPosting, если же у Вас сайт посвящен фильмам, то Movie. Я думаю разберетесь и выбор схемы не составит большого труда. Кстати можно воспользоваться переводчиком, если плохо знаете английский язык :)

Рассмотрим внедрение на движке WordPress. Итак схему разметки выбрали, допустим BlogPosting, переходим (Внешний вид -> Редактор -> entry_single.php) и ищем что-то вроде этого:

<div id="post-<?php the_ID(); ?>" <?php post_class(); ?>

Добавляем нашу схему микроразметки:

<div id="post-<?php the_ID(); ?>" <?php post_class(); ?> itemscope itemtype="http://schema.org/BlogPosting">

Так схему указали, осталось только указать классы для элементов, находим нечто подобное на entry_single.php, entry.php, comments.php, вообщем везде где присутствуют эти данные и добавляем классы:

  • <h1 itemprop="headline" class="entry-title"><?php the_title();?></h1>
  • <span class="vcard author"><span itemprop="author" class="fn"><?php the_author(); ?></span></span>
  • <span itemprop="datePublished" class="updated"><?php echo get_the_date(); ?></span>
  • <span itemprop="articleSection"><?php the_category(', '); ?></span>
  • <li id="li-comment-<?php comment_ID(); ?>" itemprop="comment">
  • <div class="thumb-entry"><?php the_post_thumbnail('category-thumbnail','itemprop=image'); ?></div>
  • <span itemprop="articleBody"><?php the_content(); ?></span>

Определения классов:

  • headline - заголовок;
  • author - автор статьи;
  • datePublished - дата публикации;
  • articleSection - категория статьи;
  • comment - комментарий;
  • itemprop=image - картинка, изображение;
  • articleBody - сама статья.

Хотел бы еще сказать вот что, если в Вашем шаблоне просто код php, но его нужно идентифицировать с помощью микроразметки, то берем этот код внутрь <span>код php</span>.

например <span itemprop="datePublished">код php</span>.

Вот и все друзья! На этом микроразметка Schema.org подошла к концу! Не трудно правда?

Что бы проверить Ваш сайт, блог на правильность разметки используйте инструменты:

от Яндекса и Google.

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

Чтобы узнать какие схемы поддерживают поисковые системы Яндекс и Google на данный момент скопируйте в строку браузера эти адреса:

http://help.yandex.ru/webmaster/schema-org/what-is-schema-org.xml
https://support.google.com/webmasters/topic/1088474?hl=ru&ref_topic=2643152

А я буду закругляться, надеюсь моя статья помогла Вам и Вы без особого труда, сделали микроразметку на своем ресурсе! Кстати хотелось бы услышать мнения вебмастеров, которые ее внедрили, как разметка повлияла на продвижение?

Развиваем мозги, найди 10 отличий ;)