固定网站增强功能，让联系更加紧密
随着技术的发展，CSS动画、WebGL等等的加入网站变得越来越酷炫，同时HTML5本地存储等新功能让网页变得和本地应用越来越像。开发网站是开发者考虑的内容，那怎么能让网站和用户们的联系更接近也许是推广的工作，但其实开发者们也可以提供极大的帮助。http://static.cdn.pcbeta.com/data/attachment/album/201401/07/143429uuw7pyamsm20yps0.png
在 Windows 8 之后的系统中，微软为网站提供了固定网站的功能，相比之前的加入到收藏夹和固定到任务栏而言，固定网站来带来的视觉效果更加直观和明显。尤其是在Windows 8 之后全新的开始屏幕中，固定后的网站磁贴会和本地应用一样醒目。
不过在实现这样的效果之前，我们需要针对IE11 来进行一些设置。设置方法有三种，我们可以根据需要选择： http://static.cdn.pcbeta.com/data/attachment/album/201401/07/143430ttn7hljhh22xsnjt.png使用 HTML 指定固定网站元数据：<meta name="application-name" content=" Contoso" /><meta name="msapplication-TileColor" content=" #009900" /><meta name="msapplication-square70x70logo" content="images/smalltile.png" /><meta name="msapplication-square150x150logo" content="images/mediumtile.png" /><meta name="msapplication-wide310x150logo" content="images/widetile.png" /><meta name="msapplication-square310x310logo" content="images/largetile.png" /><metaname="msapplication-notification" content="frequency=30;polling-uri=notifications/contoso1.xml; polling-uri2=notifications/contoso2.xml;polling-uri3=notifications/contoso3.xml" />
这是最直观的方法，推荐初次使用的时候尝试这种设置方法，不过只可以设置图片的磁贴。如果想要设置可以轮换的图片和更多文字信息可以使用下面的三种方法：http://static.cdn.pcbeta.com/data/attachment/album/201401/07/143430jn26e2zwj6ntyttv.pnghttp://static.cdn.pcbeta.com/data/attachment/album/201401/07/143430suvmnuiilqmwonem.png
使用 JavaScript 设置定期通知：document.addEventListener('mssitepinned', StartPeriodicUpdateBatch, false);
function StartPeriodicUpdateBatch()
{
var arrURI = ["notifications/contoso1.xml", "notifications/contoso2.xml", "notifications/contoso3.xml"];
window.external.msEnableTileNotificationQueue(true);
window.external.msStartPeriodicTileUpdateBatch(arrURI);
使用 XML浏览器配置文件，然后从网页的标记中调用这些文件：<?xml version="1.0" encoding="utf-8"?>
<browserconfig>
<msapplication>
<tile>
<square70x70logo src="images/smalltile.png"/>
<square150x150logo src="images/mediumtile.png"/>
<wide310x150logo src="images/widetile.png"/>
<square310x310logo src="images/largetile.png"/>
<TileColor>#009900</TileColor>
</tile>
<notification>
<polling-urisrc="notifications/contoso1.xml"/>
<polling-uri2 src="notifications/contoso2.xml"/>
<polling-uri3 src="notifications/contoso3.xml"/>
<frequency>30</frequency>
<cycle>1</cycle>
</notification>
</msapplication>
</browserconfig>
使用 meta 元素加载浏览器配置文件：<meta name="msapplication-config" content="IEconfig.xml" />若要取消浏览器配置文件，请将 meta 元素的 content 属性设置为“无”""。如果需要进一步了解详细的设置动态磁贴可以参考msdn上的详细介绍。按照上面的方法我们就可以为自动的网站设置好需要的磁贴，不过需要注意的是磁贴图像的大小必须小于200KB，而且尺寸不能超过1024x1024像素。
除了图片大小和尺寸有限定外，为了能够获得最佳的展示效果，微软还提供了详细的元数据介绍：声明固定网站元数据和固定网站元数据参考都提供了完整的介绍，我们可以前往了解到需要的。http://static.cdn.pcbeta.com/data/attachment/album/201401/07/14370400qtqqapzv0asadc.png
另外全新的IE11提供了更多新的方法、函数和时间来支持通知，我们可以从磁贴中删除通知，返回网页的固定状态，启动磁贴的定期更新，启动磁贴的锁屏提醒更新等等，有了这些新的功能，固定到开始屏幕的网页变得更像是本地应用了。
不过更多新特性还是需要我们亲自实践后才能发现有多么的好用，现在就开始为你的网站添加上固定功能吧，让你的网站在开始屏幕上更加醒目和功能全面。
页:
[1]