Search code examples
htmlfaviconapple-touch-icon

Any problems with favicons in a subfolder?


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">

Solution

  • 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.