Разница между модальным, всплывающим окном, всплывающим окном, лайтбоксом, окном, вкладкой и диалоговым окном

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

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

Другой пример — когда в новом окне ОС Windows появляется диалоговое окно с просьбой подтвердить действие или с предложением чего-либо. Однако это окно может легко уйти в фоновый режим, и вы этого не заметите.

Это всего лишь два примера различных типов окон и фрагментов, с которыми вы сталкиваетесь ежедневно. Есть и другие виды.

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

Оглавление

• Что такое модальные окна, всплывающие окна, всплывающие окна, лайтбоксы, окна, вкладки и диалоговые окна

• Модальное окно, всплывающее окно, всплывающее окно, лайтбокс, окно, вкладка, диалоговое окно: что использовать

• Заключительные мысли

Что такое модальные окна, всплывающие окна, всплывающие окна, лайтбоксы, окна, вкладки и диалоговые окна

Всплывающие окна

Пример всплывающего окна

Всплывающие окна — это и имя нарицательное, и имя собственное. Это также относится к определенному типу всплывающих окон и может также использоваться для окон, которые появляются перед вами из ниоткуда на экране.

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

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

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

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

Всплывающие окна уступили место модальным окнам из-за их отвлекающего характера, который расфокусирует внимание пользователя/клиентов.

Модальные

Пример модального окна

Модальные окна часто путают с всплывающими окнами, но они разные. Модальные окна открываются в одном и том же окне и поэтому становятся основным объектом внимания пользователя.

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

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

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

Это означает, что модальные окна теперь также включают контент, аналогичный всплывающим окнам, например кнопки входа и подписки с призывом к действию.

Лайтбокс/Театр

Пример лайтбокса

Слова «Лайтбокс» и «Театр» иногда идут рука об руку, так как это одно и то же.

Лайтбокс — это увеличенное изображение, по которому пользователь щелкает для подробного просмотра. Например, если вы нажмете на изображение на веб-сайте с множеством разных изображений меньшего размера, выбранный элемент увеличится в том же окне. Это лайтбокс.

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

Трещать

Пример всплывающего окна

Popover — это миниатюрное всплывающее окно, которое появляется поверх другого объекта. Например, когда вы устанавливаете Microsoft Edge в первый раз, вы можете увидеть рекомендации и учебные пособия, выделяющие определенные разделы браузера, и сообщать вам, для чего можно использовать эту кнопку/содержимое.

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

Окно

Пример полного окна

«Окно», о котором мы говорим, — это не операционная система Windows, а имя нарицательное. У каждого приложения, программы, браузера и т. д. есть окно, в котором оно открывается.

Окно — это рамка, в которой отображается любое содержимое. Например, когда вы впервые открываете браузер или проводник, появляется новое окно, в котором пользователь может взаимодействовать с содержимым внутри.

Вы можете немного лучше понять разницу между окном и вкладкой после прочтения раздела вкладок ниже.

Вкладка

Пример нескольких вкладок внутри окна

Вкладка более или менее похожа на новую страницу внутри существующего окна. Лучший способ понять концепцию вкладок — взглянуть на свой веб-браузер.

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

Вы можете переключаться между разными вкладками внутри одного и того же окна сверху, и каждая из этих вкладок может независимо обрабатывать разные URL-адреса/местоположения. Кроме того, File Explorer теперь также поддерживает вкладки, поэтому вы можете получить доступ к различным каталогам в одном окне. Кроме того, Microsoft также внедрила систему вкладок в командные строки, такие как командная строка.

Это показывает нам, что система с вкладками может быть будущим быстрой многозадачности во всех приложениях и программах.

Диалоговое окно

Пример диалогового окна

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

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

Тем не менее, диалоговое окно — это своего рода всплывающее окно, поэтому оно легко взаимосвязано, а также может быть формой «Предупреждения», требующей немедленных действий от пользователя.

Модальное окно, всплывающее окно, всплывающее окно, лайтбокс, окно, вкладка, диалоговое окно: что использовать

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

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

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

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

Заключительные мысли

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

Кроме того, мы хотели бы напомнить нашим читателям, что размытость/непрозрачность фона, в то время как всплывающее окно видно, также является огромной частью опыта. Это известно как «Бальзамик” и обычно представляет собой слой сероватого тона или просто размывает содержимое за ним.

Бальзамическая накладка

Похожие сообщения: