Включить быстрый вход: шаблоны интерфейса режима Immediate UI

Eiji Kitamura

Опубликовано: 30 сентября 2026 г. Последнее обновление: 7 октября 2026 г.

Обзор

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

В отличие от условного интерфейса, который показывает подсказки автозаполнения, когда пользователь выбирает текстовое поле, режим Immediate UI сразу вызывает диалоговое окно аутентификации браузера в ответ на нажатие кнопки или ссылки. В настоящее время uiMode принимает только "immediate", но в будущем это может измениться.

Режим "Немедленный интерфейс" обладает тремя основными характеристиками, которые делают его уникально эффективным для быстрого входа в систему:

  • Пропуск QR-кодов для нескольких устройств. Если на устройстве есть ключи доступа или сохраненные пароли, браузер сразу показывает диалоговое окно аутентификации. Если таких устройств нет, приложение сразу же закроется, не показывая экран с QR-кодом для смартфонов. Это позволяет сайту естественным образом перейти к стандартной навигации (например, к странице входа).
  • Интуитивно понятный интерфейс выбора аккаунта. Вместо того чтобы показывать разные типы учетных данных по отдельности, он скрывает различия между ключами доступа и паролями, чтобы пользователю было проще выбрать аккаунт для входа.
  • Безопасное прогрессивное улучшение. Хотя эта функция поддерживается только в браузерах Google Chrome и Chromium, обнаружение функций позволяет быстро выполнять вход для пользователей в поддерживаемых средах, не нарушая существующие процессы входа для пользователей неподдерживаемых браузеров (например, Safari или Firefox) или в режиме инкогнито.

Подробнее о том, как работает API и как реализовать обнаружение функций, можно узнать в статье Режим немедленного показа интерфейса для входа в аккаунт. В этом документе мы рассмотрим рекомендуемые шаблоны UX, которые повышают конверсию в режиме Immediate UI, а также антипаттерны дизайна, которых следует избегать.

Наиболее эффективно использовать режим Immediate UI для перехвата непосредственно перед навигацией по страницам. Если не прошедший аутентификацию пользователь (или пользователь с истекшим сроком действия сеанса) нажимает на ссылку или командную кнопку, которые обычно ведут на страницу входа, вызов режима Immediate UI в этот момент обеспечивает удобство работы, не прерывая рабочий процесс.

На большинстве сайтов ссылка "Войти" размещена в глобальном заголовке в верхней части экрана и ведет на отдельную страницу входа. Когда пользователь нажимает на эту ссылку на странице, которую он просматривает, приостановка навигации и вызов режима Immediate UI позволяют браузеру показать диалоговое окно выбора аккаунта прямо над текущей страницей, если на устройстве есть учетные данные.

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

Динамический вход при оформлении покупки (для электронной торговли)

На сайтах электронной торговли переход от корзины к оформлению заказа – один из самых распространенных моментов, когда пользователи отказываются от покупки из-за проблем с навигацией по страницам. Если включить режим Immediate UI, то при нажатии кнопки "Перейти к оформлению заказа" на экране корзины появится диалоговое окно выбора аккаунта. Аутентификация будет выполнена одним нажатием.

После успешной аутентификации покупатель сразу переходит на страницу подтверждения доставки и оплаты, минуя страницу входа в аккаунт. Это значительно сокращает количество шагов, необходимых для совершения покупки. Если учетных данных нет, покупатель переходит на обычный экран входа в аккаунт или выбора гостевого оформления заказа. Вы можете настроить сайт так, чтобы гости могли оформлять заказы без регистрации, или сделать вход обязательным. Режим "Сразу" позволяет упростить процесс оформления покупки для вернувшихся клиентов.

Встроенный вход для микродействий (лайк, закладка, сохранение)

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

