IE 9到了 你的网站需要做好哪些准备

原创
系统 浏览器
为了充分利用Internet Explorer 9独特功能而设计的网站提供了沉浸式的用户体验,从而可以提高客户忠诚度、增加流量。不过你想获得这些好处,就得优化自家网站,以便充分利用IE 9。

【51CTO精选译文】为了充分利用Internet Explorer 9独特功能而设计的网站提供了沉浸式的用户体验,从而可以提高客户忠诚度、增加流量。不过你想获得这些好处,就得优化自家网站,以便充分利用IE 9。

微软推出的这款***旗舰浏览器绝不仅仅是小打小闹的增量更新。它还提供了Windows与Web之间***的集成,实际上将桌面体验扩展到了Web本身。

随着我们对Web的使用越来越成熟,更多的人在积极采用基于云的应用,比如Gmail、Box.net和Mint.com。使用诸如此类的网站的体验更像是在使用传统桌面应用,只不过这个应用是在互联网上。IE 9能够为任何网站提供一种类似的交互体验。任何用户只要把网站图标拖拉到Windows 7任务栏上,就可以得到这种集成,就好像你使用任何软件应用那样。

如果把某个网站固定到任务栏上,该网站对用户来说更清晰可见,还可以直接访问。但为了给用户一个想把你家网站固定到任务栏上的理由——而更重要的是,为了给他们一条与你家网站进行交互的途径,就好像网站是安装在用户本地个人电脑上的应用,你就得充分利用Jump Lists(跳转列表),Windows 7的这项功能可显示菜单选项,以便直接跳转到特定功能,或者访问经常使用或最近使用的功能。

Windows 7任务栏

IE 9还与Windows 7中让用户能够把你家网站当作本地应用来对待的独特功能联系在一起。你可以创建自定义Jump List菜单;用户点击Windows任务栏上你家网站的图标后,这些自定义菜单就会出现。Jump Lists让用户可以访问经常使用或最近使用的内容,而且出现新内容后,就会收到动态提醒消息。

进行合适的改动和调整,以便针对IE 9定制你家网站,的确至少需要对HTML和Web编程有一些了解。不过有了初步了解后,你就能在短短几分钟内完成好定制。

一个技巧就是把任何网站的图标从IE 9的地址栏拖拉到Windows 7任务栏上,把它***性地固定在那里。你会看到任务栏上的网站标识;点击网站标识,立马就能访问该网站。

不少网站已经充分利用了Jump Lists,让自己用起来更像是应用,LinkedIn和Windows Live就是其中的两个例子。就LinkedIn或Windows Live而言,用户只要点击Jump List中的项目,就能直接转到网站里面的特定网页或功能。

微软的这张图显示了Windows 7任务栏的交互功能。#p#

定制Jump Lists

把Facebook固定到Windows 7 任务栏上只不过提供了简单的网站快捷方式,而LinkedIn和Windows Live提供了一种更加集成的体验,酷似像Outlook这样的本地安装的软件应用。把Jump List任务添加到你家网站相对简单,那么何不给访客们一个把你家网站固定到他们任务栏上的理由呢?

若系统使用IE 9和Windows 7,Jump List任务可以链接至静态URL,那样就算固定网站(pinned site)没有打开时,用户也可以点击、直接访问。你可以为你家网站最常用的功能添加Jump List任务,那样用户不必打开浏览器、手动导航至相应网页,就可以直接转到那些功能。

从Windows 7任务栏来看,Facebook的Jump List(左)内容少得不能再少,而LinkedIn的Jump List(中)和Windows Live的Jump List(右)比较充分地利用了它。

