I will cover a few learning I had after I wasted a lot amount of time figuring out how to make favicon work in my application. I struggled with IE for loading my favicon while other browsers it worked well.
Few things you should keep in mind about adding favicon:
0. Image should be 16x16. The image format support by browser vary over the browser and their versions. Here is the Wiki link that can give more details.
http://en.wikipedia.org/wiki/Favicon
1. Make sure the file is a valid icon file. If you are not sure use online icon file generators.
2. Name the file exactly as "favicon.ico". Ignore the double quotes here. they are only to highlight.
3. Issues with IE8 especially:
A. IE8 will never display the icon if the file is on your hard disk. It has
to be on the internet.
B. IE8 will not show the icon if u do not have the www in your url address. So
a - http://yoursitename.com will not work.
b - http://www.yousitename.com will work.
C. IE8 downloads the favicon.ico file in the folder.
C:\Documents and Settings\user\Local Settings\Temporary Internet Files where
user = the name with which u logged in windos xp. In case of Vista/Win. 7
path could be different.
4. This method works if you simply place a valid icon file named favicon.ico in the root directory of you site. OR (follow point number 5)
5. Add these lines into the head part of your html page.
<link rel="icon" href="http://www.MyURL.com/favicon.ico" type="image/x-icon">
<link rel="address bar icon" href="http://www.MyURL.com/favicon.ico">
ideally any should work but didn't work for me so I added both.
6. I have tested the above code with firefox 3.6/4.0 Beta , IE8 and Chrome and it worked.
Thanks and Have hassle free coding.
During my struggle, I found this link to be very useful.
http://social.msdn.microsoft.com/Forums/en/iewebdevelopment/thread/a6fb09ef-aa3e-4e9e-be44-edbfad322657
http://jeffcode.blogspot.com/2007/12/why-doesnt-favicon-for-my-site-appear.html
Please do post your comments to let me know the quality of the article.
Adding a important point about Jboss. If your application is deployed in Jboss 4.0 then IE8 shows the favicon of your Jboss and not of your application.
ReplyDeleteWhat you can do to resolve it is
1. go to the location where favicon is stored in server. The location is
jboss-4.0.5.GA\server\default\deploy\jbossweb-tomcat55.sar\ROOT.war\favicon.ico
2. replace this icon with your application icon
3, restart your server and test in IE8 it should work in that.