Popup
- Usage
- Showcase
A popup (also known as an overlay) is a window or dialog that appears on top of the page content. A popup can be classified according to two dimensions:
- whether the user can interact with the rest of the page, and it is called 'Modal' when the content on the page is disabled until the user explicitly interacts with the overlay or 'Nonmodal' when users can still interact with the background content (for example, by selecting links or tapping buttons) while the overlay remains visible
- whether the background is dimmed the popup is called a 'Lightbox'
Do’s
- present the content in the popup when it’s contextually relevant to the user
- if you must present critical information (e.g., important warnings to prevent or correct errors) in a popup, be sure to show only one at a time
Don’ts
- do not show a popup before the main page content loads
- do not display a popup right after the user logs in
- you should not ask for feedback before people have done anything meaningful
- do not show multiple popups one after another