Что такое Open Graph protocol
Такой вариант подходит для сайтов с небольшим количеством видеороликов и с редким количеством обновлений клипов. Таким образом, с помощью протокола OpenGraphProtocol мы передадим данные о видео, а значит, и посмотреть ролики сможет большее число пользователей.
Open Graph Protocol - это оснащение страниц веб ресурса метаданными в формате Social Graph , посмотрите как он используется на Facebook. Social Graph предлагает хорошие возможности для описания ресурсов.
Как пользоваться этим протоколом можно прочитать через переводчик, но в сети есть очень хороший перевод документации Open Graph Protocol на русский язык. Перевел для вас Shift-Web.
Перевод документации Open Graph Protocol
Базовые метаданные
Чтобы сделать ваши страницы объектами графа к ним необходимо добавить базовые метаданные. За основу мы взяли уже существующий стандарт RDFa, который позволяет расширять описание характера информации путём добавления соответствующих <meta> тегов в <head> секцию документа. Есть 4 необходимых свойства, которые должна иметь каждая страница.
og:title - Название объекта, то как он должен быть представлен в графе, например, «Скала».
og:type - Тип вашего объекта, например, "movie"(кино). В зависимости от типа можно указать и другие свойства.
og:image - URL вашего изображения, который опишет его.
og:url - Канонический URL объекта, который будет использован в качестве постоянного ID, например, "http://www.imdb.com/title/tt0117500/".
Пример описания кинофильма «Скала» на сайте IMDB на уровне мета разметки.
<html xmlns:og="http://ogp.me/ns#">
<head>
<title>Скала (1996)</title>
<meta property="og:title" content="Скала" />
<meta property="og:type" content="movie" />
<meta property="og:url" content="http://www.imdb.com/title/tt0117500/" />
<meta property="og:image" content="http://ia.media-imdb.com/images/rock.jpg" />
...
</head>
Следующие свойства не являются обязательными для любого объекта, но рекомендуется их заполнить:
og:description - Одно или два предложения описывающие объект.
og:site_name - Если объект является частью более крупного веб-сайта, укажите преимущественное название, которое должно отображаться, например, "IMDb".
Пример.
meta property="og:type" content="actor" />
<meta property="og:description" content="Шон Конери прославился и разботел благодаря своей роли агента британской разведки, Джеймса Бонда." />
<meta property="og:site_name" content="IMDb" />
Схематику RDF, относящуюся к Open Graph и другим смежным графам можно посмотреть на http://ogp.me/schema.
Геотаргетинг
Open Graph позволяет также указывать местоположение объекта. Это полезно, если речь идёт об объекте имеющем местоположение в реальном мире, например организация с юридическим адресом. Эти данные можно задать с помощью широты и долготы, указанием мета данных полного адреса. Имена свойств заимствованы из стандарта микроформатов hCard.
Для указания широты и долготы существуют два специальных свойства:
Для указания широты и долготы существуют два специальных свойства:
og:latitude - например, "37.416343".
og:longitude - например, "-122.153013".
Если требуется указать человеко-читаемый адрес, то можно воспользоваться следующими пятью свойствами:
og:street-address - например, "1601 S California Ave"
og:locality - например, "Palo Alto"
og:region - например, "CA"
og:postal-code например, "94304"
og:country-name - например, "USA"
Пример.
<html xmlns:og="http://ogp.me/ns#">
<head>
...
[ОБЯЗАТЕЛЬНЫЕ ТЕГИ]
<meta property="og:latitude" content="37.416343" />
<meta property="og:longitude" content="-122.153013" />
<meta property="og:street-address" content="1601 S California Ave" />
<meta property="og:locality" content="Palo Alto" />
<meta property="og:region" content="CA" />
<meta property="og:postal-code" content="94304" />
<meta property="og:country-name" content="USA" />
...
</head>
Контактная информация
Протокол Open Graph позволяет указывать и информацию для связи. Вполне возможно, что в будущем протокол будет позволять описывать эти данные непосредственно в теле страницы. На данный момент можно воспользоваться одним из трёх свойств для описания контактной информации:
og:email - например, "me@example.com".
og:phone_number - например, "+1-650-123-4567".
og:fax_number - например, "+1-415-123-4567".
Пример:
<html xmlns:og="http://ogp.me/ns#">
<head>
...
[ОБЯЗАТЕЛЬНЫЕ ТЕГИ]
<meta property="og:email" content="me@example.com" />
<meta property="og:phone_number" content="650-123-4567" />
<meta property="og:fax_number" content="+1-415-123-4567" />
...
</head>
Описание видеоданных
Если вы хотите прикрепить видео, то его можно тоже описать, указав прямой URL к файлу:
og:video - например, "http://example.com/awesome.flv"
и, если захотите, можете добавить дополнительные метаданные:
og:video:height - например, "640"
og:video:width - например, "385"
og:video:type - например, "application/x-shockwave-flash"
Если вы не укажете тип сами og:video:type, парсеры попытаются сделать это самостоятельно. Разумно будет предположить, что по умолчанию скорее всего тип определится как "application/x-shockwave-flash" т.к. в HTML5 <video> становится всё более распространенным способом подключения.
Пример:
<html xmlns:og="http://ogp.me/ns#">
<head>
...
[ОБЯЗАТЕЛЬНЫЕ ТЕГИ]
<meta property="og:video" content="http://example.com/awesome.flv" />
<meta property="og:video:height" content="640" />
<meta property="og:video:width" content="385" />
<meta property="og:video:type" content="application/x-shockwave-flash" />
...
</head>
Описание аудиоданных
Аналогично с og:video вы можете описать и аудиофайл:
og:audio - например, "http://example.com/amazing.mp3"
и дополнительные данные:
og:audio:title - например, "Amazing Soft Rock Ballad"
og:audio:artist - например, "Amazing Band"
og:audio:album - например, "Amazing Album"
og:audio:type - например, "application/mp3"
Пример:
<html xmlns:og="http://ogp.me/ns#">
<head>
...
[ОБЯЗАТЕЛЬНЫЕ ТЕГИ]
<meta property="og:audio" content="http://example.com/amazing.mp3" />
<meta property="og:audio:title" content="Amazing Song" />
<meta property="og:audio:artist" content="Amazing Band" />
<meta property="og:audio:album" content="Amazing Album" />
<meta property="og:audio:type" content="application/mp3" />
...
</head>
Типы объектов
Для того, чтобы ваш объект был представлен в графе нужно указать его типовую характеристику. Делается это с помощью og:type свойства:
<meta property="og:type" content="product" />
Это базовая схема и она включает в себя некоторые виды. Вполне разумно предположить, что социальные сети будут использовать эту схему или расширять её для более детального описания:
activity
sport
Бизнес
bar
company
cafe
hotel
restaurant
Группы
cause
sports_league
sports_team
Организации
band
government
non_profit
school
university
Люди
actor
athlete
author
director
musician
politician
profile
public_figure
Места
city
country
landmark
state_province
Продукция и Развлечения
album
book
drink
food
game
movie
product
song
tv_show
Для продуктов, которые имеют код UPC или ISBN номер, Вы можете задать их, используя
og:upc и og:isbn свойства. Эти свойства помогают задать более конкретные связи между графами.
Web ресурсы
article
blog
website
|