PHP技术,PHP研究及学习,Python学习,人工智能,大数据服务

PHP+Python » 前端设计 » IE9_固定网站技术白皮书

IE9_固定网站技术白皮书

此文被围观1305日期: 2013-02-06 分类 : 前端设计  标签:  ··

IE9网站模式 技术白皮书

IE9固定网站功能简介 简单来说,IE9固定网站(Pinned Website)就是通过几行HTML代码(<meta>标签),将网站应用访问方式提升为Windows客户端应用访问方式,增强用户体验,提升网站品牌标识度,并大幅提高用户使用粘性。 实现代码示例: <meta name="msapplication-task" content="name=我要付款;action-uri=https://abc.com/;icon-uri=https://imgabc.com/abc.ico " /> 为什么使用固定网站? 1. 全面提升用户使用体验。通过整合用户体验,用户可以通过鼠标a.左键快速打开网站b.右键弹出网站应用列表c.获得网站更新通知提示 2. 提升网站品牌认知度。IE9可实现让站点变成Windows 7的一个应用程序固定在任务栏,用户可快速通过任务栏图标快速访问目标站点。锁定的站点会具备统一颜色的IE9界面,进一步增强网站品牌形象。 3. 大幅提高网站访问及用户停留时间。通过IE9网站模式,用户对网站的访问频率及单用户停留时间显著增加,页面跳出率明显降低。 a. hi5(http://hi5.com社交网站。通过网站分析显示,IE9网站模式用户,页面访问数量(discoverability) +15%,活动信息(new friends, game invites, messages)请求 +200% b. Flixster(http://www.flixster.com/电影社交网站。通过网站分析显示,IE9网站模式用户相比其它浏览器用户,页面访问(PV) +34%,平均停留时间 +57% c. Business Insider(http://www.businessinsider.com/商业评论类网站。通过网站分析显示,IE9网站模式用户相比其它浏览器用户,页面访问(PV) +95%,平均停留时间 +57% d. Huffington Post(http://www.huffingtonpost.com/新闻类网站。通过网站分析显示,IE9网站模式用户相比其它浏览器用户,页面访问(PV) +11%,跳出率(bounce rate) -14%,平均停留时间 +49% 实现方法代码示例 1. 高清图标引用 IE9全面支持64X64的高清图标显示,通过引用高清图标,最终用户将获得和应用程序一致的快速启动图标标识。美团网使用高清图标前后对比: 引用高清图标代码示例: <link rel="icon" href="/favicon.ico?v=3" type="image/x-icon" /> 高清图标在线制作及预览工具X-icon Editor http://www.xiconeditor.com/ 2. 实现快速跳转列表 通过IE9实现快速跳转列表,最终用户可以快速访问网站相关频道,获取相关资讯。 快速跳转列表实现代码示例及各字段含义: <meta name="msapplication-task" content="name=ABC;action-uri=https://abc.com/;icon-uri=https://imgabc.com/abc.ico" /> 3. 自定义图标覆盖 覆盖图标是一个小型的 16x16 像素的图形,它显示在任务栏按钮图标的顶部。通过自定义图标覆盖可以提示用户注意网站更新信息。 例如:新浪微博使用网站模式,通过自定义图标覆盖提示有新微博通知。 显示自定义覆盖图标代码示例: window.external.msSiteModeSetIconOverlay('http://host/images/overlay1.ico', 'Overlay 1'); 移除自定义覆盖图标代码示例: window.external.msSiteModeClearIconOverlay(); 开发参考(MSDN) 固定网站开发人员文档 了解开发人员如何实现 Windows Internet Explorer 9 的固定网站功能以将自己的网站与 Windows 7 桌面集成。 这些方案将引导您完成将网站元数据、自定义跳转列表、通知图标和缩略图预览工具栏控件添加到您开发的网站的过程。  http://msdn.microsoft.com/zh-cn/library/gg491731(v=VS.85).aspx 技术博客文章 · General Introduction, Internet Explorer 9 and Pinned Sites, http://windowsteamblog.com/windows/b/developers/archive/2010/10/25/internet-explorer-9-and-pinned-sites.aspx · How to enable IE9 pinning and JumpLists on your website, http://blogs.msdn.com/b/thebeebs/archive/2010/09/16/how-to-add-ie9-beta-pinning-to-you-website.aspx · 如何让你的网站支持 IE9 网站模式 (Part 1 - 理论), http://www.cnblogs.com/cathsfz/archive/2010/11/16/1878816.html · 如何让你的网站支持 IE9 网站模式 (Part 2 - 实战), http://www.cnblogs.com/cathsfz/archive/2010/11/17/1878851.html · 迎接IE9 - Pinned Sites的个性化http://newkadbbz.spaces.live.com/blog/cns!B9B9D1C8892F9662!751.entry · IE9 新功能探索:网站模式(Pinning)与跳转列表 (Jump Lists) , http://blog.miniasp.com/post/2010/09/21/IE9-Pinning-and-JumpLists-on-your-website.aspx  

本站使用ThinkPHP框架开发读图网主题,目前托管在阿里云,图片由读图网提供. 蜀ICP备12031064号

Copyright © 2011-2018adophper.com All Rights Reserved.