Windows 8 中的固定网站的高品质视觉效果

Windows 8 中的固定网站介绍了网站开发人员如何在 Windows 8 的“开始”屏幕上为其网站的固定网站磁贴提供一个网站图标 (favicon)。许多开发者都提供了相同的反馈,即希望提供更高分辨率的视觉效果,以便通过用户的固定网站磁贴更好地展现网站品牌。请下载 Windows 8 Release Preview,您可以实现上述目标:我们已经增加了提供 PNG 磁贴图像并指定磁贴背景颜色的功能。

示例

下面就是两个固定网站磁贴的示例,它们使用网站的 favicon,分别自动确定颜色(左)以及使用自定义的磁贴颜色来确定高分辨率的 PNG(右):

Fresh Tweets demo 的默认磁贴Fresh Tweets demo following @BenThePCGuy 的磁贴

标记

Meta 标记指定磁贴的图像和背景颜色。示例:

<meta name="msapplication-TileImage" content="images/benthepcguy-144.png"/>

<meta name="msapplication-TileColor" content="#d83434"/>

磁贴图像必须是长 144px 宽 144px 的方形 PNG。为了获得最佳效果,我们建议使用透明的背景,而不是与磁贴颜色一致的背景色。可以使用 CSS 的 #rrggbb 表示法(通过 CSS 颜色名称或通过 CSS rgb() 函数)将磁贴颜色指定为十六进制 RGB 颜色。

请在我们更新的 Fresh Tweets demo 上查看此操作的动态演示。

注意: 当用户将该网站固定到其“开始”屏幕,IE10 仅会下载磁贴图像,以便网站不会带来额外的宽带消耗。

总结

Internet Explorer 10 允许 Web 开发者为固定网站磁贴创建高品质的以网站为中心的视觉效果,从而网站的品牌形象更好地显现在 Windows 8 的“开始”屏幕上,并且与其余应用程序和内容磁贴在视觉上更好地融为一体。开发者仅需要提供一个高品质的图标,当设备在不同的分辨率下运行时,Windows 8 将会根据需要进行伸缩扩展。

网站还可以共享通知,并提供跳转列表以便快速导航该网站。请参阅 Windows 8 中的固定网站来了解操作办法。

我们期待您将这些简单的功能添加到您的 Web 网站中以最大程度地在 Windows 8 中发挥其作用。

+—Internet Explorer 项目经理 Rahul Lalmalani

Comments

  • Anonymous
    June 13, 2012
    赞。