Тарифы Услуги Сим-карты

Как убрать всплывающие окна: различные способы. Блокировка всплывающих окон – экономия трафика и нервов

26.09.14 23K

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

А такая ли гадина эти ваши всплывающие окна?

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

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

  • Открывающиеся на переднем плане (pop-up ) – всплывают поверх основного;
  • Открывающиеся на заднем плане (pop-under ) – открываются за основным окном.

Последние являются самыми коварными. Они становятся активными и видными для пользователя лишь после закрытия основного. Поэтому определить их источник и вовремя блокировать не удастся.

Средства борьбы

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

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

  • Internet Explorer – стал последним из всех программных продуктов, в котором была реализована возможность блокировки всплывающей рекламы. Это было сделано лишь в 2004 году;
  • Opera – этот продукт стал первым браузером в мире со встроенной функцией блокировки всплывающих окон. Всплывающие окна в Опере можно блокировать, начиная с 2000 года;
  • Mozilla Firefox – этот браузер усовершенствовал подход к борьбе с рекламой, который был реализован в Opera . В отличие от него в Мозиле блокируются не вся всплывающая реклама, а лишь та, которая загружается при открытии основного окна.

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

Создание всплывающих окон с помощью javascript

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

  • Метод alert() – выводит на экран обычное текстовое сообщение. Чтобы скрыть диалог после прочтения, нужно нажать на кнопку «Ok » внизу окна;
  • Метод confirm() – подобен предыдущему методу. Но выводимый им диалог кроме «Ok » снабжен еще и кнопкой «Cancel ». С их помощью пользователь может принять или отказаться от условия, указанного в окне;
  • Метод prompt() – служит для вызова еще одной разновидности всплывающего окна javascript . В отличие от упомянутых выше это окно снабжено еще и текстовым полем. В него пользователь может вводить текстовые данные, которые можно присвоить значению нужной переменной.

Действие всех трех методов и вызываемые ими разновидности диалога показаны на изображении:

Но это всего лишь разновидности диалогов. Для создания настоящего всплывающего окна в javascript используется метод open() объекта window .

Вот полный синтаксис метода:

win = window. open (url, name, params) , где:

  • url – это адрес страницы, которая откроется в новом окне;
  • Name – имя созданного окна. Может быть использовано для дальнейшей обработки в формах (параметр target );
  • Params – строка параметров для нового окна. Их полный список можно узнать самостоятельно из документации по javascript.

На изображении ниже показано действие метода и приведен упрощенный скрипт всплывающего окна:

Создается функция f1 , в теле которой реализован вызов метода window. open() . Затем идет вызов этого метода с одним параметром, указывающим адрес страницы, которая откроется в созданном окне. После этого вызывается метод setTimeout() . В качестве параметров ему передается функция f1 и интервал времени, через который откроется новое окно.

Создание всплывающего окна с помощью CSS

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

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

Обзор остальных технологий

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

Также существует множество плагинов для популярных CMS . В их состав может входить целый набор окон. Дизайн и функционал каждого из них «заточен» под выполнение определенной задачи (регистрация, отправка сообщения и другое ).

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

