What is favicon.ico?

(I) the definition of

⑴ called favicon, namely Favorites Icon acronym, as the name implies, it is possible to let the browser favorites, in addition to display the appropriate title, but also as an icon of the difference between the different sites.

⑵ Depending on the browser, Favicon display is also somewhat different: most major browsers FireFox and Internet Explorer (5.5 and above) as in, favicon shows not only the favorites, will also appear in the address bar, it users can drag the favicon to the desktop to create shortcuts to websites; in addition, tabbed browser even many extended features, such as FireFox even supports animated favicon format and so on.

 

(Ii) Application

⑴ Chinese name is the site avatar. In our construction site, as the site to build a personalized fit the theme of the site's logo is required.

⑵favicon.ico icon is the site of an abbreviated indicator can be displayed in a browser tab, the address bar on the left and favorites, the site is to show the personality of the abbreviated logo mark, it can be said that the site avatar, if you want a more professional look website , more beautiful, more personal, favicon.ico is essential.

⑶favicon is not just simply getting the site gives a more professional look and feel, can also reduce traffic bandwidth server to a certain extent, in order to improve the general usability of the site, will create a custom 404 error file for their website, at in this case, if the site is not appropriate favicon.ico file, every time a user's favorite websites / pages, Web server will call this custom 404 documents and recorded in the error log website. This obviously should be avoided.

 

(Iii) Production

Commonly used Favicon.ico There are three icons 16 × 16,32 × 32,48 × 48.

the first method:

1) Make a 16 × 16 pixels favicon.ico picture, upload it to the web root directory.

2) put this code in the page head area on the line.

Note: In this way, icothe name of the file must be called:favicon.

 

The second method: Online Production

1) First prepared to handle logo image format can be jpg or PNG format.

     Use PS, the new layer 100px * 100px, logo into picture

Note: This image size no special requirements, but limited to a maximum size of 500k.

 

2) Considering the ico icon is square, and the actual display size is very small, so if the logo is too large, it is recommended to select inside the most recognizable part of ico icon.

    logo best just filling an entire layer.

 

3) saved as .jpg .jpeg .gif .png image formats such as can be, but is generally recommended saved as .jpg, .png, better operation.

 

4) In the Web Search "ico" or "bit bug", you will be able to find the page tool.

    Upload files, usually the default size, fill out the verification code, you can generate!

     Download it to your computer.

    Can also be made on this website: (1)  http://www.faviconico.org/

                                              (2)http://www.atool9.com/ico.php

 

5) .ico icon to complete!

Find the original favicon.ico file in the website background, will be replaced by a new bitbug_favicon.ico favicon.ico, can be replaced.

 

注:faviconThe format is not necessarily the icoformat, it can be png, jpgeven gif, but icothe format is supported by all browsers.

 

(Iv) use

1) how to view a site's favicon.ico it?
    Enter /favicon.ico after the company's Web site;

 

2) introduced in html favicon.ico
the html favicon.ico placed in the same directory, and then introduced:

<link rel="shortcut icon" href="favicon.ico" type="image/x-icon" />

放在title后面,head里面。

 

㈤网页上调用

浏览器调用favicon的原理是首先在网页所在目录寻找favicon.ico文件,如果没有找到就去网站的根目录寻找。所以最简单的方法就是将制作好的favicon文件命名为favicon.ico然后上传到网站的根目录下。

如果需要将Favicon.ico放到其他目录下,或者希望让不同的网页显示不同的Favicon,就需要在网页Html文件中做设定了,在Html中的<head>部分加入如下的代码:

<link rel=”icon” href=”/dir/favicon.ico” mce_href=”/dir/favicon.ico” type=”image/x-icon”>
<link rel=”shortcut icon” href=”/dir/favicon.ico” mce_href=”/dir/favicon.ico” type=”image/x-icon”>
<link rel="icon" href="animated_favicon1.gif" type="image/gif" >

含义:在浏览器标签中显示favicon,在收藏夹中显示favicon。

 

㈥更新

favicon.ico如何更新? 

⑴如何更新favicon.ico图标,因为本地浏览器存在的缓存可能无法及时更新favicon.ico图标。 关闭所有打开的浏览器,并清空浏览器缓存。

⑵打开网站并加入收藏夹。 关闭浏览器,重新打开网站,就更新了。 若此时还未更新favicon.ico图标,请稍等一会再打开浏览尝试。

⑶如果是用360浏览器,无法更新,清除缓存的地址是C:\Documents and Settings\Administrator\Application Data\360se\data\ico;

这个位置记录你所浏览的网站的ico,删除你想更新的ico文件就好了,关掉浏览器,重新打开网站就更新了。

⑷如果使用的火狐或者chrome浏览器,则更新更加简单,使用火狐和chrome的隐私模式进行浏览即可更新缓存。

 

参考:https://baike.baidu.com/item/favicon.ico/8944811?fr=aladdin

Guess you like

Origin www.cnblogs.com/shihaiying/p/11866712.html