Закрепленные сайты в Windows 8


Начальный экран Windows 8 — самое удобное место для поиска необходимых вам приложений и контента и отслеживания их обновлений. Плитки приложений находятся в активном состоянии и отображают актуальный настроенный контент, благодаря чему вы всегда будете в курсе интересующих вас событий.

Мы уже писали о просмотре сайтов в Windows 8 с использованием Internet Explorer 10 в стиле Metro. В этой записи блога подробно рассматриваются закрепленные сайты Internet Explorer 10 и доступ к ним на начальном экране Windows 8, а также соответствующие сайтам визуальные элементы и уведомления на индикаторах событий, сообщающие о появлении нового контента. Мы также рассмотрим особенности поддержки закрепленных сайтов со стороны веб-разработчиков.

В следующем видеоролике показаны закрепленные сайты в Windows 8 Consumer Preview в действии.


Закрепленные сайты в Windows 8

Закрепленные сайты — это больше, чем просто "Избранное"

Пользователи Windows большую часть своего времени проводят в Интернете, и из результатов телеметрии, проводимой с их явного согласия (в рамках официальной программы улучшения качества программного обеспечения Майкрософт), мы знаем, что они многократно посещают один и тот же набор сайтов. С помощью закрепленных сайтов в Windows 8 можно легко и быстро перейти к интересующим вас сайтам. Благодаря уведомлениям на индикаторах событий, плитки сайтов наполняются новой информацией, и вы всегда будете осведомлены о том, что появился новый контент.

Разработчики могут использовать закрепленные сайты, чтобы улучшить связь между своим сайтом и пользователями и продвигать свой сайт непосредственно на начальном экране Windows. Мы обнаружили, что для сайтов, которые использовали этот компонент с Internet Explorer 9 в Windows 7, рост числа посещений составил от 15 до 50 процентов. В Windows 8 взаимодействовать с сайтами еще удобнее благодаря обновлениям плитки сайта, даже если он не открыт в браузере.

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

Закрепленные сайты на начальном экране: показаны соответствующие сайту визуальные элементы и уведомления на индикаторах событий
Закрепленные сайты на начальном экране: показаны соответствующие сайту визуальные элементы и уведомления на индикаторах событий

Пример уведомления на индикаторе событий на плитке закрепленного сайта
Пример уведомления на индикаторе событий на плитке закрепленного сайта

Соответствующий сайту визуальный элемент на плитке закрепленного сайта

Как веб-разработчик, вы можете предоставить значок сайта, который будет использоваться Internet Explorer 10 для представления сайта в браузере, в адресной строке, на странице новой вкладки и на начальном экране. Для идентификации сайта, закрепленного на начальном экране, Internet Explorer 10 использует большие значки сайта (32 x 32 пикселя) аналогично тому, как они использовались в Internet Explorer 9 для закрепления на панели задач.

Снимок экрана, на котором показано закрепление сайта: Internet Explorer 10 в стиле Metro отображает предварительный вид плитки сайта
Снимок экрана, на котором показано закрепление сайта: Internet Explorer 10 в стиле Metro отображает предварительный вид плитки сайта

Internet Explorer 10 определяет преобладающий цвет значка и автоматически использует его в качестве цвета фона для плитки на начальном экране.

Одним из средств создания значков является x-icon editor. Воспользуйтесь им для создания значка размером 32x32 для своего сайта. С его помощью можно также преобразовать изображение в формат файла значка (с расширением ICO). Затем свяжите этот ICO-файл, используя обычную разметку для значка сайта:

<link href="testdrive.ico" rel="shortcut icon" />

Уведомления на индикаторах событий, обновляющиеся в фоновом режиме

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

С помощью Internet Explorer 10 и Windows 8 вы можете предлагать уведомления на индикаторах событий непосредственно на плитках ваших закрепленных сайтов. Это означает, что пользователи получают обновленные данные с интересующих сайтов, не открывая их в браузере. В качестве примера закрепите демонстрационный сайт Fresh Tweets с помощью Internet Explorer 10 в Windows 8 Consumer Preview. Плитка закрепленного сайта периодически обновляется и уведомляет пользователя о появлении новых записей в Twitter.

Для отображения фоновых уведомлений требуются компоненты, предоставляемые сайтами. К ним относятся: (1) XML-код уведомления на индикаторе событий — XML-ответ, описывающий уведомление на индикаторе событий для Windows, и (2) мета-теги закрепленного сайта — разметка веб-страницы с указанием местоположения и периодичности для выполняемого Windows опроса на предмет наличия уведомлений.

XML-код уведомления на индикаторе событий

Windows обрабатывает опросы и отображение уведомлений на индикаторах событий. Windows опрашивает XML-код уведомления на индикаторе событий, описывающий визуальный элемент для плитки закрепленного сайта. Этот простой XML-ответ определен в XML-схеме индикатора событий. Например, чтобы обновить плитку, отобразив на ней число "3", вы отправляете следующий XML-код:

<?xml version="1.0" encoding="utf-8" ?>

<badge value="3"/>

Индикаторы событий могут представлять собой числа или глифы, такие как индикаторы "оповещение" и "новое сообщение". Полный список элементов, которые может отображать индикатор событий, см. в статье Выбор изображения индикатора событий на сайте MSDN.

