Конфигурирование веб-приложений

Веб-приложение разработано, чтобы посмотреть и вести себя в пути, подобном исходному приложению — например, оно масштабируется для адаптации всему экрану на iOS. Можно адаптировать веб-приложение для Safari на iOS еще больше, заставив его появиться как исходное приложение, когда пользователь добавляет его к домашнему экрану. Вы делаете это при помощи настроек для iOS, проигнорированного другими платформами.

Например, можно указать, что значок для веб-приложения раньше представлял его, когда добавлено к домашнему экрану на iOS, как описано в Указании Значка Веб-страницы для веб-Клипа. Когда веб-приложение запускается от домашнего экрана, можно также минимизировать Safari в пользовательском интерфейсе iOS, как описано в Изменении Появления Строки состояния и Сокрытии Компонентов пользовательского интерфейса Safari. Это все дополнительные настройки, когда добавлено к Вашему веб-контенту проигнорированные другими платформами.

Считайте Настройки Области просмотра для Веб-приложений для того, как установить область просмотра для веб-приложений на iOS.

Указание значка веб-страницы для веб-клипа

Можно хотеть, чтобы пользователи были в состоянии добавить, что веб-приложение или веб-страница соединяются с домашним экраном. Эти ссылки, представленные значком, вызывают веб-Клипами. Выполните эти простые шаги для указания значка для представления веб-приложения или веб-страницы на iOS.

Если нет никакого значка, соответствующего рекомендуемый размер для устройства, самый маленький значок, больше, чем используется рекомендуемый размер. Если нет никаких значков, больше, чем рекомендуемый размер, самый большой значок используется.

Если никакие значки не указаны с помощью элемента ссылки, корневой каталог веб-сайта ищется значки с apple-touch-icon... префикс. Например, если надлежащий размер значков для устройства является 60 x 60, система ищет имена файлов в следующем порядке:

  1. сенсорный значок 76x76.png яблока

  2. apple-touch-icon.png

Посмотрите Размеры значков и Размеры изображения для метрик значка веб-страницы.

Указание изображения запуска

На iOS, подобном исходным приложениям, можно указать изображение запуска, выведенное на экран, в то время как запускается веб-приложение. Когда Ваше веб-приложение является оффлайновым, это особенно полезно. По умолчанию снимок экрана веб-приложения в прошлый раз, когда это было запущено, используется. Для установки другого изображения запуска добавьте элемент ссылки к веб-странице, как в:

<link rel="apple-touch-startup-image" href="/startup.png">

В вышеупомянутом примере, замене startup.png с Вашим именем файла экранной заставки. На iPhone и iPod touch, изображение должно составить 320 x 480 пикселей и в портретной ориентации.

Сокрытие компонентов пользовательского интерфейса Safari

На iOS, как часть оптимизации Вашего веб-приложения, имейте его, используют автономный режим для больше сходства на исходное приложение. При использовании этого автономного режима Safari не используется для отображения веб-контента — в частности, нет никакого текстового поля URL браузера наверху экрана или кнопочной панели внизу экрана. Только строка состояния появляется наверху экрана. Считайте Изменение Появления Строки состояния для того, как минимизировать строку состояния.

Установите apple-mobile-web-app-capable метатег к yes включать автономный режим. Например, следующий HTML выводит на экран веб-контент с помощью автономного режима.

<meta name="apple-mobile-web-app-capable" content="yes">

Можно определить, выводит ли веб-страница на экран в автономном режиме с помощью window.navigator.standalone булево свойство JavaScript только для чтения. Для больше на автономном режиме, посмотрите яблоко мобильное веб-способное приложение.

Изменение появления строки состояния

Если Ваше веб-приложение выводит на экран в автономном режиме как этот исходного приложения, можно минимизировать строку состояния, выведенную на экран наверху экрана на iOS. Сделайте настолько использующий метатег стиля строки состояния.

Этот метатег не имеет никакого эффекта, если Вы сначала не указываете автономный режим, как описано в скрывающихся Компонентах пользовательского интерфейса Safari. Тогда используйте метатег стиля строки состояния, apple-mobile-web-app-status-bar-style, изменить появление строки состояния в зависимости от Ваших потребностей приложения. Например, если Вы хотите использовать весь экран, установите стиль строки состояния в полупрозрачный черный цвет.

Например, следующий HTML выбирает цвет фона строки состояния к черному цвету:

<meta name="apple-mobile-web-app-status-bar-style" content="black">

Для больше на появлении строки состояния, посмотрите яблоко мобильный веб-стиль панели состояния приложения.

Соединение с другими исходными приложениями

Ваше веб-приложение может соединиться с другими встроенными приложениями для iOS путем создания ссылки со специальным URL. Доступная функциональность включает вызов телефонного номера, отправку SMS или iMessage и открытия видео YouTube в его исходном приложении, если это установлено. Например, для соединения с телефонным номером структурируйте элемент привязки в следующем формате:

<a href="tel:1-408-555-5555">Call me</a>

Для полного вида этих возможностей посмотрите Apple Ссылка Схемы URL.