I would like to have information about the icons which are displayed alongside the site URLs on a web browser. Is this some browser specific feature? Where do we specify the icon source, ie, is it in some tag on the web page itself ?
A favicon (/ˈfæv.ɪˌkɒn/; short for favorite icon), also known as a shortcut icon, website icon, tab icon, URL icon, or bookmark icon, is a file containing one or more small icons, associated with a particular website or web page.
A favicon is a graphic image (icon) associated with a particular Web page and/or Web site. Many recent user agents (such as graphical browsers and newsreaders) display them as a visual reminder of the Web site identity in the address bar or in tabs.
These icons are called favicons
Most web browsers support http://mysite.com/favicon.ico but the proper way to do it is to include an icon meta tag in the head profile.
<head profile="http://www.w3.org/2005/10/profile">
<link rel="icon"
type="image/png"
href="/somewhere/myicon.png" />
[…]
</head>
Source from the W3C itself.
Your best bet is to probably do both with the same icon image.
I believe you're referring to the Favicon, which allows a website to specify a 16x16 (or larger) image which is displayed in the address bar next to the URL in most modern browsers.
Some browsers just pick the file called favicon.ico which is in the root of your web folder, whereas others require it to be specified in the <head>
of the HTML using the following code,
<link rel="shortcut icon" href="favicon.ico" type="image/x-icon" />
This was originally the way it was done with IE, but that doesn't conform to standards (because of the space in the rel), so most browsers now let you do it as follows, where you can use any standard image format, not just .ico
<link rel="icon" href="favicon.png" type="image/png" />
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With