链接任务作为静态URL保存起来,而静态URL其实是直接链接至特定网站或功能的路径。你可以使用HTML元标记(metatag),定义最多五个Jump List任务。元标记定义了关于网站的基本信息,与固定网站一块缓存起来。下面这个示例表明了如何为你家网站定义Jump List任务,该示例摘自Israel Hilerio博士所写的一份题为《Win7桌面与IE9的集成》的微软文档。(该文档本身在网上找不到,但里面介绍的内容和方法可以在这里找到:http://msdn.microsoft.com/en-us/ie/dd797411.aspx):

<META name="msapplication-task"
content="name=Task 1;action-uri=http://host/Page1.html;icon-uri=http://host/icon1.ico"/>
<META name="msapplication-task" content="name=Task 2;action-uri=http://microsoft.com/Page2.html;icon-uri=http://host/icon2.ico"/>

Hilerio解释,这段代码定义了两个标记:“Task 1”和“Task 2”。选择“Task 1”会引起软件程序显示 Page1.html网站,而选择“Task 2”会引起软件程序显示Page2.html网站,这是Microsoft.com域上的一个外部网站。每个任务都会在固定网站的浏览器实例的各自标签页里面打开。如果固定网站目前没有打开,点击这些Jump List菜单项目中的其中一个,就会打开一个新的浏览器实例。

创建自定义Jump List类别

你家网站还可以添加Jump List类别,从而扩展功能,不仅仅局限于五个Jump List任务。Jump List类别让你可以直接转到诸如文件、文档或ULR之类的目的地。你可以使用SiteMode APIs,创建其链接对每个独特用户来说都具有唯一性的自定义Jump List类别,比如个人档案网页。

Jump List类别让你家网站能够向用户提供动态信息,哪怕用户此刻没有访问网站,照样也能提供。 你可以利用这种功能,让用户访问用户所特有的历史内容,比如访问过的网站或打开过的文件,或者你可以用它来提供提醒和通知,表明与网站有关的活动——比如说,收到新邮件或者通知即将发布的事件。

正如Hilerio的文档解释的那样,要创建自定义Jump List类别,必须经过以下步骤:

类别创建

首先调用创建自定义类别标签的方法。下面所示的示例代码创建了一个自定义类别,名为“List1”。这个方法至少得调用一次,之后才能使用与创建自定义Jump List类别操作有关的其他任何方法。Jump List类别至少填充了一个项目后,类别标签才会出现。

window.external.msSiteModeCreateJumplist('List1');

项目创建

下面的示例代码表明了如何创建名为“Item1”、“Item2”和“Item3”的三个Jump List类别列表项目。名称参数后面先跟的是定义项目将转到哪个URL的一个参数,之后跟的是指定为该特定项目显示哪个图标的另一个参数。

window.external.msSiteModeAddJumpListItem('Item1', 'http://host/Item1.html',
'http://host/images/item1.ico');
window.external.msSiteModeAddJumpListItem('Item2', 'http://host/Item2.html',
'http://host/images/item2.ico');
window.external.msSiteModeAddJumpListItem('Item 3', 'Item3.html', 'images/item3.ico');

列表显示

之前的代码为列表创建了项目,但并没有显示项目。使用下列示例代码,即可显示实际Jump List中项目的内存中列表:

window.external.msSiteModeShowJumplist();

清空列表

如果Jump List类别填充了网站历史内容或近期活动,那些操作可能会到期失效。可以用下列代码,清空自定义Jump List类别中的项目:

window.external.msSiteModeClearJumplist();

你还可以为你家网站把提醒消息添加到Jump List

你可以使用这里显示的方法,为你家网站创建和填充一个自定义Jump List类别。你可以做到在自定义类别中一次最多只能显示12个项目。重复项目被忽略;超过最多数值或因分辨率或字体大小变化而显示不出来的项目则不显示。

显示覆盖图标

Windows 7上的IE 9具有的***功能之一是,能够显示固定网站任务栏按钮上的覆盖图标。为什么显示覆盖图标那么重要?因为固定网站可能处于闲置状态,被其他网站或应用隐藏起来。借助覆盖图标,你可以显示动态内容或***信息,了解在后台进行的活动,而这些活动可能会引起用户的注意,并促使他们采取操作。

你可以显示表明事件或约会的小铃图标,或者是让用户知道新邮件已收到的信封图标。覆盖图标会出现在固定网站任务栏按钮的右下角。不过,要是网站没有打开,或者要是网站其实没固定到任务栏上,覆盖图标是看不见的。

下列示例代码可以为固定网站添加相关任务栏按钮上的overlay1.ico,并且添加一个悬浮工具提示,指明了带字符串Overlay 1的覆盖图标:

window.external.msSiteModeSetIconOverlay('http://host/images/overlay1.ico','Overlay 1');

为了清空覆盖图标,请使用下列代码:

window.external.msSiteModeClearIconOverlay();

这一系列示例仅仅是一小部分。参阅微软的《Internet Explorer 9开发者指南》(http://msdn.microsoft.com/en-us/ie/ff468705.asp),就可以全面地了解IE 9的独特功能,以及如何定制你家网站以便充分利用这些功能方面的解释。

不过要牢记:IE 9只与Windows 7和Windows Vista兼容,这意味着:为三分之二的个人电脑针对IE 9定制网站将变得毫无意义。要摸清实际情况,别为了仅仅这一款浏览器而投入不必要的时间和精力。

由于公司迟迟不愿升级系统,消费者积极地采用Windows 7和Internet Explorer 9。因而,这种变化会对普通大众用什么系统与你家网站进行交互带来直接影响。

如果你家网站针对的是普通消费者,那么应该探究IE 9的独特功能,并且充分利用起来。你没必要非得是编程专家,也没必要非得重新设计整个网站,给访客们一个把你家网站固定到他们任务栏上的理由——进而提供一种更加沉浸式的、类似应用的体验。

原文地址

【51CTO精选译文 转载请标明出处与作者】

【编辑推荐】

  1. IE9对HTML5部分属性不提供支持的原因
  2. IE9插件集中营 七款插件任你挑附下载
  3. IE9与Chrome 10 你是我的兄弟
  4. IE9体验手册 它就在那用不用在你
  5. 评论:IE9到来 Web设计师的梦魇
责任编辑:张浩 来源: 51CTO.com
相关推荐

2011-03-10 15:33:54

Debian社区

2021-03-23 10:04:55

数据工程师工具数据分析

2022-04-06 10:12:51

网络安全网络漏洞

2018-06-28 13:17:35

云平台云环境容器

2014-08-22 09:53:16

Windows 9

2019-02-25 08:08:18

网站跨域数据泄露黑客

2022-09-07 11:36:59

元宇宙IT

2022-01-11 14:42:31

云安全网络安全容器

2011-07-04 08:50:37

2011-11-24 11:21:43

2021-05-10 10:23:24

加密货币比特币货币

2011-01-20 16:40:10

私有云

2016-01-07 15:08:34

制信网

2011-09-09 14:01:53

组网路由器交换机

2022-08-22 15:01:24

网络安全大数据物联网

2016-05-12 12:26:29

阿里巴巴app移动

2014-03-17 16:40:07

混合云IaaS

2023-11-06 14:42:25

2017-05-12 10:24:59

HANASAP BW数据仓库

2017-08-14 09:41:02

技术创业创业者
点赞
收藏

51CTO技术栈公众号