Обзор Safari 27: что нового и что может сломать ваш сайт
17 сентября 2026 года команда WebKit опубликовала полный список изменений Safari 27.0 — браузера, который выходит вместе с осенними обновлениями систем Apple. По данным 9to5Mac, в релизе почти 850 исправлений против 525, анонсированных на WWDC. Для владельцев сайтов это и хорошая новость (меньше багов, новые возможности CSS), и повод проверить сайт на iPhone: часть изменений меняет поведение по умолчанию.
Главные новинки
MCP-сервер для ИИ-агентов. Safari 27 умеет работать как MCP-сервер: ИИ-агенты для программирования (Apple называет Claude Code и Codex) получают доступ к DOM, сетевым запросам, консоли и скриншотам. Включается в настройках: «Дополнения» → «Показывать функции для веб-разработчиков», затем «Разработка» → «Разрешить удалённую автоматизацию и внешних агентов». По словам Apple, сервер работает полностью локально и не делает своих сетевых запросов.
Стилизуемый select. Свойство `appearance: base-select` позволяет полностью перерисовать выпадающий список, сохранив доступность и работу формы.
Привязка прокрутки. Содержимое больше не «прыгает», когда выше видимой области подгружается блок. Это заметно улучшает чтение лент и каталогов с подгрузкой.
3D-модели. Элемент `<model>` теперь работает на iOS, iPadOS и macOS, а не только в visionOS.
CSS и HTML. Размер `stretch`, функции `alpha()` и многоцветный `color-mix()`, `light-dark()` с изображениями, селектор `:heading`, `sizes="auto"` для ленивых изображений и другое.
JavaScript. Переписанный загрузчик ES-модулей, исправляющий проблемы с top-level await, `ReadableStream.from()`, параметр `maxAge` в Cookie Store API.
Что полезно для дизайна и вёрстки
Ряд новинок позволяет убрать костыли, которые годами жили в CSS и JavaScript. `light-dark()` с изображениями упрощает тёмную тему: картинки и иконки переключаются вместе с цветами без скриптов. `sizes="auto"` для изображений с ленивой загрузкой избавляет от ручного расчёта размеров под каждую сетку. `text-wrap: balance` теперь работает вместе с обрезкой строк — заголовки карточек выглядят ровнее. А стилизуемый `select` наконец позволяет сделать фирменный выпадающий список без самописного компонента, который часто ломал доступность и работу на телефоне.
Что может сломаться
| Что | Было | Стало | Кого касается |
|---|---|---|---|
| Привязка прокрутки | Нет | Включена по умолчанию | Сайты со своей логикой прокрутки и подгрузки |
| Загрузка ES-модулей | Старый загрузчик | Новый, другой порядок инициализации | Сайты на модулях с побочными эффектами |
| Отображение option и optgroup | Встроенное | display: block по умолчанию | Нестандартно стилизованные списки |
| Кеш HTTP | Мягкое следование заголовкам | Строже соблюдает Cache-Control | Сайты с неверными заголовками кеша |
| Редирект на data: для картинок и скриптов | Работал | Заблокирован | Старые трекеры и виджеты |
| text-wrap: balance с line-clamp | Не сочетались | Работают вместе | Карточки с обрезкой заголовков |
| Старые SVG API | Были | Удалены SVGLocatable, nearestViewportElement и др. | Старые графические библиотеки |
Отдельно: изменился разбор заголовка `X-Frame-Options`, а значение по умолчанию для `position-anchor` в якорном позиционировании сменилось с `auto` на `normal`.
Отключить новую привязку прокрутки для конкретного блока можно свойством `overflow-anchor: none`.
Кого касается
- интернет-магазинов и каталогов с бесконечной прокруткой и подгрузкой;
- сайтов со сложными выпадающими списками и самописными формами;
- проектов, где фронтенд собран на ES-модулях без сборщика;
- сайтов со встроенными виджетами старых сервисов;
- страниц, которые встраиваются в iframe на чужих сайтах.
Что делать
- Обновите тестовый iPhone и Mac и пройдите ключевые сценарии: каталог, карточка, корзина, оформление заказа, формы заявок.
- Проверьте страницы с подгрузкой контента: не стала ли прокрутка вести себя иначе.
- Проверьте выпадающие списки в формах — особенно если они стилизованы.
- Посмотрите консоль Safari на ошибки загрузки модулей и заблокированных редиректов.
- Сверьте заголовки кеширования: если CSS и скрипты кешировались «случайно», после строгого соблюдения Cache-Control поведение может измениться.
- Если используете ИИ-агентов для тестирования, попробуйте MCP-сервер Safari: агент сможет сам пройти сценарий и прислать скриншоты.
Как тестировать, если под рукой нет iPhone
Не у каждой команды есть парк устройств, но проверку можно организовать без него:
- Симулятор iOS в Xcode на Mac — ближе всего к реальному Safari на iPhone, бесплатно;
- Safari на macOS с той же версией движка — для большинства ошибок вёрстки и скриптов;
- облачные фермы устройств — удалённые реальные iPhone на время теста;
- ИИ-агент через MCP-сервер Safari — на Mac агент может пройти сценарий по шагам, собрать ошибки консоли и сделать скриншоты.
Минимум, который мы советуем: один реальный iPhone с актуальной iOS у человека, отвечающего за сайт. Симулятор не покажет проблем с производительностью и поведением клавиатуры при вводе в формы.
Отдельно проверьте сайт в режиме приватного доступа и с включённой защитой от отслеживания: так он ведёт себя у части посетителей по умолчанию.
Плюсы и минусы
Плюсы: сотни исправлений, нативная стилизация select, отсутствие «прыжков» контента, удобная отладка с ИИ-агентами.
Минусы: изменения поведения по умолчанию, которые без проверки могут стать сюрпризом, и удаление старых API.
Наше мнение
Мы считаем Safari 27 полезным обновлением: многие давние проблемы iPhone-версий сайтов — от прыгающей прокрутки до неудобных select — решаются штатно. Но для многих сайтов iPhone — заметная часть аудитории (свою долю легко посмотреть в Метрике), и любая поломка там стоит заказов. Что мы советуем клиентам: после каждого крупного обновления iOS проходить чек-лист ключевых сценариев на реальном устройстве. Частые причины проблем мы разбирали в статье «Сайт не работает на iPhone в Safari».
Материалы для проверки
Если нужна реализация
Состав работ зависит от текущего проекта и подтверждённой причины. Можно обсудить диагностику или разработку подходящего решения.
Вопросы и ответы
Что нового в Safari 27?
MCP-сервер для ИИ-агентов, стилизуемые выпадающие списки, привязка прокрутки, 3D-модели на iPhone и Mac, новые возможности CSS и почти 850 исправлений.
Почему после обновления iPhone на сайте иначе работает прокрутка?
В Safari 27 по умолчанию включена привязка прокрутки. Если у сайта своя логика прокрутки, она может конфликтовать. Для отдельного блока поведение отключается свойством overflow-anchor: none.
Что такое MCP-сервер в Safari?
Это способ дать ИИ-агенту для программирования доступ к странице: DOM, сетевым запросам, консоли и скриншотам. Включается в настройках разработчика и работает локально.
Могут ли сломаться формы?
Могут измениться стили выпадающих списков: у option и optgroup теперь display: block по умолчанию. Проверьте формы, где списки стилизованы нестандартно.
Как Safari 27 влияет на кеширование сайта?
Браузер строже соблюдает директивы Cache-Control: max-age, min-fresh, no-store и public. Если заголовки настроены неверно, после обновления файлы могут чаще загружаться заново или наоборот дольше храниться.
Нужно ли что-то менять в коде сразу?
Только если тестирование выявило проблемы. Начните с проверки ключевых сценариев на устройстве с обновлённой системой.