Dialog boxes - modal windows
Also referred to as an overlay
Summary
Example
Related patterns
Problem
A modal window is a layer on top of a page. It simplifies the user interface by providing a way for the user to access additional information without leaving current page. It is also an effective technique to catch user’s attention
You want to interrupt current process and catch the user’s full attention to something really important. (For example to notify the user about some major changes to you service since the last login, tell the user that his login has expired and provide a login form to let him login again, warn the user about doing something that is not reversible etc.)
You need to display application preferences or other options that are “independent” from other pages.
Placing them in an overlay saves the user a return trip to another page and makes it easy to get back to the original page where he came from.
It is important to show additional or related content/options in context