favicon.png 与 favicon.ico - 为什么我应该使用 PNG 而不是 ICO？

StackOverflow https://stackoverflow.com/questions/1344122

  •  20-09-2019
  •  | 
  •  

题

除了 PNG 是一种更常见的图像格式这一事实之外，是否有任何技术原因支持 favicon.png 与 favicon.png。图标.ico？

我支持现代浏览器，它们都支持 PNG 最喜欢的图标。

有帮助吗？

解决方案

由于该线程中其他人的大量更新和注释，答案被替换（并变成了社区 Wiki）：

  • ICO 和 PNG 都允许完全基于 alpha 通道的透明度
  • ICO 允许向后兼容旧版浏览器（例如IE6)
  • PNG 可能具有更广泛的透明度工具支持，但您也可以找到创建 alpha 通道 ICO 的工具，例如 动态驱动工具 和 Photoshop插件 @mercator 提到过。

请随时查阅此处的其他答案以了解更多详细信息。

其他提示

除非你指定经由favicon.ico的快捷方式图标的所有现代浏览器（与铬4，火狐3.5，IE8，歌剧10和Safari 4测试）将总是请求一个<link>。所以，如果你没有明确指定一个，这是最好的总是有一个favicon.ico文件，避免了404的雅虎！建议你把它小，可缓存。

和你不必去只为阿尔法透明PNG无论是。 ICO文件支持阿尔法透明就好（即32位彩色），尽管几乎没有任何工具允许你创建它们。我经常使用动态驱动器的图标生成器创建具有Alpha透明度favicon.ico文件。它是唯一的在线工具，我知道的，可以做到这一点。

还有一个免费的 Photoshop插件可以创建它们。

.png文件都不错，但.ico文件提供阿尔法通道透明，也<强>加他们给你的向后兼容性。

有一个在哪种类型的的StackOverflow 使用例如（请注意，它是透明的）：

<link rel="shortcut icon" href="http://sstatic.net/so/favicon.ico"> 
<link rel="apple-touch-icon" href="http://sstatic.net/so/apple-touch-icon.png">

在苹果iTouch的啄为iphone用户，使一个快捷方式到网站。

的* .ico文件的理论优点是，它们是比容器可容纳多于一个的图标等等。你可以例如存储与Alpha通道的图像和16色版本的遗留系统，或者你可以添加32×32和48×48的图标（这应该向上拖动链接到Windows资源管理器时）。

这个好主意，但是，倾向于随着浏览器的实现发生冲突。

PNG有2个优点：它具有更小的尺寸和它的更广泛的使用，并支持（除了在壳体网站图示）。 正如ICO前面提到的，可以有多种尺寸的图标，这是桌面应用程序，但没有太多的网站。 我建议你把一个favicon.ico的在应用程序的根目录。一个如果你有机会到您的网站页面的头部使用标签指向一个PNG文件。 因此，旧的浏览器将显示为favicon.ico和较新的PNG。

要创建巴和图标文件，我会建议的瘸子。

Google+等一些社交工具，用一个简单的方法来获得外部链接图标，取 http://your.domainname.com/favicon.ico

既然不预取的HTML内容时，<link>标签将无法正常工作。在这种情况下，你可能想使用mod_rewrite的规则，或只是放在默认位置的文件。

这是ICO能的是一个PNG。

更确切地说，可以一个或多个PNG存储这个最小容器格式的内部，而不是通常的位图+阿尔法大家强烈ICO关联。

支持是旧的，出现在Windows Vista中（ 2007年）和深受浏览器所支持，尽管不是必须由图标编辑软件。

任何有效的PNG（整体包括头）可通过一个 6字节ICO头和16字节的图像目录。点击 GIMP有原生支持。简单地导出为ICO和刻度 “压缩（PNG）”。

避免PNG在任何情况下，如果你想可靠IE6的兼容性。

许可以下： CC-BY-SA 和 归因
不隶属于 StackOverflow
scroll top