Your SlideShare is downloading. ×
Передача дополнительных сведений о сайте с помощью семантической разметки
Upcoming SlideShare
Loading in...5
×

Thanks for flagging this SlideShare!

Oops! An error has occurred.

×
Saving this for later? Get the SlideShare app to save on your phone or tablet. Read anywhere, anytime – even offline.
Text the download link to your phone
Standard text messaging rates apply

Передача дополнительных сведений о сайте с помощью семантической разметки

263

Published on

Передача дополнительных сведений о сайте с помощью семантической разметки …

Передача дополнительных сведений о сайте с помощью семантической разметки
Общие рекомендации и ответы на часто задаваемые вопросы

Published in: Technology
0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total Views
263
On Slideshare
0
From Embeds
0
Number of Embeds
0
Actions
Shares
0
Downloads
3
Comments
0
Likes
0
Embeds 0
No embeds

Report content
Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
No notes for slide

Transcript

  • 1. Передача дополнительных сведений о сайте с помощью семантической разметки Юлия Тихоход, Яндекс Менеджер проектов, Семантический веб Вебмастерская, 20.04.2013
  • 2. Краткое содержание следующих 20 минут Как приготовить хороший борщ сниппет? Как подать сайт в социальных сетях? Ответы на прочие животрепещущие вопросы
  • 3. 3 Как сварить борщ?
  • 4. У хорошего сниппета тоже есть рецепт 4
  • 5. Ингредиенты: 5 • Сайт – по вкусу; • Вебмастер – 1 шт. (можно взять верстальщика или разработчика); • Прямые руки – 2 шт.
  • 6. Красивые сниппеты можно получить для: Яндекс Google Адреса и организации Товары и цены Рецепты Словари Рефераты Отзывы Фильмы Музыка Приложения Элементы навигации Люди 6 V V V V V V V V V V V V V V V V Документация Яндекса Документация Google http://help.yandex.ru/webmaster/ https://support.google.com/webmasters/
  • 7. Какие еще данные можно передавать Яндексу: Вклады и кредиты Словари Вакансии Отзывы об автомобилях Отзывы об организациях Недвижимость Автообъявления Видео Оригинальные тексты 7
  • 8. 8 Где искать информацию о партнерских программах?
  • 9. Объем информации Реклама 9 Проверьте, подходит ли ваш сайт для участия в партнерской программе
  • 10. Schema.org Open Graph Микроформат XML 10 Выберите способ передачи данных
  • 11. http://clck.ru/48Dyk 11 Семантическая разметка (schema.org, Open Graph, микроформаты)
  • 12. XML - расширяемый язык разметки <offer id="12346" available="true"> <url>http://best.seller.ru/product_page.asp?pid=12348</url> <price>699.54</price> <currencyId>USD</currencyId> <categoryId>6</categoryId> <picture>http://best.seller.ru/img/device12345.jpg</picture> <delivery>false</delivery> <local_delivery_cost>300</local_delivery_cost> <name>Золотые наручные часы </name> <vendor>Longines</vendor> <vendorCode>A1234567B</vendorCode> <description>Изящные золотые часы.</description> <country_of_origin>Швейцария</country_of_origin> </offer> 12
  • 13. Данные • • • • • 13 Адреса Товары и цены Видео Отзывы Вакансии Условия • Нет ненормативной лексики • Нет порнографических материалов Способ передачи данных • • • • Schema.org Микроформаты XML Вебмастер
  • 14. Типы данных 14 Внимательно изучите документацию
  • 15. Добавьте разметку на свой сайт 15 <div itemscope itemtype="http://schema.org/Review"> <h2 itemprop="name"><a href="http://example.com/review?10231" itemprop="url">Отличный автомобиль. Рекомендую</a></h2> <img itemprop="image" src="http://example.com/img001.jpg"> <div>Отзыв написал <span itemprop="author" itemscope itemtype="http://schema.org/Person"> <p itemprop="name"> <a itemprop="officialWebPage" href="http://example.com/users/vasya">Вася Пупкин</a></p> </span> <meta itemprop="datePublished" content="2012-07-15">15 июля 2012. </div> <div itemprop="reviewRating" itemscope itemtype="http://schema.org/Rating"> <meta itemprop="worstRating" content="0"/> <p>Оценка: <span itemprop="ratingValue">9</span> из <span itemprop="bestRating">10</span>.</p> </div> <div itemprop="pro">Комфортный, надежный, экономичный автомобиль. Мощный и маневренный, отлично слушается руля</div> <div itemprop="contra">Ненадежный глушитель</div> <div itemprop="reviewBody"> <p>Отличный, неприхотливый авто, с недорогим обслуживанием. Достаточно вместительный.</p>
  • 16. 16 Плагины к популярным CMS и онлайн генераторы
  • 17. 17 Например, в WordPress это может выглядеть так
  • 18. 18 Не забудьте проверить - http://webmaster.yandex.ru/microtest.xml
  • 19. 19 Не забудьте проверить - http://webmaster.yandex.ru/microtest.xml
  • 20. Часто задаваемые вопросы 20
  • 21. Часто задаваемые вопросы • “Я сделал разметку, где мой сниппет?” 21
  • 22. Часто задаваемые вопросы • Какой формат микроразметки использовать: микроданные, микроформаты, RDFa? 22
  • 23. Часто задаваемые вопросы • Валидатор W3C воспринимает микроданные как ошибку 23
  • 24. Часто задаваемые вопросы • Валидатор Яндекса выдает предупреждения, а у меня все по инструкции ПРЕДУПРЕЖДЕНИЕ: чтобы ваши данные использовались в сервисе Яндекс.Видео необходимо дополнительно указать поля: og:video, og:video:type, og:image ПРЕДУПРЕЖДЕНИЕ: поле itemReviewed/model отсутствует или пусто 24
  • 25. Часто задаваемые вопросы • Нужно ли размечать все свойства? 25
  • 26. Часто задаваемые вопросы • Влияет ли наличие семантической разметки на сайте на ранжирование? 26
  • 27. Часто задаваемые вопросы • Когда вы начнете поддерживать <название разметки>? Следите за обновлениями на http://webmaster.ya.ru/ 27
  • 28. А еще семантическая микроразметка поможет красиво подать ваш сайт в социальных сетях 28
  • 29. 29 Как подать сайт в социальных сетях?
  • 30. • Ссылка на сайт в социальной сети может выглядеть так • А может, так 30
  • 31. И еще один пример 31
  • 32. 32 The Open Graph protocol - http://ogp.me/
  • 33. Пример разметки Open Graph <meta property="og:title" content="Яндекс.Музыка"> <meta property="og:type" content="website"> <meta property="og:image" content="http://music.yandex.ru/i/jUU164Zv_c9bhjOkFkqK7DXn DI8.png"> <meta property="og:site_name" content="Яндекс.Музыка"> <meta property="og:locale" content="ru_RU"> <meta property="og:description" content="Яндекс.Музыка миллионы легальных треков, бесплатно и без регистрации. Постоянные обновления каталога, все жанры и направления."> 33
  • 34. og:title ведет на og:url og:image 34 og:description
  • 35. Не забудьте проверить свою разметку! 35
  • 36. Блок «Поделиться» для вашего сайта http://api.yandex.ru/share/ 36
  • 37. Юлия Тихоход Менеджер проектов Семантический веб tilid@yandex-team.ru Твиттер: @Yulia_Tikhokhod 37

×