Need Clarification About Favicon

[webmaster]

I've read many different things about favicons. I have read that IE needs to have a tag that states

<link rel="shortcut icon">

However, I have read that firefox just needs

<link rel="icon">

When viewing source of web pages, I usually only see

<link rel="shortcut icon">

and when viewing the source of some sites there is no link tag. Why are there several different ways to do this and what is the difference between the two tag versions?

[jlhaslip]

http://en.wikipedia.org/wiki/Favicon

The following shows the corresponding link tags, using examples, for HTML and XHTML.HTML:	* <link rel="icon" type="image/vnd.microsoft.icon" href="http://example.com/image.ico">	* <link rel="icon" type="image/gif" href="http://example.com/image.gif">	* <link rel="icon" type="image/png" href="http://example.com/image.png">XHTML:	* <link rel="icon" type="image/vnd.microsoft.icon" href="/somepath/image.ico" />	* <link rel="icon" type="image/gif" href="/somepath/image.gif" />	* <link rel="icon" type="image/png" href="/somepath/image.png" />

The image format should be an ".ico" formatted image file and placed in the root folder of the account for IE to handle it properly.

[webmaster]

http://en.wikipedia.org/wiki/Favicon

The following shows the corresponding link tags, using examples, for HTML and XHTML.HTML:	* <link rel="icon" type="image/vnd.microsoft.icon" href="http://example.com/image.ico">	* <link rel="icon" type="image/gif" href="http://example.com/image.gif">	* <link rel="icon" type="image/png" href="http://example.com/image.png">XHTML:	* <link rel="icon" type="image/vnd.microsoft.icon" href="/somepath/image.ico" />	* <link rel="icon" type="image/gif" href="/somepath/image.gif" />	* <link rel="icon" type="image/png" href="/somepath/image.png" />

The image format should be an ".ico" formatted image file and placed in the root folder of the account for IE to handle it properly.

What I mean is I see many different ways of doing it. Why do certain sites use one type of tag and other sites use other tags, while some sites (doesn't work with mine) don't have a tag for it at all.

[jlhaslip]

did you read the Wiki page? The Browsers handle them differently.

[webmaster]

did you read the Wiki page? The Browsers handle them differently.

Yes, I did read it. It says IE requires the "shortcut icon" attribute and Firefox uses the "icon" attribute. I usually only see the "shortcut icon" attribute on sites and not the "icon" attribute. What I am asking is why sites only have one of these tags. Is Firefox compatible with both? The article does not say that. Also, some sites do not even have a tag and the icon shows up anyway. How is this? I cannot make this work on my site without the tag.

[jlhaslip]

It is allowed to use both the Firefox and the IE tags. And also place the favicon.ico file in the Root folder. (name it favicon.ico so the Browsers that do not require the tag will find it by default..)

[webmaster]

Okay, one more question. I have favicon.ico in my root directory on my site, however the browsers (both firefox and IE) do not display it without the tags. Do you know why this is?

[jlhaslip]

Remove any bookmarks and clear your cache.