Take the 2-minute tour ×
Webmasters Stack Exchange is a question and answer site for pro webmasters. It's 100% free, no registration required.

A site I'm looking at has the following 2 links to its favicon:

<link rel="shortcut icon" type="image/ico" href="/_assets960/media/favicon.ico" />

<link rel="icon" href="/favIcon.ico"/>

Question: Is there a good reason why you would specify the icon twice in these two slightly-different ways?

share|improve this question

migrated from stackoverflow.com Jun 23 '11 at 10:38

This question came from our site for professional and enthusiast programmers.

4  
I'm not seeing the reason for the close-votes. Perhaps the phrasing isn't perfect, but it's a reasonable question: Is there a good reason why you would specify the icon twice in these two slightly-different ways? –  T.J. Crowder Jun 23 '11 at 8:57

4 Answers 4

up vote 5 down vote accepted

Like all things wonderful on the web, it looks like IE is the cause:

Shortcut isn't valid HTML, just for IE

share|improve this answer
    
    
This is NOT true! The <link rel="shortcut icon"... validates for HTML4.01, use the W3C validator to check this if you don'trust. Moreover HTML5 spec are still under development so we don't know yet if it will be included or not. This StackExchange website uses <link rel="shortcut icon"... too –  Marco Demaio Jun 23 '11 at 15:33

The line below works in all browsers:

<link rel="shortcut icon" href="http://www.your-site-domain/favicon.ico">

And it it's the only line used also by StackExchange sites (see in this page source code)

<link rel="shortcut icon" href="http://cdn.sstatic.net/webmasters/img/favicon.ico">

NOTE: the full http path of the favicon is necessary to show icon in IE, in all other browsers you don't need the full http path.

share|improve this answer

Really both lines are unneeded. You just need to put a favicon.ico file in your root directory and you should be fine. You can include code like the above to allow for the favicon to load before the page finishes loading but that is unimportant. It looks like the code in question above was created out of confusion.

share|improve this answer
1  
Well, largely unnecessary. That's default behavior. But the link can be used to override that and indicate a specific icon. This can be used to have different pages/sections/whatever of site use different icons. It's uncommon, but a valid use case. –  Su' Jun 23 '11 at 16:18

The reason is compatibility with Internet Explorer. rel="icon" is the way it is done in HTML5 or any other browser than IE.

share|improve this answer
    
Good link. According to the link, just the first one would work. (Perhaps they explicitly want to send compatible browsers the first one, and perhaps there is no /favIcon.ico at all...) –  T.J. Crowder Jun 23 '11 at 9:16

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.