• Русский
  • English
  • Русский
  • English
Сделать заказ

Микроразметка Shema.org

ГлавнаяWeb Микроразметка Shema.org
08.12.2020 Web

Микроразметка необходима сайту, чтобы упростить поисковикам распознавание информации, размещенной на нем. Shema.org помогает роботам наиболее точно обработать, распределить и понять информацию на интернет-ресурсах, чтобы потом выдать эти данные пользователям в поисковой выдаче. Кроме того, поисковые роботы относятся более лояльно к сайтам с микроразметкой, что позволяет быстрее индексировать новые посты.

Схема разметки для раздела “Контакты” (schema.org LocalBusiness)
Микроразметка для бизнеса или филиалов организации, которые имеют физический адрес. Примерами могут служить как отдельный ресторан, так и каждое заведение сети, филиал банка, стоматологическая клиника и т.д. Данная разметка позволяет поисковым системам получать больше информации о вашем бизнесе и выводить её в сниппетах. Рассмотрим пример микроразметки для организации типа “Веб-студия” (такого типа нет, поэтому будем использовать довольно общий тип “Бизнес” 2 уровня)

  1. <div itemscope itemtype=“http://schema.org/LocalBusiness”>
  2.  
  3. <p itemprop=“name”>Дизайн студия</p>
  4. <p itemprop=“description”>Веб студия занимается разработкой сайтов на 1С-Битрикс</p>
  5.  
  6. <div itemprop=“address” itemscope=“ itemtype=“http://schema.org/PostalAddress”>
  7. <p>Адрес:
  8. <span itemprop=“postalCode”>119019</span>,
  9. <span itemprop=“addressCountry”>Россия</span>,
  10. <span itemprop=“addressRegion”>Московская область</span>,
  11. <span itemprop=“addressLocality”>Москва</span>,
  12. <span itemprop=“streetAddress”>Красная площадь, д. 1</span>
  13. </p>
  14. </div>
  15.  
  16. <p>Телефоны:
  17. <span itemprop=“telephone”>8(495)123-45-67</span>,
  18. <span itemprop=“telephone”>8(499)123-45-67</span>
  19. </p>
  20.  
  21. <p>Факс:
  22. <span itemprop=“faxNumber”>8(495)123-45-67</span>
  23. </p>
  24.  
  25. <p>E-mail:
  26. <a itemprop=“email” href=“mailto:[email protected]”>[email protected]</a>
  27. </p>
  28.  
  29. <p>Адрес сайта:
  30. <a href=“http://site.ru” itemprop=“url”>site.ru</a>
  31. </p>
  32.  
  33. <img itemprop=“logo” src=“http://site.ru/Images/logo.png”>
  34.  
  35. <div>Время работы:
  36. <time itemprop=“openingHours” datetime=“Mo-Fr 9:00−20:00”>С Понедельника по Пятницу 9-20</time>,
  37. <time itemprop=“openingHours” datetime=“St,Sn”>Суббота, Воскресенье круглосуточно</time>
  38. </div>
  39.  
  40. <div itemprop=“geo” itemscope=“ itemtype=“http://schema.org/GeoCoordinates”>
  41. <meta itemprop=“latitude” content=“55.7537523”>
  42. <meta itemprop=“longitude” content=“37.6225168”>
  43. </div>
  44.  
  45. <p>ИНН:
  46. <span itemprop=“taxID”>1234567890</span>
  47. </p>
  48.  
  49. </div>

Схема для раздела “О компании” (schema.org Organization)
Эта схема универсальна, если вы не отнесли свою фирму ни к одному другому типу, смело пользуйтесь этой схемой. Тут приводится общая контактная информация, наименование, адреса, телефоны, электронная почта.

  1. <div itemscope=“ itemtype=“http://schema.org/Organization”>
  2. <p itemprop=“name”>Наименование организации</p>
  3.  
  4. Контактная информация:
  5. <div itemprop=“address” itemscope=“ itemtype=“http://schema.org/PostalAddress”>
  6. <p>Почтовый адрес:
  7. <span itemprop=“streetAddress”>номер дома, улица</span>
  8. <span itemprop=“postalCode”>почтовый индекс</span>
  9. <span itemprop=“addressLocality”>город, страна</span>
  10. </p>
  11. </div>
  12.  
  13. <p>Телефон:
  14. <span itemprop=“telephone”>контактный телефон</span>,
  15. Факс:<span itemprop=“faxNumber”>факс</span>,
  16. E-mail: <span itemprop=“email”>корпоративный e-mail</span>
  17. </p>
  18. </div>

Микроразметка для раздела “Статьи” (schema.org/Article)
Микроразметка статьи позволяет сделать сниппет более структурированным и человекочитаемым. Следует найти файл, который отвечает за обзор статей. Например, это может быть: single.php. Для начала находим тег, отвечающий за вывод контента, и вставляем нужный атрибут.

  1. <div itemscope itemtype=“http://schema.org/BlogPosting”>
  2. <link itemprop=“mainEntityOfPage” itemscope href=“Ссылка” />
  3. <div itemprop=“publisher” itemscope itemtype=“https://schema.org/Organization”>
  4. <div itemprop=“logo” itemscope itemtype=“https://schema.org/ImageObject”>
  5. <img alt=“Логотип сайта” itemprop=“image url” src=“Ссылка на логотип сайта”/>
  6. <meta itemprop=“width” content=“размер в пикселях”>
  7. <meta itemprop=“height” content=“размер в пикселях”>
  8. </div>
  9. <meta itemprop=“telephone” content=“Телефон”>
  10. <meta itemprop=“address” content=“Адрес”>
  11. <meta itemprop=“name” content=“Название”>
  12. </div>
  13. <meta itemprop=“datePublished” content=“1111”>
  14. <meta itemprop=“dateModified” content=“Дата последнего редактирования статьи”>
  15. <span itemprop=“author” itemscope itemtype=“http://schema.org/Person”>
  16. <span itemprop=“name”>Автор статьи</span>
  17. </span>
  18. <div itemprop=“articleBody”>
  19. <h1 itemprop=“headline”>Заголовок Вашей статьи</h1>
  20. <span itemprop=“image” itemscope itemtype=“https://schema.org/ImageObject”>
  21. <img itemprop=“image url” alt=“Описание изображения” width=“размеры в пикселях” height=“размеры в пикселях” src=“Ссылка на изображение”/>
  22. <meta itemprop=“width” content=“размеры в пикселях”>
  23. <meta itemprop=“height” content=“размеры в пикселях”>
  24. </span>
  25. <p>Тут идет основной текст статьи, который можно разбить на абзацы. Разрешено использование всех html тэгов разметки.</p>
  26. </div>
  27. </div>

