我正在Android上开发一个网络浏览器,并希望显示访问量最大的网站的网址,例如Chrome(4 X 2)。但问题是,大多数favicons(例如:http://www.bbc.co.uk/favicon.ico)的大小为16X16或32X32,并且在放大时看起来不太好。
有没有办法以标准方式为URL下载高分辨率图标/位图?如何打开主页,然后提取所有图像链接,然后选择一个名称为logo的图像?这种方法适用于所有网址吗?我想知道是否有一种标准方法可以获得给定URL的高分辨率图标,或者图标是获取网站徽标的唯一标准方法?
您可以自己编写代码或使用现有解决方案。
自己动手算法
<link rel="apple-touch-icon" href="/apple-touch-icon.png">
。这些图片的范围从57x57到152x152。请参阅Apple specs以获取完整参考。/apple-touch-icon.png
找到一些东西。再次,请参阅Apple specs以供参考。<link rel="icon" type="image/png" href="/favicon-196x196.png" sizes="196x196">
。在此示例中,您有196x196图片。<meta name="msapplication-TileImage" content="/mstile-144x144.png">
。这些图片的范围从70x70到310x310,甚至更多。请参阅这些Windows 8和Windows 8.1参考文献。/browserconfig.xml
。这是您可以找到瓷砖图片的另一个地方。见Microsoft specs。og:image
声明,如<meta property="og:image" content="http://somesite.com/somepic.png"/>
。这是一个网站如何向FB / Pinterest /表示它的首选图片。请参阅Open Graph Protocol以供参考。注意:步骤1,2和3基本上是Chrome为获取书签和主屏幕链接的合适图标所做的工作。 Coast by Opera甚至使用MS平铺图片来完成工作。阅读此列表以找出which browser uses which picture(完全披露:我是本页的作者)。
API和开源项目
RealFaviconGenerator:您可以使用此favicon retrieval API获取任何网站图标或相关图标(例如触摸图标)。完全披露:我是这项服务的作者。
BestIcon:尽管不太全面,Besticon提供了一个很好的选择,特别是如果你想自己托管代码。还有一个hosted version,你可以立即使用。
https://github.com/mat/besticon的Go代码试图解决这个问题。
例如
$ besticon http://github.com
http://github.com: https://github.com/apple-touch-icon-144.png
还有一个随附的托管版本的代码,例如参见http://icons.better-idea.org/icons?url=github.com。
(免责声明:我写这篇文章是因为我不久前需要解决同样的问题。)
标识不会一致地命名,并且很难一致地识别。考虑将favicon放在合适尺寸的彩色瓷砖上。人们会很快将颜色与网站联系起来。您可以使用colorthief之类的东西从网站或图标中提取主色,或者使用金色角度公式选择每个色调以选择色调。
通常,favicon很小(如16x16或32x32)。如果您需要更大的尺寸,请提取不是图标,而是从主页/标题中提取徽标。