Any problems with favicons in a subfolder?

Question

Could there be any problems moving favicons and apple touch icons to a subfolder? Like:

<link rel="shortcut icon" href="/images/favicons/favicon.ico">
<link rel="apple-touch-icon" href="/images/favicons/apple-touch-icon.png">

Kalila

Are you able to download the icon with your browser? – Apiarian

Why don't you try? Are those icons critical part of your website? – Chipboard

I already know that this solution works, but I was wondering if it's a good or bad practice! :) sorry for the confusion – Kalila

This was tricky, for me here is an example - Subdir Favicon Demo – Scipio

Answer 1

Yes, some browsers start downloading /favicon.ico at the same time they start downloading HTML document. If there's no file you'll get an extra 404 in your server log and the browser will have to make an extra HTTP request when it recognizes the icon is elsewhere.

A quote from Yahoo's Best Practices for Speeding Up Your Web Site:

The favicon.ico is an image that stays in the root of your server. It's a necessary evil because even if you don't care about it the browser will still request it, so it's better not to respond with a 404 Not Found. Also since it's on the same server, cookies are sent every time it's requested. This image also interferes with the download sequence, for example in IE when you request extra components in the onload, the favicon will be downloaded before these extra components.

Rafaellle

Answer 2

The only problem could be that your relative link is not under the root domain, so that

HOST / YourPath /images/favicon.ico

can be found difficult.

If that would be the case then you would need to include a base href tag in your document and then this would be solved.

p.s. here is the parser i'm writing now to auto download favicons, find yourself in the flow: http://plugins.trac.wordpress.org/browser/wp-favicons/trunk/includes/class-http.php

Beichner