Aplies to Windows 7 and ie 9 or higher!
I struggled with this favicon problem for days - it showed in all the browsers but not in ie9!
I suspected the file format; speifically its definition-header which defines the structure for the favicon.ico, as it was the only thing left to examine having followed several tutorials and methods to the letter without success!
It seems I was right – windows 7 + ie9 expect the icon to be constructed as 4 icons all contained within one file.
Step by step:
1)I constructed a 64x64 pixel 24 bit color graphic and saved it as a png file
2)I imported this file into a freebee called X-icon Editor get it here http://www.xiconeditor.com/
3)Once I previewed the result (there will be four images 64x64, 32x32, 24x24 and 16x6 (all in pixels) and was happy with the result:
4)I exported the result and noted the tips before doing the export…
5)I then used the save as facility and directed the file to the root of my site files (where the index.html file is located) The file I saved was favicon.ico
6)If you wish to view the files go to the site directory on your hard drive and double click on the favicon.ico file and Windows Photo Viewer will show you 4 pages each representing the icon size.
7)Edit your code under as follows (the detail is found in tips step 4): under the head tag insert this tag: link rel="shortcut icon" href="favicon.ico"/
8)Upload the changes to your server.
9)Clear the ie9 cache files
10)Wait about 20 minute (may take longer)
11)Log onto your site and you should see the favicon
So what are the other icons all embedded into a single favicon.ico file?
64x64 are the large icons used by windows (if you create a shortcut on your desktop which has large icons the favicon will show your graphic in 64x64pixels),
32x32 same as above but for a desktop set for medium desktop icons
24x24 same as above but for a desktop set for small desktop icons
16x16 is the favicon used on your web page. Its also the icon used in the pinto area at the bottom bar of the desktop (taskbar)– move the shortcut from the desktop to the task bar and you’ll see it resize
All done – it works – be patient for it to appear!
PS (advanced users) you can have more than one "Favicon" file but you'll need to rename all of them
then under the head tag point to each of the icon files for the various pages - but you're only allowed one (or none for multiple files) favicon.ico files.... gets a bit hairy if you are a novice but go for it
