[html] I'm getting favicon.ico error

I downloaded the Netbeans IDE to code in HTML. I'm new to it. When I run my code, chrome is opening and everything is working just fine. I'm getting some sort of error in the Output - Browser Log.

Failed to load resource: net::ERR_EMPTY_RESPONSE (20:00:55:963 | error, network)
at http://localhost:8383/favicon.ico

How do I fix it?

This question is related to html netbeans

The answer is


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.


This problem occurs when you do not declare at the top of your HTML file in HEDER this tag.

<link rel="icon" href="your_address_icon" type="image/x-icon">

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

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

For me the answer didn't work too, but this work fine:

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

favicon.ico is the icon of a website on the title bar of your website. Netbeans couldnt find the favicon.ico file in your website folder

if you dont want it, you can remove the line that is similar to this in your head section

 <link rel="shortcut icon" href="favicon.ico">

or if you want to use an icon for the title bar, you can use icon convertor to generate a .ico image and keep it in your website folder and use the above line in the head section


It's a nightmare since each browser/device handles it differently.

Favicon generator helps me a lot for those applications where we need to cover the most possible scenarios.

https://realfavicongenerator.net/

You just need a png image 260px x 260px (at least) and from there the generator will create all references you need within your web page.

You just need to add this references and images to your application.

enter image description here


In Angular earlier we had .angular-cli.json file which referred to favicon.ico. If you'll upgrade into one of the newer versions of Angular then you'll have angular.json instead. For these newer versions, you have to refer the favicon path in your index.html from now onwards.


add this code in your page index

<link rel="icon" 
      type="image/png" 
      href="http://example.com/myicon.png">

You can provide your own image and reference it in the head, for example:

<link rel="shortcut icon" href="images/favicon.ico">

I copied the favicon.ico to assets folder its worked for me .


I had a weird situation. Mine was working fine and all of sudden stopped with that error message. I already had the header declaration. So I was dumb founded as to why it wasn't working.

<link rel="shortcut icon" href="favicon.png">

Literally nothing else on the site had an issue that I could tell. The only thing that fixed it for me was to restart my Apache service and all was good again.

if nothing else is working, give that a shot and see what happens.


Also, be careful so your href location isn't faulty. Study case:

My index page was in a temporary sub-folder named LAYOUTS. To reach the favicon.png from inside the IMAGES folder, which was a sibling of the LAYOUTS folder, I had to put a path in my href like this

href="../images/favicon-32x32.png"

Double periods are necessary for folder navigation "upwards", then the forward slash + images string gets you into the images folder (performing a tree branch "jump") and finally you get to reference your file by writing favicon-32x32.png.

This explanation is useful for those that start out from scratch and it would have been useful to have seen it a couple of times since I would forget that I had certain *.php files outside the LAYOUTS folder which needed different tree hrefs on my links, from the HEAD section of each page.

Reference the path to your favicon image accordingly.


The answers above didn't work for me. I found a very good article for Favicon, explaining:

  • what is a Favicon;
  • why does Favicon.ico show up as a 404 in the log files;
  • why should You use a Favicon;
  • how to make a Favicon using FavIcon from Pics or other Favicon creator;
  • how to get Your Favicon to show.

So I created Favicon using FavIcon from Pics. Put it in folder (named favicon) and add this code in <head> tag:

<link rel="shortcut icon" href="favicon/favicon.ico">
<link rel="icon" type="image/gif" href="favicon/animated_favicon1.gif">

Now there is no error and I see my Favicon:

enter image description here


I was getting the same fav icon error - 404 (Not Found). I used the following element in the <head> element of my index.html file and it fixed the error:

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

Try this add "icon" with your stylesheet Maybe it solve your error "favicon.ico:1 not found "

OR First Try to understand about favicon.enter image description here SET your favicon icon file in your folder. You can generate your favicon using "https://favicon.io/favicon-generator/".