Статус этого документа — предварительная спецификация. Это первая версия, в которой описано наше представление о способах реализации интерактивных ответов в поиске Яндекса. Мы предполагаем, что спецификация будет дополняться в процессе совместной работы с владельцами сайтов, поэтому рады получить от вас обратную связь.
Текущая работающая функциональность описана в документации.
Яндекс запустил платформу «Острова» — новый интерфейс и новые инструменты, которые помогают владельцам сайтов сделать ответы в результатах поиска интерактивными:
- переносить ввод данных на страницу результатов поиска;
- передавать информацию от сервиса в режиме реального времени;
- переносить транзакцию на страницу результатов поиска.
Для создания интерактивных ответов мы предлагаем использовать язык описания форм и API для real-time взаимодействия с Яндексом. Здесь мы вначале рассмотрим эти технологии, а затем перейдем к примерам ответов, которые можно сделать с их помощью.
Краткий обзор возможностей
- Язык описания форм;
- Правила для описания формы с произвольной семантикой в формате xml;
- Инструмент для тестирования форм в поисковом интерактивном ответе;
- Расширение стандарта разметки Open Graph для интеракций: web-handler (deep link) и http-handler (real-time взаимодействие).
В настоящий момент доступна бета-версия инструмента для вебмастеров. В качестве примера в нем реализован поисковый интерактивный ответ для сервиса Яндекс.Авто. Чтобы сделать такой ответ для своего сайта, ознакомьтесь с документацией и воспользуйтесь редактором форм.
Для того, чтобы в ответе могли появиться интерактивные элементы, мы предлагаем использовать язык описания форм. С его помощью можно рассказать о полях формы, указать их тип и возможные значения.
Сообщить Яндексу описание полей формы можно с помощью разметки внутри страницы или в отдельном xml/json-файле. Мы будем поддерживать оба способа.
Возможные значения полей (словари) позволяют Яндексу разбирать поисковые запросы, относящиеся к вашему сайту, и автоматически выставлять значения в соответствующие поля формы. Пользователь сможет уточнить запрос с помощью выпадающих списков, чекбоксов и т.д., при этом по клику на кнопку он будет попадать на правильно сформированный URL на вашем сайте.
Названия полей и их значения могут быть произвольными или фиксированными. В некоторых случаях мы будем требовать, чтобы описание формы соответствовало семантическому стандарту, разработанному для конкретной тематики. Например, для регистрации на авиарейс. Такие тематические спецификации будут публиковаться в качестве дополнения к этому документу. Также мы предполагаем наследовать семантику, которая вводилась ранее вместе с запуском наших сервисов. Например, для Яндекс.Услуг.
Далее рассмотрим примеры: транзакционная кнопка, простая форма с несколькими полями и сложная форма с большими словарями значений.
###Транзакционная кнопка Если на вашем сайте производятся он-лайн транзакции (бронирование, регистрация, запись, покупка), вы можете разместить транзакционную кнопку в результатах поиска. По клику на нее пользователь перейдет к выполнению действия на вашем сайте.
Пример: транзакционная кнопка для регистрации на рейс
Чтобы указать на возможность проведения транзакции, нужно добавить два мета-тега на страницу, к которой вы хотите привязать это действие. Для бронирования столика в кафе это выглядит так:
<html prefix="ya: http://webmaster.yandex.ru/vocabularies/">
<head>
<meta property="ya:interaction" content="BUTTON" />
...
<meta property="ya:interaction:type" content="ReserveAction" />
<meta property="ya:interaction:url" content="http://example.com/bar/124123#book" />
...
</head>
...
</html>Теги, начинающиеся с interaction, являются расширением открытого стандарта Open Graph Protocol (http://ogp.me).
- interaction (Enum) — обязательный тег, показывающей какого типа интерактивный ответ описан. Для транзакционных кнопок значение должно быть "BUTTON"
- interaction:type (Enum) — обязательный тег, обозначающий возможное действие. Примерами могут быть бронирование в ресторане (значение "ReserveAction"), покупка товара (значение "BuyAction") и др. Текущий перечень доступных действий опубликован в [документации] (http://help.yandex.ru/webmaster/?id=1127950#actions)
- interaction:url (URL) — обязательный тег, обозначающий адрес страницы, на которую нужно перейти для совершения действия. Это может быть как страница на вашем сайте, если действие можно совершить на нём, так и страница на другом сайте (сайте агрегатора), если ваш сайт такой возможности не предоставляет.
Также требуется указать prefix="ya: http://webmaster.yandex.ru/vocabularies/" в теге html или head — это требование стандарта.
###Простая форма Для простых форм, которые содержат небольшое количество полей, описание удобно выполнять на самой странице внутри html-тега form. Если параметры в тематике зафиксированы в страндартах schema.org или Open Graph, то описание формы можно будет сделать c помощью разметки.
Пример: простая форма для регистрации на рейс
todo: рассмотреть возможность использования стандарта XForms
###Сложная форма и словари Для сайтов, которые содержат сложные поисковые формы и большие словари значений, форму удобнее описывать в отдельном файле. Этот вариант поддержан в бета-версии интерактивных ответов для вебмастеров. Вы можете воспользоваться редактором форм: передать описание полей и протестировать работу нашего алгоритма. Там же размещена подробная документация.
Пример: поисковая форма для сайта про автомобили
##API для real-time взаимодействия Для создания интерактивных ответов, которые предполагают реал-тайм взаимодействие c пользователем, на вашем сайте необходимо реализовать API. Сообщить нам о появлении такого API можно будет с помощью разметки в Open Graph или в специальном разделе Яндекс.Вебмастера. Далее приводим возможности API, которые собираемся поддерживать на страницах результатов поиска.
####API может возвращать real-time данные для конкретной страницы Например, для сервиса это могут быть погода на сегодня или табло аэропорта, для страницы товара — его цена и наличие; для страницы, которая содержит списки объектов, — количество найденного или диапазон цен. В этом случае API должен быть привязан к конкретной странице сайта.
####API может возвращать real-time данные, в зависимости от входящих параметров Параметры на входе API могут быть произвольными и передаваться Яндексу через описание полей и значений формы. В некоторых случаях параметры будут фиксироваться для конкретной тематики (см. подробнее о семантике). Помимо ответа real-time данными API сервиса может перенаправлять пользователя на правильный URL (deep link), который соответствует набранным параметрам в форме и учитывает контекст пользователя (например, регион и язык).
Также для API будут специфицированы формат ответа (xml/json), время устаревания ответа (зависит от тематики), разрешенная частота обращений. Мы ожидаем, что API будут отвечать с высокой скоростью (300-400 мсек) и выдерживать некоторую нагрузку.
Пример: выбор даты и вида специалиста показывает актуальное расписание врачей
###Спецификация API по стандарту Open Graph
Покажем на примере, как с помощью разметки в Open Graph может быть специфицировано API и его ответ в конкретной тематике — «бронирование отелей».
Представим, что мы хотим показать цену на номер в отеле в зависимости от дат заезда (arrival), выезда (departure) и количества гостей (guests). При этом для корректного отображения необходимо также задать валюту цены (currency) и язык ответа (lang). Изменяя время заезда и выезда пользователь без перехода на сайт получает цену номера в отеле на выбранные даты, а также URL, по которому можно продолжить транзакцию.
#####Пример описания работы API Разметка может выглядеть как часть описания объекта:
<html prefix="ya: http://webmaster.yandex.ru/vocabularies/">
<head>
<meta property="ya:interaction" content="RTResponse" />
...
<meta property="ya:interaction:type" content="ReserveAction" />
<meta property="ya:interaction:url" content="http://host/prefix?hotel=433" />
...
</head>
...
</html>Теги, начинающиеся с interaction, являются расширением открытого стандарта Open Graph Protocol (http://ogp.me).
- interaction:url (URL) обязательный тег, обозначающий API урл. По этому урлу должна быть возможность получить ответ в зависимости от заданных пользователем параметров.
- interaction:url:method (Enum — необязательный тег, обозначающий тип запроса к API. Если тег не указан, по умолчанию тип считается GET. Возможные значения GET, POST.
- interaction:url:response_format (Enum — необязательный тег, обозначающий тип ответа. Если тег не указан, по умолчанию тип считается JSON. Возможные значения JSON, XML.
- interaction:paid_service (Boolean) — необязательный тег, указывающий, что на одном из шагов транзакции пользователю может потребоваться заплатить денег. Если тег не указан, по умолчанию считается, что вся транзакция бесплатная. Пример платной транзакции — покупка товара.
То же, но с указанием необязательных параметров:
<html prefix="ya: http://webmaster.yandex.ru/vocabularies/">
<head>
...
<!--Возможность забронировать номер в отеле -->
<meta property="ya:interaction" content="RTResponse" />
<meta property="ya:interaction:type" content="ReserveAction" />
<meta property="ya:interaction:url" content="http://host/prefix?hotel=433" />
<meta property="ya:interaction:url:method" content="GET" />
<meta property="ya:interaction:url:response_format" content="JSON" />
...
</head>
...
</html>По условиям примера пользователь указывает дату заезда (arrival), выезда (departure) и количества гостей (guests), а параметры — валюта цены (currency) и язык ответа (lang) мы понимаем из его текущего контекста. Тогда полный запрос к API от Яндекса будет выглядеть так: http://host/prefix?hotel=433&arrival=2014-12-10&departure=2014-12-21¤cy=RUB&lang=RU&guests=2.
В ответ API сервиса должен вернуть цену номера в отеле на выбранные даты, а также URL, на котором происходит следующий шаг транзакции. Например, так:
{
"price" : {
"value" : 2455.00,
"currency" : "RUB"
},
"url" : "http://host/url"
}##Примеры интерактивных ответов Рассмотрим различные варианты интерактивных ответов на примере кейса «заказ такси». Будем последовательно добавлять функциональные элементы, опираясь на описанные выше технологии.
####Ответ real-time данными Вначале добавим real-time данные в интерактивный ответ. Для этого Яндекс вместе с загрузкой страницы результатов поиска асинхронно запрашивает API сервиса. После того, как API отдает данные, например, количество свободных машин, они догружаются в ответ.
####Транзакционная кнопка Теперь укажем на возможность совершить транзакцию на сайте, в данном случае — заказать такси. Сайт должен передать Яндексу правильный внутренний URL, на котором выполняется действие. Для некоторых случаев транзакция может выполняться сторонним сервисом и на отдельном URL (например, покупка билета в кино).
####Транзакционная форма Добавим несколько полей, чтобы пользователь мог указать маршут поездки или сообщить его в поисковом запросе. Например, в запросе [заказ такси до ленинградского вокзала] мы распознаем географию и проставим ее в поле «Куда». По клику на кнопку «Заказать» пользователь переходит на сайт для продолжения транзакции, а Яндекс передает сайту параметры указанного маршрута.
Для демонстрации поискового интерактивного ответа мы подготовили работающий пример для сервиса Яндекс.Авто.
####Транзакционная форма с real-time предпросмотром результата Наконец, добавим форме интерактивности — начнем real-time отвечать на работу пользователя с формой. В нашем примере API сервиса возвращает стоимость поездки в зависимости от указанного маршрута.
####Транзакция на СЕРПе в интерфейсе В некоторых случаях, когда это выгодно и пользователю, и владельцу сайта, транзакцию можно будет полностью провести на странице результатов поиска. Например, зарегистрироватся на рейс или забронировать столик. Для этого мы по-прежнему будем использовать язык описания форм и API для real-time взаимодействия. В первом случае необходимо описать поля по вводу данных для совершения транзакции, во втором - расширить возможности API и возвращать Яндексу соответствующие статусы по транзакции («возможна», «в процессе», «проведена», «отменена»).
В нашем примере осталось ввести свое имя, контактный телефон и указать время подачи такси. Если API сервиса подтвердит оформление заказа, Яндекс сообщит об этом пользователю.
