现在的位置: 首页 > 综合 > 正文

自定义IE地址栏图标

2013年12月08日 ⁄ 综合 ⁄ 共 2715字 ⁄ 字号 评论关闭

至少有以下两种方法可以自定义IE地址栏图标。

方法一:
   直接在站点根目录下放入名为:favicon.ico 的图标文件就行了(必须要为 ICO 文件,BMP
及其他格式的图片文件不行)。并且我已经测试过如用这种方法的话,其实在站点根目录放入的 ICO 文件不一定必须命名为:favicon.ico,将
favicon.ico 中的 favicon 命名为你网站域名的名称同样可行,例如你网站的域名为:blueidea.com,你可以将该 ICO
文件命名为:blueidea.ico (注意 ICO
文件的文件名只能是域名的名称:blueidea,而不是域名:blueidea.com,即不要将域名中的 .com 后缀也加进去);

实际上并不需要两个同时使用,有了 blueidea.ico 就可以不用 favicon.ico,有其中一个即可,这一点我已经在我的网站上测试过了。

方法二:
   在网页的 <head>...</head> 区加入代码:<link
rel="Shortcut Icon" href="favicon.ico" />,如果用这一种方法的话,其中 ICO
文件的文件名就不一定要用 favicon.ico
了,可以用任意的名字来命名,如:qwwqqwwq.ico,你甚至可以使每一个目录下的每一个网页文件的IE地址栏图标都不同,但前提是必须做到图标文
件的链接地址要正确。另外,在 <head>...</head> 区加入代码:<link
rel="Bookmark" href="favicon.ico" />,就可以在收藏夹中你网页链接前显示出你自定义的图标。

 

 

 

 

---------------------------------------------------------------------------

 

 

在线制作网站地址栏图标方法和地址:经常在别人的博客上看到地址栏里的漂亮个人图标,尤其是悠远的驼铃的图标很不错,就去
向他请教了下,想不到热心的大大特意从google里查找了详细的方法给我,在这里先向驼铃大大表示感谢,驼铃大大的网站里的文章都是很有特色的,适合在
杂志上发表,欢迎大家去看看。

说了半天,先把驼铃说的制作图标的方法记下来,由于制作地址栏图标需要特定的软件,再提供一些我找到的可以在线制作图标的地址,方便和我一样的朋友查找使用。

第一步,准备一个图标制作软件。
  首先您必须了解所谓的图标(Icon)是一种特殊的图形文件格式,它是以 .ico
作为扩展名。普通的图像设计软件无法使用这种格式,所以您需要到一个软件下载站点去下载一个图标制作软件。您也可以访问
http://www.favicon.com/ ,这里提供一个免费的在线“收藏夹”图标生成器,如果您 E
文够好的话,在这里您还可以了解到更多的关于“收藏夹”图标的知识。
  第二步,确定“收藏夹”图标的规格。
  “收藏夹”图标有着它特有的规格:图标的大小为 16 * 16(以像素为单位);所使用的颜色不得超过 16 色。 (为了清晰)

  第三步,设计一个属于您自己的图标。
  您可以将您的网站的 LOGO 做成一个缩图或者另外设计一个别具特色的图案来作为“收藏夹”图标。总之,它一定要是属于您自己的,并且能很好的代表您的网站的风格和个性。然后将这个图标文件命名为:f avicon.ico。

  最后,将这个图标文件(favicon.ico)上传到您的网站所在的服务器的根目录下。您不需要对您的网页文件作任何的修改,IE5
会自动的不停的搜索您的网站的根目录,只要它一发现了 favicon.ico 这个文件,就会将该图标显示在访问者的地址栏和收藏夹列表中了。

  如果您希望为不同的页面设置不同的“收藏夹”图标,那么您就需要在该网页文件的 HEAD 部分加入下面的内容:

  注意:该图标的路径一定要使用绝对路径。

  还有一点需要说明的是:有些 Web 站点的主机服务器(如:Geocities )不支持图标文件格式,这时您就需要与管理员联系,要求他开通图标文件格式的支持。

悠远的驼铃原文地址:http://www.tolin.cn/post/folde-bike.html

在线制作图标地址:

地址1:http://www.chami.com/html-kit/services/favicon/
地址1:http://www.chami.com/html-kit/services/
有6个在线工具,打开速度可以,生成速度有点慢。
FavIcon from Pics //这个就是在线生成favicon.ico图标了,提交任何一个图片,它会给你生成一个ICO文件,并打包下载
Favicon Validator //favicon验证
Buddy Icon from Pics //把图片转换成ICO格式,还可制作PNG格式的背景图片
Image Embellisher //制作特殊效果的图片,比如立方体,Windows徽标那样的波浪
Online Image Splitter //切割图片
收藏夹图标生成器2:http://www.html-kit.com/e/favicon.cgi
打开速度稍慢点,生成速度可以。Source Image是提交图片,Scrolling Text (optional)
是提交文字,你可以直接提交一个做好的图片,不用填文字,点下面的按钮就可以生成ico的图标,还有可以看到预览,点旁边的download下载下来就可
以了。

附录:blog标签图片80×15 或 80×31在线制作,也不错的。

http://button.blogflux.com/

 

 

 

 

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

1:先用画图软件最好是FireWorks或Photoshop做一个16*16的图标,存为gif格式;
2:到这个网站转化为ico文件:http://www.chami.com/html-kit/services/favicon


3:上传到网站的根目录下就完成了。

现在把你的网站加入收藏夹再重新打开看看,就是这样简单!

如果没有显示,可以在网页的head里加入下面的代码:
<link rel="shortcut icon" href="favicon.ico">

技巧:制作16X16的图片千万不要先做大图再改变分辨率,这样做不出清晰的图标的,就当是用16乘16的=256个小方块拼一个图标出来,在
Photoshop里也可以实现.我见过有在16X16的格里拼出一个熊猫的,还是全身的.这就要高度概括的能力了。

抱歉!评论已关闭.