Over the last couple of weeks I decided to do a few quick changes to the Gamercast website to make it a little bit more swish for Internet Explorer 9, which was released in beta form yesterday. With support for border-radius and box-shadow from CSS3 it was really a no brainer to make use of them (if only it supported multi-column too).
Unlike Chrome and Firefox, Internet Explorer 9 doesn't need to use proprietary extensions to make use of these features. Which is why they're not showing up in those browsers properly, standards aren't standards when you're adding -moz and -webkit before everything.
Simple but effective.
More importantly however was implementing support for Internet Explorer 9's ability to pin websites to the Start Menu or Taskbar. Gamercast has always had a fairly high-resolution icon, so that wasn't much of a problem. You can drag any website you want to the Taskbar, but out of the box it'll behave like a standard shortcut, bar the "branding" differences that will happen to IE9, as per the screenshot above you can see the back and forward icons have taken colour from the icon, as well as having the website's icon displayed to the left fo them. This is specific to websites being launched from the Start Menu or Taskbar, and doesn't happen to websites browsed to more conventionally.
Adding support for jumplists was however pretty easy, and I'm sure with a bit more time I can do something a lot more fancy with this.
As you can see from the screenshot, the pinned website looks like a native application running on Windows 7, with a bunch of options provided in the jumplist providing quick access to subscription options, Twitter, or jumping straight into some content be they videos on YouTube, or just seeing what the latest news is.
For a basic jumplist all you need to do is place the following in the webpage's header:
<meta name="application-name" content="Name" />
<meta name="msapplication-tooltip" content="Text for tooltip" />
<meta name="msapplication-starturl" content="Default URL"/>
<meta name="msapplication-task" content="name=Example;action-uri=/path/;icon-uri=/icon.ico;"/>
For more fancy stuff such as subheadings you can use a bit of script:
<script type='text/javascript'>
function customJumplist() {
window.external.msSiteModeCreateJumplist('Example heading');
window.external.msSiteModeAddJumpListItem('Example', '/examplepath/', '/icon.ico');
window.external.msSiteModeAddJumpListItem('Example2', '/examplepath/', '/icon.ico');
}
customJumplist();</script>
If you're using IE9 head over to Gamercast and drag it into the Taskbar and check it out for yourself.