Modal window

Not to be confused with Dialog box.

In user interface design, a modal window is a graphical control element subordinate to an application's main window.

A modal window creates a mode that disables user interaction with the main window but keeps it visible, with the modal window as a child window in front of it. Users must interact with the modal window before they can return to the parent window. This avoids interrupting the workflow on the main window. Modal windows are sometimes called heavy windows or modal dialogs because they often display a dialog box.

User interfaces typically use modal windows to command user awareness and to display emergency states, though interaction designers argue they are ineffective for that use.[1] Modal windows are prone to mode errors.[1][2][3]

On the Web, they often show images in detail, such as those implemented by Lightbox library, or are used for hover ads.[4][5]

The opposite of modal is modeless. Modeless windows don't block the main window, so the user can switch their focus between them, treating them as palette windows.

  1. ^ a b "Never Use a Warning When you Mean Undo". alistapart.com. Retrieved 2015-10-09.
  2. ^ Raskin, Jef (2000). The Humane Interface. United States: Addison Wesley. ISBN 0-201-37937-6.
  3. ^ "Nitpicker / The Humane Interface". nitpicker.pbworks.com. Rule 1a. Retrieved 2015-10-09.
  4. ^ Quince UX patterns explorer. "Modal Panel". Archived from the original on 2010-02-27. The popular Lightbox JavaScript library uses a modal panel approach for showing the images
  5. ^ Cite error: The named reference useit was invoked but never defined (see the help page).