网站如何添加favicon?

如果你是一个网站建设初学者,或许对于favicon的使用还并不是很熟悉。
所谓favicon,就是指某个网站在浏览器标签栏处显示的图标,它可以是你网站的logo,也可以是其他任何符合要求的图片,在这里我们简单讲解一下如何在你的网站中引入自定义favicon。

 

制作属于自己的favicon

要想制作favicon,首先要有符合需求的图片,这个图片可以是你的logo,或者是其他你想要生成favicon的图片。
它的尺寸比例最好是1:1,这样在生成favicon之后也会有不错的显示效果。
有了这个图片之后,就可以通过ps等软件制作属于自己的favicon了,尺寸可以是16x16或者32x32。
如果你不会使用ps,那么可以用一些转化favicon的网站来制作。

 

网站制作favicon指导

我们以国外的网站http://www.favicon.cc/为例。
打开网站以后,点击左侧"import image",选择"Keep dimensions",由于我们原本就是等比例图片,所以这两个选项没有区别。
Upload 你的本地图片,然后点击download下载即可。

 

在网站中引入favicon

制作好favicon以后,应该如何引入呢?
如果你采用的是模块化网站开发,那么就要在共有页头元素的head中加入标签,如果是静态化页面,则每个页面都要添加该标签。
具体添加标签代码<link rel="icon" type="image/x-icon" href="/favicon.ico">。
然后将favicon放入根目录即可。

怎么样,是不是很简单?赶紧来自定义你网站的favicon吧!