网站个性标志Favicon的制作使用

May 15

网站个性标志Favicon的制作使用

ico图标是网站的头像，在打开网站的时候出现在IE的地址栏里，目前大多数浏览器都支持，最常用的IE6.0则显示加入本地收藏夹网站的ICO图像。绝大多数网站可以没有ICO头像，但如果做为一个一流的网站，没有ICO头像是很难令人信服的，就好象一个人穿了一身正装但却没有打领结一样冒失。

一、Favicon ICO图标制作

其实制作ICO图标很简单，主要是很少软件支持ICO格式，网上下载的可以转ICO格式的软件全是收费的，没有一个可以完全免费使用的，下面的方法可以不用花钱一样可以做成自己的ICO图标。

1、先用画图软件最好是FireWorks做一个16*16的图标，存为gif格式；
2、到这个网站转化为ico文件：http://www.chami.com/html-kit/services/
3、上传到网站的根目录下就完成了。

得到你的图标以后,把favicon.ico上传到服务器放在网站根目录下，
然后在首页文件中<head>段插入：
<link rel=”shortcut icon” href=”favicon.ico”>
<link rel=”Bookmark” href=”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代码<head></head>中加入如下代码：
<link rel=”shortcut icon” href=”favicon.ico” >
<link rel=”icon” href=”animated_favicon.gif” type=”image/gif” >

PS：附送chami网站6个在线工具
1、FavIcon from Pics //这个就是在线生成favicon.ico图标了，提交任何一个图片，它会给你生成一个ICO文件，并打包下载
2、Favicon Validator //favicon验证
3、Buddy Icon from Pics //把图片转换成ICO格式，还可制作PNG格式的背景图片
4、Image Embellisher //制作特殊效果的图片，比如立方体，Windows徽标那样的波浪
5、Online Image Splitter //切割图片
6、Cookie Tester //cookie 测试?不明有什么用

关键字词： ico