Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Can't find favicon in web page source

Tags:

html

css

favicon

Maybe a stupid question, but for the life of me I can't find a reference to the favicon "ico" file on this website:

http://www.fitnessutah.com/

They obviously have one because it displays in the browser tab/window. I've tried Chrome developer tools, Network tab which shows all images on a page -- but no favicon there either. Where is it hiding?

like image 346
HerrimanCoder Avatar asked Aug 27 '14 17:08

HerrimanCoder


People also ask

Why is my favicon not showing up on my website?

When you add a favicon to your site, it may not show up since your browser has 'saved' your site as one without a favicon. You need to clear the cache in your browser or use a different browser.

How do I find the favicon of a source?

You can click Ctrl + U to view source and look for the favicon in the code ( <link rel="shortcut icon" ). It's usually in the top of the HTML source file, since it's inside the <head> .

Do all websites have a favicon displayed in the URL?

From Internet Explorer to Google's SERP Nowadays, favicons are displayed right above the address bar regardless of whether the website is bookmarked or not. And in the small chance that a website doesn't have a favicon, the browser will display a generic browser symbol.

Why is my favicon not showing up on Google search?

The favicon URL must be stable (don't change the URL frequently). Google won't show any favicon that it deems inappropriate, including pornography or hate symbols (for example, swastikas). If this type of imagery is discovered within a favicon, Google replaces it with a default icon.


5 Answers

It does seem to be being pulled in differently, but it is typically always in the default location - which this one is as well.

http://www.fitnessutah.com/favicon.ico

like image 149
Ryan Avatar answered Nov 14 '22 03:11

Ryan


There are two ways to specify the favicon for a website:

1) Give a link to the favicon

<link rel="icon" type="image/png" href="/somepath/favicon.png" />

2) Put it in a prefefined URL, this is relative to the server root. So in this case will be http://www.fitnessutah.com/favicon.ico

This website seems to be using the second method so you will find the favicon in that link.

like image 22
Carlos Calla Avatar answered Nov 14 '22 04:11

Carlos Calla


You do not need to add a link element with your favicon image for it to appear on your website.

Quote: A second method for specifying a favicon relies on using a predefined URI to identify the image: "/favicon", which is relative to the server root.

Source: http://www.w3.org/2005/10/howto-favicon

like image 44
Keir Simmons Avatar answered Nov 14 '22 03:11

Keir Simmons


Further to Keir's and Carlos' answers - to spell it out - most browsers are programmed to also look for a favicon here:

http://yourwebsitename.com/favicon.ico

If the favicon image is named/stored as above, there is no need to mention it in the HTML code.

Therefore, if you are looking at a website and you can't find any reference to their favicon in the HTML source, just type the website's base URL in the browser address bar followed by /favicon.ico:

http://example.com/favicon.ico

Real-life example - try to find the favicon in the source code:

http://www.fuelly.com/favicon.ico

like image 38
cssyphus Avatar answered Nov 14 '22 04:11

cssyphus


Use Chrome Dev Tools Network tab. Filter by favicon reload the page with Shift+F5 You will get the icon regardless it was loaded with link or from default location

like image 27
Hopeless Avatar answered Nov 14 '22 04:11

Hopeless