Introduction to Pinned Sites
[This documentation is preliminary and is subject to change.]
Users of Windows Internet Explorer 9 can pin any website to the Windows 7 taskbar just as they pin applications. When a website is pinned, it can be opened quickly and conveniently. A Pinned site is more than just a shortcut, however. With very little effort, developers can access features of the Windows 7 taskbar from their websites—features that can greatly improve a user's ability to navigate, control, and interact with the sites they visit.
This introduction describes the features of the Windows 7 taskbar that Pinned sites can implement, shows you how a Pinned site window differs from a normal instance of Internet Explorer 9, and explains why, as a site developer, you might add Pinned site features to the websites that you create.
What is a Pinned Site?
In Windows 7, the taskbar shows both actively running applications and shortcuts to applications that you use frequently. By pinning an application to the taskbar, you can quickly find and launch the applications you care about most. Using Internet Explorer 9, you can also pin websites to the taskbar, which enables you to launch sites the same way you launch other applications in Windows. Although any website (http and https only) can be pinned, only those sites that use the features of the taskbar are likely to remain pinned there for very long.
Benefits of Pinned sites
Websites that implement the Pinned site API can feel more like a native Windows application. Site developers can build a more compelling website that have higher engagement by:
- Declaring a static list of tasks for fast navigation to common destinations within a site.
- Creating a dynamic list of destinations that are personalized and relevant to the user.
- Drawing the user back to the website by flashing the taskbar button or displaying a icon overlay.
- Adding remote controls and commands to the taskbar's preview window.
- Making the browser look and feel like your site by changing the color of the Back and Forward buttons.
- Promoting a high-resolution site icon that extends your site's brand outside the browser.
Note Pinned site functionality is available in all document modes of Internet Explorer 9. You can add Pinned site features without converting your site to support the latest version of HTML or CSS.
Windows 7 Taskbar Basics
The following graphic shows the taskbar elements in Windows 7.
| Feature | Description |
|---|---|
| Taskbar button | When you click a Pinned site button on the taskbar, the website launches in a new browser window that has been customized specifically for the site. The site icon is visible on the taskbar button. |
| Overlay icons | A 16x16 pixel notification icon that appears on top of the normal site icon. This notification indicates that something has changed in the website, such as new mail arriving, receiving a chat request, or being outbid in an auction. The notification is visible only when the site is running. |
| Jump List | The Jump List can contain static and dynamic tasks that act as shortcuts into the Pinned site. A user can further customize their experience by pinning these items to the Jump List. |
| Jump List category | A Pinned site can create and fill a single custom Jump List category by using script in the webpage. This list is dynamic. |
| Jump List tasks | In addition to the Jump List category, a Pinned site can predefine a list of tasks in metadata. This list is static. |
| Thumbnail Toolbar | A Pinned site can create up to seven buttons that appear on the taskbar thumbnail window. These buttons can be visible or hidden, active or inactive, or toggle between different button states. |
At the very least, Pinned sites should define a list of tasks for the most frequently used features of the website. Beyond that, site developers can create a custom Jump List category for additional tasks and user-specific destinations. More advanced sites can provide icon overlays to notify you about the status of a website, such as the number of new messages in your Inbox. Finally, some sites might also benefit from remote controls on the Thumbnail Toolbar.
The Pinned site API
You implement Pinned site functionality by using the following two programming models:
- Static site properties. The first group defines properties that apply to anyone who uses the Pinned site. This basic functionality is defined by meta elements.
- Application name
- Desktop tooltips
- Site start URL
- Window size
- Back and Forward button colors
- Static Jump List tasks
- User-specific and dynamic customization. The second group includes features that are implemented with JavaScript, using the Pinned site APIs.
The scenarios in the topics that follow explain how to add Pinned site features to your webpage. For an full index of development tasks, see How to Use this Documentation.
Related topics
- Pinned Sites: Windows 7 Desktop Integration with Internet Explorer 9
- PDC'10 Session: Taking Advantage of Pinned Sites with Internet Explorer 9 and Windows 7
- How to Build a Pinned Site in Less than a Day
Build date: 2/15/2012
===
[jsudds] Looking for code? Check out the How-to topics for links to complete samples and walkthroughs. I hope you find lots to cut and paste!
You should especially check out the following topics:
- How to Create a Basic Pinned Site -- Declaring Pinned Site Metadata
- How to Create a Dynamic Jump List -- Adding Items to a Jump List
- 4/13/2011
- RavenRIP
- 1/8/2012
- Rangsan555
===
[jsudds] Looking for code? Check out the How-to topics for links to complete samples and walkthroughs. I hope you find lots to cut and paste!
You should especially check out the following topics:
How to Create a Basic Pinned Site -- Declaring Pinned Site Metadata
How to Create a Dynamic Jump List -- Adding Items to a Jump List
Enter comment here.
- 11/30/2011
- Truste2007
- 5/30/2011
- Juan de la Vashon
