首页 网站建设优化正文

网站favicon图标制作操作步骤

今天给大家说说网站favicon图标制作,虽然制作方法很简单,但是很多新手还是不会操作。 什么是网站favicon图标呢?网站favicon图标就是在网址前显示的图标,可以设置也可以不设置,赵连奎博客觉得设置好网站favicon图标会让网站显得更正规,更有个性一些。注意有个别浏览器是不支持网站favicon图标的,只要是主流浏览器显示就证明制作成功了。如下图,奎字就是赵连奎博客下的favicon图标。

赵连奎博客网站favicon图标

网站favicon图标制作方法也非常简单,大家可以直接百度搜索网站favicon图标在线制作,就会出现很多制作favicon图标的网站。 

具体的操作步骤: 

 1.利用photoshop制作图片,注意图片不要太大,最好使用正方形的图片。可以把图片保存成JPG格式或PNG格式。 

2.寻找在线制作网站favicon图标的网站,利用其在线制作功能。每个网址的制作页面不同,但整体操作步骤是一样的。 

3.这里是我找的一个网站favicon图标的界面,一般需要设置目标尺寸,我个人觉得16*16就可以。其次设置好源图片,就是咱们自己想转化成网站favicon图标的图片。最后点击在线生成网站favicon图标下载保存即可。

网站favicon图标制作步骤图

4.把下载好的图片重命名为favicon.ico,一定要记得后缀是ico,然后上传到网站的根目录下即可。 注意favicon图标制作完成后,有时候网站并不能立即显示出来,需要等待一会儿或者更新网站和浏览器缓存。 如果网站一直不显示,有可能是模板中缺少favicon的设置代码,大家需要把下面的代码防止在网站头部head中。

<link rel="shortcut icon" href="/favicon.ico"/> <link rel="bookmark" href="/favicon.ico"/>

如果你想创建动态的favicon图标,那么先把做好的gif动态图标命名为favicon.gif,然后再 head 之间加上下面的代码。

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

推荐阅读:wordpress显示百度收录情况插件


评论