Когда посетитель, не вошедший в аккаунт, нажимает кнопку действия, например "Нравится", "В закладки" или "Сохранить", диалоговое окно в режиме Immediate UI появляется прямо на месте нажатия. Это позволяет быстро подтвердить личность пользователя и сразу же зарегистрировать действие и запустить анимацию интерфейса (например, значок сердца становится красным). Позиция прокрутки не смещается ни на один пиксель, поэтому просмотр не прерывается. Если учетных данных нет, вместо того чтобы сразу переходить на другую страницу, вы можете показать легкое встроенное модальное окно входа поверх текущего экрана или перенаправить пользователя на страницу входа таким образом, чтобы после входа он вернулся на исходную страницу.

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

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

Когда читатель прокручивает статью до платного доступа и нажимает кнопку "Продолжить чтение с аккаунтом", в режиме Immediate UI диалоговое окно аутентификации появляется прямо над тем местом, где читатель остановился. После завершения аутентификации размытие статьи плавно исчезает без перезагрузки страницы, позволяя читателю продолжить чтение с того места, на котором он остановился. Если учетных данных нет, разверните встроенную форму регистрации или входа в разделе с платным доступом.

Антипаттерны

Режим Immediate UI очень полезен, если использовать его до перехода на другую страницу, но если разместить его в неправильном месте или применить к неподдерживаемым процессам, это может ухудшить качество входа в аккаунт.

Не используйте режим Immediate UI для кнопок входа на отдельных страницах входа

Поскольку в режиме Immediate UI и ключи доступа, и пароли обрабатываются в одном удобном диалоговом окне, может возникнуть желание использовать его для кнопки "Войти" на отдельной странице входа. Однако в этом случае его лучше не использовать. Во-первых, режим Immediate UI требует активации пользователем (например, нажатия или клика), поэтому его неудобно использовать на странице входа, где пользователи ожидают, что варианты входа будут доступны сразу после загрузки страницы. Во-вторых, страница входа – это конечный пункт, куда попадают пользователи, у которых нет локальных учетных данных на устройстве или которые хотят войти с помощью ключа доступа на мобильном устройстве (межплатформенная аутентификация) или аппаратного электронного ключа, нажав "Войти с помощью ключа доступа". Если вы используете режим "Немедленный интерфейс", браузер подавляет резервные варианты с QR-кодом и электронным ключом для нескольких устройств и немедленно завершает работу, как только обнаруживает, что на устройстве нет локальных учетных данных. В результате пользователь оказывается в тупике: нажатие кнопки ни к чему не приводит, а на странице нет других вариантов.

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

Не используйте режим Immediate UI для дополнительной аутентификации

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

Однако не используйте режим Immediate UI для повторной аутентификации. Режим немедленного показа интерфейса предназначен исключительно для процессов входа без аутентификации, когда личность пользователя ещё не известна. Если проверяющая сторона сможет запросить определенный список идентификаторов учетных данных в режиме Immediate UI и узнать, существуют ли эти учетные данные, она сможет определить, взаимодействовал ли пользователь с сайтом ранее, и отслеживать его действия в разных сеансах. Чтобы предотвратить отслеживание между сеансами, браузеры сразу отклоняют любой запрос режима Immediate UI, который содержит непустой список allowCredentials, и выдают ошибку NotAllowedError. Если не указать allowCredentials при повторной аутентификации, это тоже может привести к проблемам, поскольку браузер предложит пользователю все учетные данные, сохраненные на устройстве для вашего сайта, и он может случайно выбрать не тот аккаунт, в который вошел в данный момент.

Для повторной аутентификации, когда личность пользователя уже известна, используйте стандартный модальный запрос WebAuthn (navigator.credentials.get() без uiMode: 'immediate') с полем allowCredentials, заполненным зарегистрированными учетными данными пользователя, или перенаправьте пользователя на стандартный экран повторной аутентификации.

Заключение

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

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

Чтобы узнать больше о реализации ключей доступа и новейших функциях Web Identity, ознакомьтесь со следующими ресурсами: