Как называются всплывающие окна на сайтах?

Со всплывающими окнами на сайтах есть одна маленькая проблема: все постоянно путают их названия и называют один тип другим.

Пришло время в этом разобраться, чтобы больше не возникала путаница.

Всего есть 3 основных типа всплывающих окон различающихся принципом работы:

1. Модальные окна (modal window)

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

Например, вот я пытаюсь закрыть страницу нашего сайта, и мне показывается модальное окно на всю ширину и высоту страницы (обычно они меньше):

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

Работает оно так: специальный скрипт по определенному действию добавляет элементы прямо вовнутрь страницы сайта, которые отображаются поверх страницы.

• Удобно для посетителя: не открываются новые окошки браузера и отображается оно моментально.
• Сложно заблокировать блокировщиками рекламы (по желанию, можно обмануть их всех).
• Многие злоупотребляют ими: показывают слишком много разных виджетов, или слишком часто, что мешает пользоваться сайтом.

Как поставить модальное окно на сайт? Вы можете сделать это бесплатно в нашем сервисе JumpOut.

2. Попап окна (pop-up)

Вы уже слышали это название много раз: так называются практически все окна. Но что же это на самом деле?

Вот как оно выглядит на самом деле, я нажимаю ссылку и открывается попап:

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

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

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

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

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

3. Диалоговые окна

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

Вот, я писал статью и вдруг решил закрыть страницу, браузер меня останавливает и запрашивает подтверждение:

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

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

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

Заключение

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

На сегодняшний день вы вполне можете называть модальные окна попапами, раз настоящие попапы почти вымерли. Кроме того, попап (pop-up) с английского переводится как “выскакивать”, что вполне подходит под суть работы модальных окон.

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