[HTML] 利用 Real Favicon Generator 制作 favicon_html/css_WEB-ITnose

本帖是参考了 sitepoiont 的这篇文章 《Quick Tip: Add Favicons Quickly and Easily to Your HTML》 ，补充一些个人的一点意见。下面来看看如何利用 Real Favicon Generator 这个网站制作favicon。

上传图片

打开 Real Favicon Generator 进入网站之后，点击右边的上传按钮即可上传准备用来制作 favicon 的图片，该图片有以下要求：

1. 可以是 PNG JPG SVG 等格式
2. 至少是 70X70 像素
3. 要想有最棒的效果，建议像素在 260X260以上

这里我用了一张神烦狗的照片。

生成 favicon

成功上传之后，页面跳转到生成 favicon 的界面，在这里可以自动生成 iOS、Android、Safari、Windows 等多种样式的favicon，具体还可以调整细节。

在 favicon 生成选项里还有一些选项，我建议修改一下路径，还有一个压缩图片的也很实用。

一切设置好之后，点击生成 favicon按钮，就大功告成了。

使用 favicon

生成 favicon 之后页面会跳转到使用向导。想在你的网站上使用，你可以这么做，以在 HTML5 页面中使用为例：

1. 首先下载生成的 favicon 包
2. 解压到你的网站目录下
3. 将生成的代码插进网页 标签里

结论

利用 Real Favicon Generator 可以很方便的批量生成 favicon，适合我们在PC、手机、平板的多种浏览器中查看，是不是很方便快捷？