Click here to Skip to main content
15,031,687 members
Articles / Web Development
Tip/Trick
Posted 13 May 2015

Tagged as

Stats

6.6K views
3 bookmarked

Pinned Sites using Internet Explorer

Rate me:
Please Sign up or sign in to vote.
5.00/5 (2 votes)
13 May 2015CPOL2 min read
Pinned Sites using Internet Explorer

Most of the information and text is from MSDN. The purpose here is to summarize the pinned sites.

Overview

Users of Windows Internet Explorer 9 and Internet Explorer 10 can pin any website to the Windows 7 taskbar or Windows 8 Start screen 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 or Windows 8 Start screen from their websites—features that can greatly improve a user’s ability to navigate, control, and interact with the sites they visit.

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.

The following graphic shows the taskbar elements in Windows 7.

How to Build a Pinned Site

Its a matter of meta tags in the head element of the HTML page, here’s a MSDN Blog that shows all of the meta tags for pinned sites. For a dynamic jump lists (elements in the list), you can add them using a small JavaScript that injects the meta tags to the header after the page loads; example. RSS feeds.

Generate Meta Tags

There are two meta tags generators:

  • First to generate for Windows 7 taskbar
  • Second for Windows 8 live tiles

Ghaleb’s Blog Sample

Ghaleb’s blog supports pinned sites, that redirects you to the social media, and has a jump list for the recent blog posts :) .

Ghaleb's Blog pinned list on taskbar.

Ghaleb’s Blog pinned list on taskbar.

References

Here is the list of the references for pinned sites:

License

This article, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

Share

About the Author

GhalebBadran
Software Developer (Senior)
United Arab Emirates United Arab Emirates
www.ghalebbadran.com

Comments and Discussions

 
-- There are no messages in this forum --