Necessary to add link tag for favicon.ico?

favicon, html

Solution

To choose a different location or file type (e.g. PNG or SVG) for the favicon: One reason can be that you want to have the icon in a specific location, perhaps in the images folder or something alike. For example:

<link rel="icon" href="_/img/favicon.png">

This diferent location may even be a CDN, just like SO seems to do with `<link rel="shortcut icon" href="http://cdn.sstatic.net/stackoverflow/img/favicon.ico">`.

To learn more about using other file types like PNG check out this question.

For cache busting purposes: Add a query string to the path for cache-busting purposes:

<link rel="icon" href="/favicon.ico?v=1.1"> 

Favicons are very heavily cached and this a great way to ensure a refresh.

Footnote about default location: As far as the first bit of the question: all modern browsers would detect a favicon at the default location, so that's not a reason to use a `link` for it.

Footnote about `rel="icon"`: As indicated by @Semanino's answer, using `rel="shortcut icon"` is an old technique which was required by older versions of Internet Explorer, but in most cases can be replaced by the more correct `rel="icon"` instruction. The article @Semanino based this on properly links to the appropriate spec which shows a `rel` value of `shortcut` isn't a valid option.

Problem

Are there any modern browsers that won't detect the favicon.ico automatically? Is there any reason to add the link tag for favicon.ico? ``` <link rel="shortcut icon" href="/favicon.ico"> ``` My guess is that it's only necessary to include it in the HTML document if you decide to go with GIF or PNG...

Original source

Related problems