»点此完善

网站简介-如何制作ico及让浏览器地址栏显示网站的ico图标?

本类最新播报:红楼梦中的歇后语
*截止2020年12月6日 6:13,共有4896人阅读了本文。
㊛6 囧 囨 囩木

如何制作ico及让浏览器地址栏显示网站的ico图标?

什么是网站 ICO 图标?

打开微软、谷歌、百度等网站后看到浏览器的标题栏、地址栏,多浏览器的标签上都显示了一个小图标。

浏览网站时,可以看到在站名前有网站的小图标,那这是如何添加的呢?

一、首先,你要保证在你的网站根目录有这样的图标文件:favicon.ico

其实这是一个图片文件,你可以用png  gif等图片直接修改后缀名就行,尺寸大小可以为16×16,或者32×32.。我建议尺寸选用16×16的,适应的浏览器会靠谱一些。也可以用在线生成ICO图标软件生成,百度或谷歌上搜ICO生成,会出来很多。

二、除了图标的准备,你还要保证你的网页文件里,头部内容里包括这么一条信息,它的意思就是在浏览器显示你的网站图标:

《link href="favicon.ico" mce_href="favicon.ico" rel="bookmark" type="image/x-icon" /》
《link href="favicon.ico" mce_href="favicon.ico" rel="icon" type="image/x-icon" /》
《link href="favicon.ico" mce_href="favicon.ico" rel="shortcut icon" type="image/x-icon" />

具体效果可参看看做网页(http://www.zuowangye.com

其中第一行和第三行代码的作用是在收藏夹下亦显示图标,无论是资源管理器窗口,还是浏览器的收藏夹。,

好了,现在清除你的浏览器缓存,刷新,再看看你的站点,图标是不是出来了?

很多网站站长或者网站设计人员都会遇到网站图标设计的问题,网站图标对于人们的视觉是一个直观的印象,所以在审美观念上讲,网站图标是必要的,那么在制作网站图标的过程中有什么注意事项呢?

大家在制作图标的过程中往往会遇到一个问题就是,图标大小的控制。

一般标准的网页图标是选择  16*16px的

一般软件和应用程序选择 48*48px的,当然这个也根据个人的喜好而变更。

一般一个图标文件会同时包含3种大小:

查看方式为平铺的时候是48 x 48,
查看方式为图标的时候是32 x 32,
查看方式为列表的时候是16 x 16,
当然一般的话做一个16 x 16的图标就可以了...

这里,0430站长推荐使用IcoFX或PS这个软件来制作图标.

网上有很多在线生成工具,大家只需要做一个png的图片,生成以下即可。

详细制作步骤:

  如何制作 ICO 图标?

  这里使用最简单的办法。因为 ico 格式图片比较特殊,一般软件(如 Windows 自带的画图、Adobe Photoshop 等)都制作不了,我们就分两步做。

  第一步是用 Windows 自带的画图或 Adobe Photoshop 制作一个 ico 的原图,格式可以是 jpg / jpeg / gif / png 等,大小大概在 32*32 像素差不多,最好是 16px×16px 的,因为浏览器标题栏和地址栏上显示的就是这个尺寸。

  第二步是将制作好的 ico 原图转换为 ico 格式,制作好后去一个可以在线转换 ico 格式的网站(百度一下会有不少,也可以下载一个转换软件进行处理)。这里推荐 ps,经数秒简单的处理即可转换为我们要的 ico 格式图标文件,文件被自动命名为 favicon.ico。

  这样 ico 图标就制作完成了。

  如何让 ICO 图标在网站上显示?

  先将转换好的 ico 图标文件上传到网站任意目录,一般为根目录。以我的为例,我上传到 /bbs 目录下,也就是说 ico 文件的路径是 /bbs/favicon.ico。

  然后在需要显示该图标的页面模板头部(《head》与 《/head》之间)__以下代码:

  《link rel="Shortcut Icon" href="/bbs/favicon.ico">

  如果你的模板是 XHTML 规格的,代码应该是:

  《link rel="Shortcut Icon" href="/bbs/favicon.ico" />

㊍8 园 囮 囯 社 名
特°°


请您关注:全球优秀网站的大本营

本文关键词:ico图标 ico 
上一站:  HTTP状态码:网页状态码查看知识大全
当前推荐网站:  如何制作ico及让浏览器地址栏显示网站的ico图标?
下一站:  网站被导航收录后,能在站长工具查到反链、友链吗?


申明:本资料由全球网站库会员提供,完全免费,敬请您提防上当;另转载请注明出处,资料来源:http://www.0430.com/cn/web236901/。
如何制作ico及让浏览器地址栏显示网站的ico图标? 感谢您的支持与分享!

»如果您觉得'如何制作ico及让浏览器地址栏显示网站的ico图标?'相关资料不全,请点此协作更新!

您的姓名: * 可选项,留空即为匿名发表
评论内容:
剩余字数:  * 按 Ctrl + Enter 发送.
        

0430.com温馨提示:资料由网站会员自行发布,请大家自辩真伪;评论只需提交一次,请耐心等候审核通过,方可显示。
1楼 如何制作ico及让浏览器地址栏显示网站的ico图标? [*.*.*.*] 发表于 2014/07/13/ 11:03:00
欢迎您来访本站!
如何制作ico及让浏览器地址栏显示网站的ico图标?:打开微软、谷歌、百度等网站后看到浏览器的标题栏、地址栏,多浏览器的标签上都显示了一个小图标。浏览网站时,可以看到在站名前有网站的小图标,那这是如何制作添加的呢?
»我要发布评论(查看全部评论)
网站版本: English  中文(简体)  中文(繁體)  日本語  Español
»快速收录,请联系QQ:9550196(无需注册会员,3分钟即可永久收录您的网站)
关于我们 | 联系我们 | 贡献网站 | 免责声明 | 友情链接 | 意见反馈 | 分类目录 | 收录条件 | 收藏本页
Copyright 2004-2020 版权所有 0430网站库(本站唯一全球顶级域名:0430.com,仿冒无效,违者追责)
网站声明:本网站所分享网站资料取之于网、用之于网,请大家参考使用时自行辨明、后果自负,0430不承担任何责任。
0430网站库 - 二十四小时在线的免费顶级网站目录 - 让网站与我们的生活更近!