分开的favicon和android主屏幕图标

时间:2014-09-16 08:06:49

标签: android favicon

参考这些关于疯狂的详细说明:

http://www.jonathantneal.com/blog/understand-the-favicon/

https://mathiasbynens.be/notes/touch-icons

http://en.wikipedia.org/wiki/Favicon

Android现在开始使用<link rel="icon" .. />语法作为主屏幕图标,这与fav图标语法相同。

是否有人拥有神秘的大小组合和订购能够使用单独的主屏幕图标定位Android并仍然保持跨浏览器兼容性。

例如,我们的fav图标具有透明背景,我们更喜欢主屏幕的专用图标。

1 个答案:

答案 0 :(得分:11)

<强>答案

按此顺序构建并声明以下图标:

  • 192x192 PNG图标(专为Android设计)
  • 194x194 PNG图标(经典的favicon设计,透明)
  • 32x32 PNG图标(经典的favicon设计,透明)

注意:Android Chrome 可能使用主屏幕和书签的192x192图标,但v37似乎没有这样做。

您可以使用此favicon generator创建可用作模板的代码和图片。由于它不支持Android的差异化图片,因此您需要手动添加194x194图片。完全披露:我是这个网站的作者。

<强>说明

供参考,Android Chrome uses a 192x192 icon

<link rel="icon" sizes="192x192" href="/favicon-192x192.png">

我做了some experiments about the Android Chrome favicon。结论:

  • Android Chrome确实使用了192x192图标。
  • 如果找不到192x192图标,则会查找较低分辨率的图标:191x191。否则,190x190。其他...
  • 它不使用192x192以上的任何内容。例如,如果您提供16x16图标和194x194图标,则Chrome会选择16x16图标,即使194x194图标听起来是更好的选择。

关于其他浏览器:据我所知,没有其他浏览器明确选择192x192图标。好。否则,这将是一个阻塞问题。有两种政策需要处理:

  • 有些浏览器会选择一些低清PNG图标(例如,Windows Firefox使用32x32 PNG图标)。
  • 有些浏览器会选择定义最高的PNG图标(例如IE 11)。

有了这些信息,游戏现在可以为他们想要的两种浏览器提供,所以没有人(但Android Chrome)会采用特殊的192x192图标。因此上面的答案。

关于订单的一点额外的麻烦。通常,它是无关紧要的,因为浏览器应该仅根据其大小选择图标。 Except for Firefox, which picks the last declared icon