April 26, 2011, 7:34 a.m.
posted by mage
H6 Pop-Up Windows
Some PROCESS FUNNELS (H1), CONTEXT-SENSITIVE HELP (H8), and EMBEDDED LINKS (K7) need to display information in addition to the current page, without taking visitors to another Web page. This pattern describes how pop-up windows can be used for this purpose.
You need to show the customer extra information, while maintaining context and keeping the customer's Web browser on the same page.
Sometimes customers need additional information that is not on the current Web page, but at the same time they need to stay there. For example, you want customers to remain on the main path of a PROCESS FUNNEL (H1), but you also want them to read extra information that might be useful.
As another example, you want to use EMBEDDED LINKS (K7) to let your customers see potentially useful and interesting content on other sites. At the same time, however, you want to keep your customers on the same page, to maintain coherence in the text and to keep them on your site.
One solution is to use pop-up windows to create new browser windows, letting customers see other Web pages while keeping their original browser windows on the same page. However, too many pop-up windows can be confusing and overwhelming. In this section we describe some ideas for using pop-up windows.
Use Automatic Pop-Up Windows for Showing Unrelated Information When People Enter or Exit a Web Site
There are two kinds of pop-up windows: automatic and link based. Automatic pop-ups appear simply as a result of a customer's arrival at or departure from a Web site. These kinds of pop-up windows usually contain advertisements or surveys for improving the quality of a Web site.
Many people find advertisements in automatic pop-up windows annoying, but some Web sites have found success with them. One recent innovation is the pop-under advertisement, which places an advertisement pop-up window under the customer's browser window so that customers will not see the window until they close their browsers. If you want to show pop-up advertisements, there are many factors to consider, including usability, customer satisfaction, and business revenues. We cannot say for sure whether pop-up windows are good or bad for a Web site. This is something that has to be judged on a case-by-case basis.
Figure H6.1. Use pop-up windows to keep the main browser window visible while displaying another page. Pop-up windows are useful for surveys and advertisements, and for showing extra information while maintaining a specific context. In this example, a survey window asks visitors to evaluate the usefulness and usability of the Web site.
(guir.berkeley.edu, May 18, 2002)
Use Link-Based Pop-Up Windows to Show Related Information in a New Window, While Maintaining Context
A link-based pop-up appears when customers click on a link designed to open a new window. Use link-based pop-ups with EMBEDDED LINKS (K7), EXTERNAL LINKS (K8), and PROCESS FUNNELS (H1) to display information related to the current page.
Figure H6.2 shows an example of how to use pop-up windows with EMBEDDED LINKS (K7). Clicking on the link opens a new window to the specified Web page, letting customers see and explore related information without having to leave the original Web site.
Figure H6.2. This magazine article has an embedded link to another Web site. The site opens a new Web browser window rather than going directly to that Web site, letting visitors continue reading the main article.
(www.java-pro.com, xml.apache.org, May 17, 2002)
Pop-up windows are especially useful for PROCESS FUNNELS (H1), like QUICK-FLOW CHECKOUT (F1) and SIGN-IN/NEW ACCOUNT (H2). Pop-up windows let customers see extra information, such as CONTEXT-SENSITIVE HELP (H8) or an answer to a FREQUENTLY ASKED QUESTION (H7), while keeping them in the funnel. Figure H6.3 shows how Dell uses pop-up windows to show extra details about a laptop computer, while not leading customers off the Web page where purchases are made.
Figure H6.3. Dell uses pop-up windows to show context-sensitive help in a process funnel, while maintaining context.
(www.dell.com, October 24, 2001)
Use Pop-Up Windows Sparingly
Minimize the number of automatic and link-based pop-up windows your Web site creates because they can quickly overwhelm and frustrate visitors.
Use automatic pop-ups when visitors first come to your site and when they leave. Also consider using cookies and PERSISTENT CUSTOMER SESSIONS (H5) so that people see your pop-up windows only once.
window.open ('http://designofsites.com', 'wnd')
The part labeled 'wnd' is the internal name of this window. You can make this new pop-up window go to another site with the following fragment:
<A TARGET="wnd" HREF="http://anothersite.com">link</a>
Alternatively, if the pop-up window 'wnd' does not already exist, this link will create a new pop-up window for you.
Use automatic pop-up windows for showing unrelated information when customers enter or exit your Web site. Use link-based pop-up windows to show related information in a new window, while maintaining context. Minimize the use of pop-up windows.
Consider These Other Patterns
Use link-based pop-up windows whenever you need to display information related to the current page, such as a FREQUENTLY ASKED QUESTION (H7) or CONTEXT-SENSITIVE HELP (H8), but do not want visitors to leave the current page. This is an issue in the PROCESS FUNNEL (H1), EMBEDDED LINKS (K7), and EXTERNAL LINKS (K8) patterns.