Когда я впервые увидела, как Safari 27.1 ведёт себя на внешнем дисплее iPhone Duo, первое, что бросилось в глаза, — непривычная полоса у края. Она не занята контентом, хотя визуально остаётся частью окна браузера. Выглядит это так, будто страница сознательно остановилась за несколько десятков пикселей до границы, а оставшееся пространство залито цветом фона. Сначала кажется, что это ошибка вёрстки или временный компромисс, но на деле всё продумано: именно туда iOS выносит элементы управления, чтобы освободить больше полезной площади по высоте.
Мне стало интересно разобраться, почему Apple не разрешает сайтам занимать эту область полностью. Оказалось, вопрос гораздо глубже, чем просто техническая прихоть. Внешний экран iPhone Duo шире и ниже, чем у других смартфонов компании. Если оставить панель управления внизу или сверху, страница потеряет значительную часть вертикального пространства. Поэтому систему и адаптировали так, чтобы элементы управления смещались вбок, а веб-контент получал максимум высоты. Но у такого подхода есть побочный эффект: появляется визуально пустая боковая полоса, которую хотелось бы использовать рациональнее.
Сейчас разработчики не могут просто растянуть фон или контент на всю ширину экрана без риска, что важные элементы окажутся под системными кнопками. Команда WebKit открыто обсуждает эту проблему. По их словам, Apple рассматривает несколько способов дать сайтам больше контроля над пространством у края. Один из очевидных вариантов — разрешить использовать viewport-fit="cover". Этот механизм уже знаком веб-разработчикам: он позволяет странице выходить за пределы безопасной области и занимать участки, которые обычно зарезервированы под системный интерфейс.
Однако здесь не всё так просто. Если включить такой режим, ответственность за отступы полностью ложится на разработчика. Нужно вручную следить, чтобы текст не прилипал к краю, кнопки не прятались под элементами управления, а интерактивные зоны оставались доступными. Apple проанализировала множество существующих сайтов и обнаружила, что значительная их часть некорректно задаёт отступы по всем четырём сторонам. То есть если сейчас просто включить полное покрытие, многие страницы станут неудобными или даже сломанными на iPhone Duo. Поэтому компания ищет более щадящий подход, который не потребует от веб-мастеров глобальной переработки кода.
Меня особенно зацепило, что Apple не называет сроков. Это значит, что решение пока находится на стадии исследования, а не готового продукта. Команда WebKit изучает поведение реальных сайтов, оценивает риски и пытается понять, как совместить желание дизайнеров использовать всю ширину экрана с необходимостью сохранять удобство интерфейса. Пока же Safari 27.1 заполняет боковую полосу цветом фона страницы, что выглядит аккуратно, но не даёт гибкости.
Что ещё изменилось в Safari 27.1 для iPhone Duo
Помимо вопроса с боковой полосой, обновление принесло отдельную функцию для просмотра PDF. Она рассчитана на необычный форм-фактор устройства. Если держать iPhone Duo частично сложенным, как книгу, браузер автоматически показывает две страницы документа рядом. Это выглядит естественно и действительно напоминает чтение бумажного издания. Как только телефон полностью раскрывается или закрывается, Safari возвращается к отображению одной страницы. По моим ощущениям, такая адаптация делает работу с документами на гибком экране значительно приятнее.
При этом важно понимать, что сайты и веб-приложения на iPhone Duo работают на том же движке WebKit и с теми же веб-технологиями, что и на других iPhone. То есть никакой отдельной версии браузера или особого режима совместимости нет. Это обычный Safari, который просто научился учитывать специфику складного экрана.
Для разработчиков Safari 27.1 предлагает предварительную поддержку двух интерфейсов. Оба по умолчанию отключены, но их можно активировать через экспериментальные настройки. Первый — Device Posture API. Он сообщает сайту, в каком положении находится экран: частично сложен или полностью плоский. Второй — Viewport Segments API. Он описывает отдельные области экрана по сторонам сгиба. Звучит многообещающе, но это ещё не готовый инструмент для размещения контента под боковыми элементами управления. Скорее, это первый шаг к тому, чтобы веб-платформа могла корректно работать с устройствами нового типа.
Я обратила внимание, что проверять оформление сайта можно даже без физического iPhone Duo. Xcode 27.1 или более новая версия позволяет создать симулятор устройства в Device Hub. Это удобно для тех, кто хочет заранее протестировать адаптивную вёрстку и понять, как страница будет выглядеть на нестандартном экране. Команда WebKit советует опираться именно на адаптивный дизайн, а не пытаться определить модель устройства по строке браузера. Такой подход более надёжен, потому что ширина области просмотра в Safari на iPhone Duo варьируется от 382 до 951 CSS-пикселя в зависимости от положения телефона и режима окон.
Отдельно стоит упомянуть сценарий с двумя окнами. Когда на внутреннем дисплее рядом открыты два окна, каждому достаётся область шириной 385 CSS-пикселей. Это довольно узкое пространство, и сайты должны корректно перестраиваться под него. Если вёрстка изначально не адаптивная, пользователь получит сжатый или обрезанный контент. Поэтому рекомендация WebKit не полагаться на определение устройства выглядит логично: лучше сразу проектировать интерфейс так, чтобы он работал в любом диапазоне ширин.
На мой взгляд, ситуация с боковой полосой на внешнем экране iPhone Duo — хороший пример того, как новая аппаратная форма заставляет пересматривать устоявшиеся веб-стандарты. Раньше разработчикам было достаточно учитывать вырез, скруглённые углы и нижнюю панель жестов. Теперь появляется ещё одна зона, которая может быть то системной, то доступной для контента в зависимости от настроек. И Apple, судя по всему, не хочет вводить решение, которое создаст больше проблем, чем решит.
Мне кажется, что в ближайшие месяцы мы увидим дополнительные экспериментальные флаги в Safari и, возможно, черновики новых веб-стандартов. Складные устройства постепенно перестают быть экзотикой, и браузерам придётся дать сайтам инструменты для работы с такими экранами. Но пока приходится довольствоваться тем, что есть: аккуратная полоса с цветом фона и надежда на более гибкое решение в будущем.