IE9: integrate your website in Windows 7

As you know Internet Explorer 9 is now available in beta and you can download it here:

Among the new features, you can now integrate your websites with the Windows 7 desktop. Users can pin any website to the Windows 7 Taskbar, Desktop, or Start Menu. Websites can use this experience without having to modify any of their existing content, but as a developer you can extend this and provide customized JumpLists and Notifications by adding Metadata and JavaScript code.

If you run IE9 now (on Windows 7), you can try by pinning website to your taskbar and you’ll get a nice icon with JumpList (links to web pages) like any Windows program:

Bing in taskbar 

Link to the full article on MSDN:

In this post I want to make a small intro to show you how easy it is.


Make your website “Windows 7 aware” (from IE9)

Pinning any website from IE9 (drag a tab to Windows 7 Taskbar) gives you a classic shortcut and a right-click gives you this default menu:


By adding just a couple of Metadata in your html you can improve the user experience by enabling a nice integration with Windows 7 (Find Metadata description later in this post):

<meta name="application-name" content="RunAtServer Montreal" />
<meta name="msapplication-tooltip" content="RunAtServer - Silverlight and Windows Phone Experts in Montreal" />
<meta name="msapplication-starturl" content="" />
<meta name="msapplication-window" content="width=1024;height=780" />
<meta name="msapplication-navbutton-color" content="orange" />
<meta name="msapplication-task" content="name=Presentation; action-uri=; icon-uri=/favicon.ico" />
<meta name="msapplication-task" content="name=Trainings catalog; action-uri=; icon-uri=/favicon.ico" />
<meta name="msapplication-task" content="name=Silverlight Tour cities and dates; action-uri=; icon-uri=/favicon.ico" />
<meta name="msapplication-task" content="name=Contact; action-uri=; icon-uri=/favicon.ico" />

You can try now and pin to your Taskbar and you’ll get this:

IE9 Jumplist

In this website we use ASP.NET so I added these Metadata in the MasterPage to get the same experience from any page.

I also use Resource (resx files) to localize the Metadata, so the Jumplist will be in the user’s language (on that website). Pinning again the website in french refresh the Jumplist:

IE9 Jumplist in french

Others website with a similar Windows 7 integration enabled (ironic that MSDN does not use that yet):


Metadata description

From the MSDN article:

Name Content
application-name The name of the shortcut. If missing, the document title is used instead.
msapplication-tooltip Optional text that is displayed as a tooltip when the mouse pointer hovers over the pinned site shortcut icon in the Windows Start menu or desktop.
msapplication-starturl The root URL of the application. If missing, the address of the current page is used instead. Only HTTP, HTTPS, or FTP protocols are allowed.
msapplication-navbutton-color The color of the Back and Forward buttons in the pinned site browser window. Any named color, or hex color value as defined by Cascading Style Sheets (CSS), Level 3 (CSS3) is valid. For more information, see Color Table. If this meta element is absent, the color is based on the shortcut icon.
msapplication-window The initial size of the pinned site browser window.
  • width=N (minimum 800)
  • height=N (minimum 600)
Note that user action overwrites this value. Windows preserves the user-generated window size when the user changes the size of the window and then closes the instance.


Then you can add one or more “tasks” (5 maximum) to populate the Jumplist items:

<META name="msapplication-task"
          content="name=Task 1;

Note: Links defined in tasks are not restricted to your domain.


And more…

With a bit of JavaScript you can also add categories, overlay icons, thumbnail preview with action buttons, …


I encourage you to read the MSDN article to learn more:



With IE9 Microsoft wants to integrate websites in your desktop like any Windows app. Pinned sites run in a special branded IE window with no toolbars. It is a good thing as more than just “linked documents” the web is now a collection of applications, and as web developers you know that lot’s of issues comes from… the user (and your bugs)! Browsers are evil to business apps, things like location bar, favorites, Yahoo toolbar, Gooogle toolbar, MSN toolbar, Paypal toolbar, … add distraction and are error prone. I can see a good use of pinned sites for intranet web apps, where the user will launch the app from a taskbar icon or even the start menu and almost won’t notice it is a browser window.

Might be more useful than WebSlice…


Technorati Tags:

1 Comment

  • copycat, word suits to Microsoft and Late Latif is just another title.

    If Microsoft has mastered flicking someones idea and embedd them into new os or some new websites. Better follow linux to keep windows small and compact.

Comments have been disabled for this content.