How to prevent favicon.ico requests?

回答1

I will first say that having a favicon in a Web page is a good thing (normally).

However it is not always desired and sometime developers need a way to avoid the extra payload. For example an IFRAME would request a favicon without showing it. Worst yet, in Chrome and Android an IFRAME will generate 3 requests for favicons:

"GET /favicon.ico HTTP/1.1" 404 183
"GET /apple-touch-icon-precomposed.png HTTP/1.1" 404 197
"GET /apple-touch-icon.png HTTP/1.1" 404 189

The following uses data URI and can be used to avoid fake favicon requests:

<link rel="shortcut icon" href="data:image/x-icon;," type="image/x-icon">

For references see here:

UPDATE 1:

From the comments (jpic) it looks like Firefox >= 25 doesn't like the above syntax anymore. I tested on Firefox 27 and it doesn't work while it still work on Webkit/Chrome.

So here is the new one that should cover all recent browsers. I tested Safari, Chrome and Firefox:

<link rel="icon" href="data:;base64,=">

I left out the "shortcut" name from the "rel" attribute value since that's only for older IE and versions of IE < 8 doesn't like dataURIs either. Not tested on IE8.

UPDATE 2:

If you need your document to validate against HTML5 use this instead:

<link rel="icon" href="data:;base64,iVBORw0KGgo=">

回答2

Just add the following line to the <head> section of your HTML file:

<link rel="icon" href="data:,">

Features of this solution:

100% valid HTML5
very short
does not incur any quirks from IE 8 and older
does not make the browser interpret the current HTML code as favicon (which would be the case with href="#")

Why am I seeing a 404 (Not Found) error failed to load favicon.ico when not using this?

回答1

By adding this to the header section, you will definitely remove the error in the console log:

<link rel="shortcut icon" href="">

From Chrome 2020 this is the solution :

<link rel="shortcut icon" href="#">

回答2

Google favicon generator and make an icon. Name it favicon.ico and drop it in your webroot.

See if this helps.

Also here is a tutorial on favicon: https://www.w3.org/2005/10/howto-favicon

I'm getting favicon.ico error

回答1

I have had this error for some time as well. It might be some kind of netbeans bug that has to do with netbeans connector. I can't find any mention of favicon.ico in my code or in the project settings.

I was able to fix it by putting the following line in the head section of my html file

<link rel="shortcut icon" href="#">

I am currently using this in my testing environment, but I would remove it for any production environment.

回答2

The accepted answer didn't work for me, I had to add a value to the href attribute:

<link rel="shortcut icon" href="#" />

回答3

The accepted answer didn't work for me so I've found this solution.

It may be related to the HTML version as the most voted solution there states:

If you need your document to validate against HTML5 use this instead:
<link rel="icon" href="data:;base64,iVBORw0KGgo=">

See the link for more info.