Что лучше – модальное окно или страница?

Допустим, вы работаете над процессом создания формы регистрации юзабилити, и после заполнения первой части формы пользователю нужно ввести определенные данные для продолжения или завершения регистрации. Эти сведения необходимо вводить на основании поиска в отдельном документе либо добавления в ручном режиме. И здесь, как правило, веб-разработчик стоит на перепутье – добавить отдельную страницу или внедрить модальное окно?

На чем остановить выбор?

Многочисленные исследования показывают, что готового и действующего механизма применения модальных окон сегодня попросту не существует, однако специалисты Webacomps установили некоторые правила и установки (с ними вы ознакомитесь, если дочитаете статью до конца).

Для чего вообще нужны модальные окна

Самое главное предназначение модальных окон – сосредоточить важный контент в нужном месте для поля зрения аудитории. Когда-то веб-дизайнеры начали интересоваться: «Как передать ключевой посыл ресурса, не выходя из формата просматриваемого экрана?» Это и послужило причиной возникновения модальных окон, которые в дальнейшем помогли сайтам не потерять контент.

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

Типы окон

Многие веб-разработчики не видят различий между наложением, модальным и диалоговым окнами, считая их все одним и тем же компонентом, только с разными названиями. Вот тут, мы не можем не вмешаться, сразу же хотим дать разъяснения:

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

• Немодальное окно – взаимодействие юзабилити с контекстом может происходить в фоновом режиме, путем использования кнопок и ссылок. При этом наложение сохраняет видимость.

• Диалоговое окно – форма взаимодействия между информационной системой (сайтом) и пользователем.

• Overlay – наложение, появляющееся в верхней части страницы. Оно всегда меньше нижней части страницы.

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

• Лайтбокс/экран – непостоянный визуальный эффект, применяемый к страницам. С его помощью определенная информация наложения становится более заметной, и человеку легче на ней сфокусироваться.

Схематично типы окон представлены на рисунке

Сравнительная характеристика элементов режима

Чтобы упростить задачу понимания терминов, касающихся типов окон, мы собрали все компоненты режима, представив их в виде схемы:

Что лучше – модальное окно или страница?

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

    

Выводы

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