[bookmark] 09/26/2015

• 弄懂Favicon | css3教程-css3实例-css3动画 | W3CPlus

  Tags: favicon

  • 当Alec Rust问及HTML5 Boilerplate项目是否可以提供切换成高DPI的favicon的时候，我才意识到我对网站图标（favorite icon），触摸图标（touch icons），和磁贴图标（tile icons）知之甚少。当我决定稍稍深究一下的时候却发现一些有趣的事情。
  • favicon的type属性和<script>的type属性的作用几乎一样。截至2013年1月16日，据维基百科显示，无论客户端是否为IE浏览器，favicon的type属性都可能对其正常显示产生影响。事实上，IE只关心服务器MIME类型要为ICO文件，却会忽略type属性。因此，type属性可以是任意值，也可以为空。
  • 如果在没有上述选项的情况下，两种平台的Chrome都会使用第一个声明的favicon，这点正好与Firefox和Safari相反。Chrome for Mac确实会忽略16×16的favicon而直接使用32×32的，如果在非视网膜屏的设备上就会把它缩小到16×16。
  • 令我沮丧的是，Chrome，Firefox，Opera 7+，和Safari 4+都支持PNG格式的favicon，但是Chrome和Safari在两种格式都提供的情况下却会使用ICO格式，而且完全无视favicon的声明顺序。另一方面，IE不支持PNG格式的favicon，但是它会忽略PNG格式的声明以及声明顺序而直接使用ICO格式的favicon。
  • 现在有个大问题是，IE 10不再支持条件注释，而且也不支持PNG格式的favicon。上面的代码在之前的IE浏览器中确实会比最新的IE浏览器有更好的效果。
  • 目前使用IE 10的大多是Windows 8的用户。Windows 8提出一种新的网站显示图标——磁贴图标。

Posted from Diigo. The rest of xgreeco group favorite links are here.