favicon.ico图标在线制作网站推荐

今天在测试一个主页时,发现主页加载时,cpu占用非常大,不得其解,手边一时没有工具帮助分析,是网页中哪些脚本或者元素的加载,引起了cpu负荷大,没有办法,手动分析网页的源代码。

<link rel="shortcut icon" href="http://www.linwan.info/favicon.ico"/>
<link rel="bookmark" href="http://www.linwan.info/favicon.ico"/>

(上述网址只是举例,不代表本站现象。)

在看到上述代码时,由于网站根目录并没有放置favicon.ico文件,于是担心是不是ico的加载引起了问题,所以考虑生成一个ico文件看看。

favicon.ico是Favorites Icon的缩写,其作用不但可以让浏览器的收藏夹中除显示相应的标题外,还可以以图标的方式区别不同的网站。该图标根据浏览器的不同,显示出来的内容也有所区别:在大多数主流浏览器如FireFox和Internet Explorer(IE浏览器)中,favicon.ico图标不仅在收藏夹中显示,还会同时出现在地址栏上,这时用户可以拖曳该图标到桌面以建立到网站的快捷方式;另外FireFox还支持动画格式的favicon图标。

怎么制作favicon.ico图标?以下两个站点推荐大家试下:

http://www.html-kit.com/favicon:一款很专业的favicon.ico图标制作网站。首先需要预先制作好一张图片,然后将图片上传到该站点后制作,成功后下载到本地,解压后上传,并且按照里面的说明代码添加到相应文件(一般是站点首页),大功告成!

http://www.bitbug.net:如果觉得前者的英文网站用起来不熟悉,那么可以使用这个站点的服务了。制作的过程与前者类似。

Linker经过实践测试,建议大家首先选择前者的服务,因为该站点制作出来的favicon.ico图标本身就包含了16×16和32×32两种尺寸,因此会根据实际情况有选择地表现;而后者,只能单一地选择其中一种,实际上48×48的基本上用不着。另外,后者网站制作出来的图标,明显的锯齿感和模糊,不够清晰,虽然占用体积比前者小,但不推荐。

网站文件添加favicon.ico的代码形式,除文首所举例外,可以考虑以下代码:

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

看出为什么在火狐地址栏网址前的图标为什么会动了吗?就是因为上述代码。