Favicon not showing up for website

July 27, 2010, 11:23 am

I’m in the process of redesigning a website which was written in php and hosted on a linux box. I’m coding it in asp.net and as you’ve guessed it, will put it on a Windows server. I tried it with the following code:

<html>
<head>
<title>Testing favicon</title>
<link rel="Shortcut Icon" href="http://localhost/favicon.ico" type="image/x-icon" />
</head>
<body>
Test
</body>
</html>

However the favicon does not show up and when I searched what was causing the problem, I found that windows treats favicon in a different way. So you have to change the favicon link to the following:

<link rel="Shortcut Icon" type="image/vnd.microsoft.icon" href="http://localhost/favicon.ico" />

So for Microsoft Windows IIS, you will need to have the type as image/vnd.microsoft.icon rather than image/x-icon. I tested this on Internet Explorer 8 and the favicon.ico appeared but that did not work for Firefox 3.5.11. I had to try a couple of things to get it to work. So here are the solutions if you’re having problems with your favicon:

  • Make sure the favicon.ico is 16px X 16px and that you have not just renamed a gif or jpg or png file to .ico
  • Delete your browsers cache and reload the page (you can delete the whole internet history if you like
  • Try to bookmark the page where you have the favicon and see if that works. Delete and bookmark again if it doesn’t work first time round.
  • Close Firefox or any browser you’re using and launch it again

What worked for me was to close Firefox and when I restarted it, the favicon displayed without any problems. This is something to do with the cache – when you open a new firefox session, firefox pulls over the new details, otherwise you’ve got stale data that it uses until you close the program.

Category: Programming

Comments are closed.