PWA-приложения Microsoft Edge скоро будут визуально неотличимы от нативных приложений

Microsoft Edge скоро представит функцию под названием Window Controls Overlay, чтобы сделать прогрессивные веб-приложения (PWA) визуально неотличимыми от их нативных аналогов, позволяя разработчикам настраивать область заголовка своих PWA.

«Эта функция позволяет разработчикам создавать веб-приложения, которые лучше используют пространство экрана, и позволяет им проектировать свое приложение так, чтобы оно больше походило на нативное приложение. По мере того, как устройства становятся меньше для переносимости, строка заголовка занимает большую часть экрана, оставляя меньше места для взаимодействия пользователя с приложением», - заявила Аманда Бейкер из Microsoft Edge в техническом документе, просмотренном Techtsp.

Edge пытается решить одну из самых больших проблем с Progressive Web Apps: отсутствие настройки области заголовка. В отличие от нативных приложений, которые поставляются с настраиваемой строкой заголовка, в PWA есть раздел строки заголовка, зарезервированный системой. В результате PWA выглядят так, как будто они работают в отдельном окне Edge.

«Если у пользователя проблемы со зрением, и он увеличивает масштаб всего содержимого на экране, это еще более серьезная проблема», - добавила Бейкер.

Microsoft осознала, что этот старый дизайн не позволяет разработчикам Progressive Web Apps полностью использовать пространство дисплея. Что еще более важно, это мешает разработчикам PWA предоставлять своим пользователям наилучший пользовательский интерфейс. Это отсутствие контроля было одной из причин, по которой клиенты не переходят на PWA с обычных веб-страниц и нативных приложений.

«Вместо того, чтобы оставлять большую часть строки заголовка как пустое пространство и включать заголовок приложения в стандартный шрифт браузера, разработчик может заполнить эту область контентом, который он обычно размещает прямо под ней: кастомным логотипом, полем поиска или элементами управления навигацией, например», - добавила Бейкер.

Новый проект преследует три важные цели:

1. Веб-разработчики должны иметь доступ к области строки заголовка прогрессивного веб-приложения.
2. Окно приложения должно иметь параметры управления, включая базовые элементы управления, такие как свертывание, закрытие и перетаскивание окна.
3. Edge должен предлагать дизайн оконных элементов управления в соответствии с операционной системой хоста.

Все эти функции будут работать рука об руку, чтобы разработчики PWA могли предоставлять клиентам максимально приближенный к нативному пользовательский интерфейс. UX также будет включать кнопки и другие интерактивные элементы в области заголовка.

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

Поскольку и Edge, и Chrome основаны на Chromium, оба браузера будут поддерживать PWA с настраиваемой областью строки заголовка. Независимо от того, когда это произойдет, новая функция привлечет больше клиентов к PWA, поскольку они, помимо других преимуществ, могут предложить более полный пользовательский интерфейс.