IE doesn't show .ico icons in HTML if not served as “image/x-icon”

Question

I'm showing favicons of websites in a list, as <img /> elements.

some websites serve them as:

<link rel="icon" type="image/x-icon" href="favicon.ico" />

and some serve them as:

<link rel="shortcut icon" href="favicon.ico" />

IE doesn't show the favicons images of those of don't have type="image/x-icon".
I cannot control how websites serves their favicons, so what can I do from my side?

Answer 1

I think the best thing to do is convert them to another format. If you are displaying the icons manually then you could download each, convert it with an image program, and upload it to your site.

If you're doing it automatically you'll need to look at whatever image-handling tools you get on the server-side. If you're using PHP, that'd be the GD or ImageMagick libraries. Just convert to PNG for example, and cache it on your site.

If IE doesn't display .ico files inline with a page, then it's unlikely you're gonna be able to make it display without doing some kind of processing. At the most simple level, you can just read the external images and serve them up as the right mime type, without converting them.

Answer 2

Put this in your apache config or .htaccess file:

AddType image/x-icon .ico

Answer 3

Unfortunately, doesn't seem to resolve the problem I have. IE fails to display all favicon.ico's in my list of links ( http://www.jerbils.info/wxlinks.php ) whereas all other browsers do (i.e. they display all favicon.ico's that exist). Interestingly, if I manually display a domain's favicon.ico in IE, the ones that aren't displaying in IE that do display in all other browsers appear as textual content as opposed to an image. The implication is that there is something about the files that IE doesn't like and consequently it is generating an onerror condition that is causing the default icon to be displayed.