Preparing for IE9

Sep
16

With the first Beta of Internet Explorer 9 now available for download it brings with it a few new meta tags and features that will help you enhance your site for IE9 users.

Whether you like or use Internet Explorer it is a browser that cannot be ignored completely by web developers. As each new release of IE arrives Microsoft do try and include as many features as they can to bring it up to speed with other browsers. One of the new features is a similar idea to Fluid on the Mac and will allow you to create new "applications" for sites by simply dragging and dropping them onto your taskbar. Just as you can specify an icon for "Touch" devices (in other words, iOS based devices) through the addition of one or two tags in your header, you can also add tags for customising this in IE9. This looks like something that should be standardised across browsers as if this feature makes it's way into Firefox, Safari, Chrome and Opera they're likely going to have their own way of doing this also meaning that most sites will then have large sections of markup just for customising the look of pinned "applications".

In Internet Explorer 9 you can customise this using the following meta tags:

<meta name="application-name" content="New Earth Online" />
<meta name="msapplication-starturl" content="[URL]" />
<meta name="msapplication-tooltip" content="[DESCRIPTION]" />
<meta name="msapplication-task" content="name=[TASK_NAME];action-uri=[URL];icon-uri=[ICON]" />

The first of these four tags is simple and describes what your "application" should be called, in this case I've chosen to call the application "New Earth Online". For the icon it will use your sites favicon which should have versions available as 16x16, 24x24 and 32x32. The second line of code will specify what URL to use when the application is started, so in this case I'd have it set to "http://www.newearthonline.co.uk" as I'd want the homepage to be the starting point. The next line is then a paragraph describing the application.

The final tag msapplication-task is one which can have multiple occurrences and are used to describe different tasks on a site. What this means in actual terms is what pages of your site you'd also like pinning to the application as quick shortcuts. So in the case of New Earth Online I might choose to include one for articles and one for reviews. So the TASK_NAME would be the name of the task, the URL would be the shortcut to the page with that content on, and the ICON would be what icon to use in the menu for that task.

As you can see these are pretty useful if you're developing specifically for IE9 users in Windows 7, but as it's not going to be available in Windows XP it's already severely limiting the audience. As I said previously it should be standardised to be something other browsers will use also. One site has even gone so far as to suggest using the menu tag.

One cool feature of IE9 is one that isn't something that's really a major issue or anything special, but I think it's a nice touch and that is the forward and back buttons of the GUI change colour depending on the predominant colour of the branding in your icon. Microsoft say this is so that it doesn't distract away from the experience of the site so that the browser can be ignored but I think whether this actually works depends on how the favicon has been designed and how well it's colours work with the rest of the site. 

your comments - Post a comment

blog comments powered by Disqus