More browserconfig.xml, less HTML

browserconfig.xml was introduced in Internet Explorer 11 and lets you define advanced web application tiles. Most of its features are too advanced for web applications that do not target Windows 8 platform capabilities. However, browserconfig.xml is very useful when it comes to favicon: it defines the various tile pictures and background color.

In fact, browserconfig.xml is not necessary. Tiles can be described directly from the HTML code. But the extra XML file has a sensible advantage: unlike HTML pages, it is loaded only by Windows 8 devices. And since most visitors do not use the Windows 8 + IE11 combo, we are glad not to clutter them with useless stuff.

By default, IE11 looks for browserconfig.xml at the root of the web site. RealFaviconGenerator takes advantage of this characteristic. Since a few months, when you choose to place the favicon’s files in the root directory, the XML file is generated. Yet, as Giuseppe Caruso pointed out, the location of this file can be overridden with the help of a <meta> tag. RealFaviconGenerator now uses this markup to rely on browserconfig.xml whatever its location. That was issue 32.

The gain? A few hundred of bytes. Nothing fancy, just the kind of little improvement that makes the service better, day after day.

Published by

Philippe Bernard

I'm a web developer and the author of RealFaviconGenerator. I created this site because I felt frustrated when I tried to generate the favicon of my previous web project.

4 thoughts on “More browserconfig.xml, less HTML”

  1. Hi Philippe –

    I’ve been trying to debug my favicon, and I’ve noticed something that seems to be non-standard.

    I’m working to create a desktop icon so that I can grab the icon in the address bar, drag it to my desktop, and create a desktop shortcut that uses the icon. It’s been difficult, to say the least.

    One thing I’ve discovered, is that in my environment (Windows 7, IE 11) the desktop icon defaults to using the favicon-196×196.png icon, which is not the best one for me because it has the wide white border.

    I’ve also found that IE seems to have some ability to set the icon selection, even when I drag the same URL to create shortcuts from other browsers (Chrome 35, Firefox 29). Presumably IE has deeper links to the Windows interface.

    Have you looked into this at all?

    1. Regarding the 196×196 icon: yes, this is a know behavior. But not a desirable one. This will be fixed eventually. I suggest you to watch the RFG’s GitHub project if this issue is important to you and you want to know when it is fixed.

      I’m not sure to understand your last point. What do you mean by “ability to set the icon selection”? When I drag and drop a UR from IE to the desktop, I just get the 196×196 icon, but I think I missed something.

  2. A follow up to my previous post:

    Part of the issue appears to be the difference between a .url file and a .website file.

    When you drag the address to the desktop in Chrome or FireFox, they create a .URL file. Firefox puts in an unattractive icon that appears to be based on a small 16×16 favicon, and puts it on a large white background. Chrome sometimes just uses the generic URL icon.

    When you drag the address to the desktop in IE, it creates a .website file. It uses a nice icon that appears to be based on the large 196 favicon. It ALSO forces an update and refresh of the icons on the desktop. So if you previously put a .URL or .website icon there, when you drag the IE address it applies that fancy icon to the previously placed icons for that website.

    1. The compatibility test focuses on the appearance of the icons so I knew there were visual differences between IE, Chrome and FF. But I really didn’t know about the different file formats!

      The main issue in this area (despite of the 196×196 iOS-style icon, but this issue is know and on my side) is the unattractive icon of FF. Do you know a solution?

Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.