Мета-теги закрепленного сайта

Следующий этап заключается в установлении связи между XML-кодом уведомления на индикаторе событий и веб-страницей. Чтобы определить, поддерживает ли веб-страница возможности закрепленных сайтов, такие как уведомления и списки переходов, Internet Explorer 10 использует мета-тег "application-name". Для обеспечения поддержки уведомлений на индикаторах событий включите в код разметки новый мета-тег, содержащий URL-адрес XML-кода уведомления на индикаторе событий и периодичность, с которой Windows должна его запрашивать. Internet Explorer проверяет наличие мета-тега "msApplication-badge" на странице в момент закрепления, а также при последовательных запусках сайта с плитки закрепленного сайта.

<meta name="msapplication-badge" value="frequency=360;polling-uri=http://ietestdrive2.com/PinnedSites/TweetCounter/microsoft/360" />

Параметр value состоит из двух компонентов: polling-uri (обязательный) и frequency (необязательный).

polling-uri — абсолютный универсальный код ресурса (URI), из которого Windows запрашивает простой XML-документ, определенный выше.

frequency — количество минут между обновлениями. Можно не указывать этот параметр или указать для него одно из следующих значений:

  • 30 (Windows будет опрашивать URI каждые 30 минут)
  • 60 (1 час)
  • 360 (6 часов)
  • 720 (12 часов)
  • 1440 (1 день. Это значение используется по умолчанию.)

Если параметр frequency пропущен или имеет значение, отличное от приведенных выше, обновление по умолчанию выполняется ежедневно (с периодичностью 1440 минут).

API-интерфейсы для обновления уведомлений на индикаторах событий

Вы также можете убирать или обновлять индикатор событий плитки сайта непосредственно с веб-страницы, чтобы поддерживать плитку сайта в актуальном состоянии.

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

window.external.msSiteModeClearBadge() убирает уведомление на индикаторе событий с плитки. В демонстрационном примере Fresh Tweets, когда пользователь получает уведомление и касается плитки, чтобы запустить браузер, веб-страница использует msSiteModeClearBadge(), чтобы убрать уведомление с плитки. Когда на плитке снова появляется индикатор событий, пользователь понимает, что доступен новый контент.

window.external.msSiteModeRefreshBadge() вызывает Windows, чтобы обновить индикатор событий для сайта с использованием URI опроса. Например, пользователь видит на плитке закрепленного сайта уведомление о трех непрочитанных сообщениях и щелкает плитку, чтобы вернуться на сайт. Если пользователь читает только первое сообщение, можно сделать так, чтобы индикатор событий отображал правильное количество прочитанных и непрочитанных (два) сообщений.

В Windows 8 Consumer Preview эти два API функционируют только на сайтах, работающих в локальной интрасети или в зонах надежных сайтов. Это будет исправлено в следующем предварительном выпуске. Чтобы протестировать эти API в Consumer Preview на своем сайте, добавьте соответствующий домен в список надежных сайтов, используя вкладку "Безопасность" диалогового окна "Свойства Интернета".

Уведомления на панели задач рабочего стола

Уведомления, отображаемые в виде дополнительных значков для закрепленных сайтов на панели задач рабочего стола, будут работать для Windows 8 и Internet Explorer 10 на рабочем столе. Такая форма уведомлений недоступна для закрепленного сайта на начальном экране Windows 8. Операционная система Windows 8 обрабатывает уведомления для всех плиток на начальном экране энергоэффективным способом.

Списки переходов для быстрой навигации по сайту

Многие наиболее популярные сайты, например NYTimes.com, CNN.com и Amazon.com, поддерживают такие компоненты закрепленных сайтов Internet Explorer 9, как списки переходов для перехода к конкретной задаче или определенному разделу сайта. При использовании Internet Explorer 10 списки переходов, доступные на панели навигации, обеспечивают удобный для сенсорного управления способ навигации по сайту.

Когда пользователь открывает сайт с начального экрана, кнопка закрепления показывает, что для данного сайта доступны списки переходов:

Снимок экрана, на котором показан список переходов демонстрационного сайта Fresh Tweets
Снимок экрана, на котором показан список переходов демонстрационного сайта Fresh Tweets

Такой же список переходов отображался браузером Internet Explorer 9 на панели задач Windows 7.

В список переходов своего сайта можно добавить неизменные задачи, используя разметку страницы (подробнее), или задачи могут добавляться динамически в зависимости от действий пользователя (подробнее). В Windows 8 индикаторы событий и списки переходов относятся к конкретным сайтам. Для каждого полного доменного имени может существовать один и только один набор данных опроса и данных списка переходов.

Заключение

Благодаря интеграции Internet Explorer 10 с начальным экраном Windows 8 сайты находятся в центре внимания. Веб-разработчики могут создавать соответствующие сайтам визуальные элементы для плиток закрепленных сайтов, уведомлять о появлении нового контента на сайте и предлагать списки переходов для быстрой навигации по сайту.

Мы с нетерпением ждем, когда вы добавите эти простые компоненты в свои веб-сайты, чтобы увеличить их влияние в Windows 8.

— Рахул Лалмалани (Rahul Lalmalani), руководитель программы, Internet Explorer

Skip to main content