Микроразметка для “Картинок” (schema.org/ImageObject)
Существует отдельный поиск по изображениям, который дает дополнительную возможность увеличить трафик на сайт, если пользователь ищет товар по изображению. Атрибут itemprop=”image” позволяет роботам быстро распознавать информацию о картинках. Достаточно будет указать ссылку на изображение, описание, название картинки, подпись, размеры изображения.

  1. <div itemscope itemtype=“http://schema.org/ImageObject”>
  2. <h2 itemprop=“name”>название картинки</h2>
  3. <img src=“https://www.seo.ru/images.jpg” itemprop=“contentUrl” />
  4. <p itemprop=“description”>описание картинки</p>
  5. </div>

Микроразметка для раздела “Товарные страницы” (shema.org Product)
Для разметки товарных страниц используются схемы Product и Offer или AggregateOffer в Schema.org/Product. Таким образом информация ваших продуктовых страниц может быть представлена в виде структурированных сниппетов с описанием товара и ценой в выдаче Яндекса. Разметив эту разметку на странице сайта, можно привлечь больше потенциальных покупателей.

Вариант 1

  1. <div itemscope itemtype=“http://schema.org/Product”>
  2. <span itemprop=“name”>Кровать Мелисса с мягкой спинкой</span>
  3. <span itemprop=“brand”>Компания диваны</span>
  4. <img itemprop=“image” src=“https://www.iseo.ru/bitrix/templates/iseo/images/melissa.png” />
  5. <span itemprop=“description”>Кровать Мелисса с мягкой спинкой и гарантией производителя</span>
  6.  
  7. <div itemprop=“offers” itemscope itemtype=“http://schema.org/Offer”>
  8. <meta itemprop=“priceCurrency” content=“RUB” />
  9. <span itemprop=“price”>6793</span>
  10. </div>
  11. </div>

Вариант 2

  1. <div itemscope itemtype=“http://schema.org/Product”>
  2. <span itemprop=“name”>Плюшевый еж “Уф Уф”</span>
  3. <span itemprop=“brand”>Фабрика плюшевых ежей “С иголочки”</span>
  4. <span itemprop=“model”>Номер модели 964893NM</span>
  5. <img itemprop=“image” src=“Ссылка на изображение ежа” />
  6. <span itemprop=“description”>Текстовое описание товара.</span>
  7.  
  8. <div itemprop=“offers” itemscope itemtype=“http://schema.org/Offer”>
  9. <meta itemprop=“priceCurrency” content=“RUB” />
  10. <span itemprop=“price”>Стоимость товара</span>
  11. <span itemprop=“seller”>Продавец товара</span>
  12. </div>
  13.  
  14. </div>

Микроразметка для раздела “Отзывы” (schema.org/Review)
Если на страницах товаров есть отзывы, их также можно разметить при помощи свойства Review. В результате в выдаче Google в сниппете появится рейтинг и отзывы: В коде сайта необходимо указать следующие атрибуты.

  1. <div itemscope itemtype=“http://schema.org/Review”>
  2. <h2 itemprop=“name”><a href=“http://example.com/review?10231” itemprop=“url”>Русская кухня в изгнании</a></h2>
  3. <div>Отзыв написал <span itemprop=“author” itemscope itemtype=“http://schema.org/Person”>
  4. <span itemprop=“name”>
  5. <a itemprop=“url” href=“http://example.com/users/vasya”>Вася Пупкин</a>
  6. </span>
  7. </span>
  8. <meta itemprop=“datePublished” content=“2012-07-15” />
  9. 15 июля 2012.
  10. </div>
  11. <div itemprop=“reviewRating” itemscope itemtype=“http://schema.org/Rating”>
  12. <meta itemprop=“worstRating” content=“0”/>
  13. <p>Оценка: <span itemprop=“ratingValue”>9</span> из <span itemprop=“bestRating”>10</span>.</p>
  14. </div>
  15. <div itemprop=“pro”>Бесплатная стоянка, прекрасная детская комната и предупредительные официанты.</div>
  16. <div itemprop=“contra”>Большой и шумный некурящий зал.</div>
  17. <div itemprop=“reviewBody”>
  18. <p>Заказ был готов сравнительно быстро, а напитки приготовили практически сразу.
  19. Обслуживание на уровне, хотя грязная посуда иногда застаивалась.</p>
  20. <p>Рекомендую русскую кухню, особенно супы.</p>
  21. </div>
  22. <div>Автор посетил заведение <meta itemprop=“dateVisited” content=“2012-07-10”>10 июля 2012.</div>
  23. <div>Оценки характеристик ресторана:
  24. <ul>
  25. <li