我的博客 我的地盘
什么是favicon?
  所谓favicon,即Favorites Icon的缩写,顾名思义,便是其可以让浏览器的收藏夹中除显示相应的标题外,还以图标的方式区别不同的网站。当然,这不仅仅是Favicon的全部,根据浏览器的不同,Favicon显示也有所区别:在大多数主流浏览器如FireFox和Internet Explorer (5.5及以上版本)中,favicon不仅在收藏夹中显示,还会同时出现在地址栏上,这时用户可以拖曳favicon到桌面以建立到网站的快捷方式;除此之外,标签式浏览器甚至还有不少扩展的功能,如FireFox甚至支持动画格式的favicon等。
  从特定的技术角度看,favicon也并不只是仅仅让网站给人更专业的观感,也可以在一定程度上减轻服务器的流量带宽占用:一般为了提高网站的可用性,我们都会为自己的网站创建一个自定义的404错误文件,在这种情况下,如果网站没有相应的favicon.ico文件,每当有用户收藏网站/网页时, Web服务器都会调用这个自定义的404文件,并在网站的错误日志中记录。这显然是应该予以避免的。

在网页中使用Favicon.ico
  浏览器调用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”>


Firefox还支持GIF动画格式的Favicon,使用方法如下:
首先制作一个16*16的gif动画,然后在html代码中加入如下代码:
<link rel="shortcut icon" href="favicon.ico" >
<link rel="icon" href="animated_favicon.gif" type="image/gif" >


Favicon.ico的制作
   这有一个在线生成Favicon图标的网站 http://www.chami.com/html-kit/services/favicon/ 选择好图片素材后 然后点generate,稍等片刻之后你就拥有了自己的网站个性标志,动静态的图标都有,可以预览。下载下来把相应图标上传到你的网站根目录就行了。
   对于boblog,在参数设置 -> 区域额外代码加上上面的代码就行了。不过需要注意的是动态格式只能在FF下才有效果,IE下是看不见的哦。动态效果可在Firefox下浏览本站看到

参考:
网站个性标志Favicon的使用  http://tech.163.com/07/0119/17/357E7Q8A0009158Q.html
通过web生成自己网站的Favicon  http://blog.macrolong.com/read.php/209.htm

版权所有。转载时必须以链接形式注明 作者和原始出处及本声明!
如果你有其他要求,可用这个邮箱联系我:
0 Comment(s)
发表评论
  昵称 [注册]
  密码 (游客无需密码)