Как сделать всплывающее окно на Jquery $(document).ready(function(){ PopUpHide(); }); function PopUpShow(){ $("#window-popup").show(); } function PopUpHide(){ $("#window-popup").hide(); } .box { width: 400px; height: 300px; background-color: #ccc; margin:0px auto; padding:10px; font-size:40px; color: #fff; } .popup { width:100%; min-height:100%; background-color: rgba(0,0,0,0.5); overflow:hidden; position:fixed; top:0px; } .popup .popup-content { margin:40px auto 0px auto; width:200px; height: 80px; padding:10px; background-color: #c5c5c5; border-radius:5px; box-shadow: 0px 0px 10px #000; } Пример всплывающего окна
Показать попап Поздравляю вы сделали всплывающее окно!!! Скрыть попап

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

PopUP-окно - это всплывающее объявление, предназначенное для привлечения веб-трафика или сбора адресов электронной почты. Такие элементы часто являются формами интернет-рекламы в WorldWideWeb. Как правило, это новые окна, открывающиеся в веб-браузере для показа рекламы. Обычно они генерируются JavaScript с помощью межсайтового скриптинга (XSS), иногда со вторичной полезной нагрузкой и использованием AdobeFlash.

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

История возникновения

Первые всплывающие объявления возникли на хостинге Tripod.com в конце 1990 годов. Этан Цукерман утверждает, что он написал код для запуска рекламы в отдельных окнах в ответ на жалобы на баннерные объявления. Впоследствии разработчик неоднократно приносил свои извинения за неудобства, которые стало причинять его изобретение.

Opera была первым крупным браузером, в который были включены инструменты для блокирования всплывающих окон. Обозреватель Mozilla позже улучшил эти разработки, начав блокировать PopUP-окно, генерируемое при загрузке страницы. В начале 2000-х годов все основные веб-браузеры, кроме Internet Explorer, позволяли пользователю почти полностью убирать нежелательные всплывающие объявления. В 2004 году Microsoft выпустила Windows XP SP2, которая добавила блокировку и в этот обозреватель.

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

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

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

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

При этом щелчок (даже случайный) по одному всплывающему окну может привести к открытию других.

Обход блокировщика всплывающих окон

Комбинация рекламного баннера и всплывающего окна - это «объявление при наведении», которое использует DHTML для отображения на экране поверх контента страницы. С помощью JavaScript объявление может быть наложено поверх веб-страницы в прозрачном слое. Это рекламное объявление может появиться почти во всех случаях, когда этого хочет автор рекламы. Такой скрипт PopUP-окна невозможно заметить заранее. Например, реклама может содержать анимацию AdobeFlash, связанную с сайтом рекламодателя. Она также может выглядеть как обычное окно. Поскольку реклама является частью веб-страницы, ее нельзя заблокировать с помощью блокировщика, но ее открытия можно избежать с помощью сторонних приложений (наподобие AdBlock и AdblockPlus) или с помощью настраиваемых таблиц стилей.

PopUNDER

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

Популярная рекламная технология

В рекламном объявлении задействованы две очень простые функции JavaScript, введенные в 1997 году с помощью браузера Netscape 2.0B3. Эта методология широко используется в Интернете. Современные веб-издатели и рекламодатели используют ее для создания окна перед контентом страницы, загрузки рекламы, а затем отправки его за экран.

Большинство современных браузеров позволяют открывать всплывающее окно PopUP только в том случае, если имеет место какое-либо взаимодействие с пользователем (например, щелчок мыши). Любые неинтерактивные вызовы (обратный вызов по таймеру, события загрузки и т. д.) приведут к блокированию нового окна. Чтобы обойти это ограничение, большинство всплывающих объявлений запускаются при помощи прослушивателя событий мыши, прикрепленного непосредственно к документу или телу документа. Это позволяет зафиксировать все случаи щелчка мыши на странице, которые не были использованы другими обработчиками событий. Например, когда пользователь выделяет текст, щелчок мыши оказывается замечен прослушивателем, прикрепленным к документу. В результате открывается всплывающее окно с использованием вышеуказанного кода.

«Хитрый» генератор PopUP-окон

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

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

URL-перенаправление

Иногда URL-адреса перенаправляется на рекламные страницы с помощью функции Background URL redirection. Они иногда открываются в новой вкладке, а затем содержимое старой фоновой вкладки заменяется на рекламные страницы с помощью редиректа. AdblockPlus, uBlock или NoScript не могут блокировать эти всплывающие переадресации. Эту особенность все чаще используют распространители рекламы в поисках способа, как сделать PopUP-окно наиболее активным.

Как избавиться от всплывающих окон

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

  • Firefox: нажмите кнопку с названием приложения в верхнем левом углу. Наведите указатель мыши на «Справка» и выберите «О Firefox». Это откроет окно с информацией о версии обозревателя. Если ваш браузер не будут автоматически загружены и установлены.
  • Chrome: нажмите кнопку меню в правом верхнем углу. Выберите «О Chrome» в нижней части, откроется новая вкладка, и браузер проверит наличие обновлений. Если они есть, они будут установлены автоматически.
  • Internet Explorer: способ обновления зависит от используемой версии обозревателя. Для более старых вариантов вам нужно будет войти Центр обновления Windows. Для Internet Explorer 10 и 11 вы можете включить автоматические обновления, щелкнув значок Gear и выбрав About Internet Explorer.
Если обновления не помогают

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

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

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

Это явление может быть трех видов :

  • Реклама , встроенная владельцем сайта. Нередко она полезна из-за того, что совпадает с тематикой сайта либо взаимосвязана с ней.
  • Назойливая реклама и спам. Вызвано это явление тем, что компьютер заражен вредоносным вирусом.
  • Взаимодействия с пользователем . Такие окна встречаются редко, но они важны для полноценной работы с данным сайтом, например окно с капчей для авторизации; диалоговое окно с подтверждением действия или операции; увеличенное изображение.

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

Реклама в Google Chrome

Согласно стандартным настройкам браузер Google Chrome блокирует рекламу, однако эту функцию можно отключить .

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

  • Запускаем обозреватель Google Chrome;
  • В правом верхнем углу экрана, находим кнопку «Ещё» и кликаем;
  • Здесь выбираем меню «Настройки »;
  • Внизу страницы выбираем пункт «Дополнительные »;
  • Далее переходим в раздел «Конфиденциальность и безопасность », а затем «Настройки контента »;
  • Переходим в пункт «Всплывающие окна » и устанавливаем переключатель в нужное положение.
Настраиваем Яндекс браузер

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

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

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

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

Обозреватель Opera

Обозреватель Opera позволяет производить управление подобной рекламы двумя способами.

Вариант 1 . Необходимо кликнуть в левом верхнем углу на логотип Opera, что раскроет список меню. Здесь понадобится пункт “Настройки ” — “Быстрые ” — “Всплывающие окна ”.

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

Настройки в Mozilla Firefox

Firefox, по умолчанию автоматически, блокирует такую рекламу, однако этой функцией можно управлять. Для этого понадобится пройти путь “Инструменты ” — “Настройки ” — “Содержимое ” — “Блокировать всплывающие окна ”

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

Изменения в Internet Explorer

Internet Explorer является достаточно старым и именно от него многие последующие браузеры переняли рассматриваемую функцию блокировки. Управлять же этим процессом в данном браузере можно следующим образом:

  • Открываем пункт “Сервис ”, а затем “Свойства браузера ”;
  • После этого кликаем на “Конфиденциальность ”, потом на “Блокирование всплывающих окон ” и в итоге раскрываем меню “Параметры ”;
  • Здесь в разделе “Уровень блокировки ” можно выставить нужные параметры.

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

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

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

Всплывающее окно – первое знакомство

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

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

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

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

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

Всплывающие окна – технология расширения возможностей веб-приложения

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

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

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

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

Всплывающие окна: зло или благо – решать вам

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

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

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

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

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

Сказал и ушел, нарисовав себе в голове такую картину:

Валентин описал функционал, но макет отрисовывать не стал, ведь проект ведется давно и есть UI-кит, так что разработчику достаточно просто собрать все элементы. На следующий день Валентин приходит в офис и видит:

Валентин расстроен, Гоша зол, несколько часов рабочего времени потрачены впустую. То, что хотел Валентин, называется «немодальный поповер», а то, что сделал Гоша – «модальное диалоговое окно». Члены команды не поняли друг друга, так как не пользовались общепринятой терминологией.

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

Модальность

В зависимости от контекста, слово «модальность» может иметь два разных значения. Применительно к интерфейсу в целом, оно подразумевает наличие различных режимов: например, для набора заглавных букв нужно нажать Caps lock, то есть переключить/выбрать другой режим. А когда мы говорим о всплывающих окнах, модальность означает блокирование работы с интерфейсом, до тех пор пока окно не будет закрыто (обычно это выглядит как затемнение фона).

Классификация всплывающих окон

Теперь можно разобрать классификацию:

  • Alert. Используется, чтобы сообщить об ошибке, либо предупредить пользователя о последствиях действия, которое он собирается совершить. Обычно содержат внутри себя две кнопки, вроде «Сделать что-то» и «Отменить». Алерты чаще всего модальны, то есть блокируют интерфейс позади себя, пока юзер не произведет действие внутри окна. Так как они прерывают работу пользователя, алерты должны использоваться только в крайних случаях. Например, при безвозвратном удалении файла, либо для подтверждения покупки. Хороший алерт всегда имеет информативный текст, поясняющий что произошло и почему это стоит внимания пользователя. В частности, фраза «Произошла ошибка!» — пример плохого алерта, так как не сообщает никакой полезной информации, но если заменить ее на «Соединение отсутствует! Проверьте, подключен ли ваш компьютер к сети», то юзеру станет намного понятнее в чем проблема и как ее решить. Также в хорошем алерте размещают не более двух кнопок, заголовок каждой из которых глаголом описывает действие при нажатии. Например, кнопки «Да» и «Отмена» — вроде бы понятны пользователю, но если переименовать их в «Удалить» и «Отменить», станет намного лучше.

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

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

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

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

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

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

В заключение

В данной статье приведена общепринятая классификация всплывающих окон, но в некоторых гайдлайнах можно встретить как дополнения, так и некоторые расхождения: например, где-то popover и tooltip это разные вещи, а где-то – одно и тоже. Главное – придерживаться правил конкретной платформы. Например, в OS X модальное диалоговое окно всегда выезжает сверху и дает ресайзить родительское окно, а в Windows оно всегда появляется посередине и наглухо блокирует родительский интерфейс.