IE11阅读视图：带给你静心饕餮阅读大餐的片刻

编者按：又到读书日，今天你挤出时间读书了吗？如今，越来越多人在习惯电子阅读，然而总难逃眼花缭乱的干扰信息。Internet
Explorer 11新增阅读视图功能，一键开启，给你带给你静心饕餮阅读大餐的片刻！那该功能如何从技术上实现、有着怎样的研发故事？本文为你讲述这一功能从研究到产品的“前世今生”。

4月23日，我们又迎来又一个“世界读书日”。

2014年的读书日里，数字化阅读和纸质阅读逐渐“平分秋色”，为不同的人群所喜爱。在这一天，请捧起你心爱的书或打开你的电脑，在温馨安静的环境里，享受阅读的快乐。

然而，困扰不少。

在用平板电脑或手机来阅读小说或跟进时事信息时，眼花缭乱的信息不断闪现，渐欲迷人眼；想专注阅读心中所爱，却难逃扑面而来的广告干扰，难以积聚心神；偷得浮生半日闲，难得有时间静心阅读，却发现文字太小且排版太密，白底背景色又过亮，搅得人瞬间兴致全无。回想起这些数字化阅读的恼人“事迹“，恐怕好多人又会不由自主地开始怀念起过去那手不释卷的日子了。

这一切的期待，都将在Internet
Explorer 11（IE11)浏览器中得以实现。它新增的阅读视图（Reading
View），将为你开启无干扰的阅读时刻，清除烦恼，让你享受片刻舒适沉浸式阅读的美好时光。

目前，用户可以在Windows 8.1的Modern UI
界面或Windows Phone
8.1中找到IE11阅读视图功能。它能够精准地抽取众多网页的主体阅读内容，并在去除干扰信息后对其重新进行排版。当用户打开相应网页来阅读小说或关注时事时，IE
11能够对该网页进行识别判断，随后生成一个阅读视图的按钮。读者点击按钮后，随即进入阅读视图。阅读视图将意味着什么呢？

·        
可以暂时隐藏恼人的干扰信息、保留正文文字和图片，带来干净整洁的视图；

·        
可以对网页重新排版、自适应屏幕大小（屏幕比较宽的时候，会选择横向呈现阅读内容，而屏幕比较窄的时候，会自动选择纵向呈现阅读内容）；

·        
可以让读者自行调节字体、行距和背景颜色，让读者能舒适愉悦地读书。

一切的一切，就是为了让爱阅读的你，专注而舒适饕餮阅读大餐！这一新功能从技术上是如何实现的呢？它的背后又有着怎样的研发故事？

基于Windows 8.1
的Modern UI 界面

初始网页

使用阅读视图后的效果图

基于Windows Phone
8.1

                               

                                           
    初始网页                      使用阅读视图后的效果图

多年的技术积淀：“网页分区”和“学习网页模版”

“这项技术，我们在11年前就开始研究了。”微软亚洲研究院主管研究员宋睿华说道。

2003年，宋睿华刚加入微软，而早在那个时候，她就已经开始接触一项为实现IE11
沉浸式阅读视图功能奠定夯实基础的相关技术——“网页分区”。

当时搜索引擎才刚起步，人们在使用搜索引擎进行搜索的过程中，往往会出现不少问题。宋睿华恰好观察到一个现象，她说：“当时我在学校上学，尝试用搜索引擎搜索‘桂林三宝’。但是当时最好的搜索引擎找到的结果也有很多不准确信息。‘桂林’二字有可能是网页中间正文的名字，而
‘三宝’则在右边更多推荐信息侧栏中。因此，右侧是在说吉祥三宝，而中间是关于桂林的新闻，完全不是我要搜索的内容。”

究其原因，睿华有了这样的思考，“
当机器在进行搜索时，把网页的整个页面当成一个整体，没有对网页进行分区，只关注关键词是否匹配，但这明显是不准确的。当时大多数搜索引擎都是这样，它们对网站的了解和定义比较浅显，搜索时会出现不少问题。”

“人们浏览网站，会很一目了然——这个是正文、那个是横幅广告、这个是指向其他网页的链接、那个是页脚——人是很容易完成这个辨别过程的。然而对机器来说并不容易，很多时候人工智能、机器学习的技术，就是让机器逐渐具有人的能力，这就是我们在做的事情 
。”睿华补充道。

那如何让机器迅速地把网站分成一些区域，并知晓这些区域的功能，比如能区分正文和广告区域？

不久后，睿华离开学校并进入微软，与同事和实习生进行合作发表了一篇文章Learning
Block Importance Models for Web Pages，研究对网页进行分区的重要性，以及如何让机器把网页划分成不同分区并判定每个分区的重要程度，获得了国际万维网大会（WWW）的最佳论文提名奖。后来，这项技术在必应搜索团队中初步实现了技术到产品的转化。

随后，基于睿华的工作，微软亚洲研究院发表了一系列关于网页分区的相关论文，将这一成果应用在提高搜索引擎的相关性和重要性计算中，以及如何在移动设备上更有效的浏览网页。今天看来，这些工作都是很有前瞻性的。

第二个相关技术是让机器学习网站模板。“那时候是07年了，前期研究工作是比较普遍性的，可以适用于多数网站。但如果希望做到产品转化标准，还需要进一步改进学习模板。当用户使用这项技术来抽取网页里的文字时，时常会出现很多问题——普遍性模板的抽取成功率只有85%
，那剩下的15%将会给用户带来困扰。那我们如何从技术层面来补救呢？最佳方案是普遍性加上针对特定网站进行网页模板学习。”睿华介绍道。

许多网站的网页形式都非常相似，模板差不多，看上去都很一致。比如你去看央视的网站，在看了网页html
来源之后，你会找到网页布局分区的一些特点。

而睿华和她的团队做的事情与网页设计相反，是一个逆向的过程。“考虑到同一网站的不同页面具有相似性，我们要如何从不同网页中学习出其中相似的东西，这有点像归纳，归纳出一个相同的模板。而归纳模板的目标是，当机器学习了这个网站的10个页面，接下来可以快速准确地抽取来自这个网站的其他几千甚至几万页。模板技术是为了提高一些大网站的抽取精准度，我们在这其中做了很多研究。”

从技术到产品：柳暗花明又一村

文本抽取相当于前两个技术的实践应用，睿华在07年写论文时就做过文本抽取，但当时没有了解到技术转化成产品的需求，就沉寂了一阵子。

直到12年12月，微软产品团队找到微软亚洲研究院，寻求合作。

然而，初期的技术转化并不那么得心应手。

“07年我们发表论文时，已经给前两项技术开发了一个文本抽取的应用，当时我们认为已经做得很好了，论文被人工智能（AI）最好的会议接收了。但是直到12年微软产品团队找我们合作，我们尝试了原来的抽取模型，但发现效果不够理想，甚至离当时市面上的其他应用还差很远。”睿华回忆道。

有一段时间，睿华和她的团队成员窦志成相当疑惑，到底是出了什么问题，让一个以前评价也不错的应用变得不太好用了？

不久后，他们找到了两大原因。

一方面，与07年相比，12年的互联网网页设计改变了很多。“07年，网站设计比较单一，多利用表格来安排网页的布局。”睿华继续解释，“但2012年时，网页的结构和书写习惯跟以前已经大不同。现在内容技术先进，采取了更灵活、更复杂的技术，使网页布局看起来跟以前没有什么区别，但你打开Html来源，你会发现变化很大。所以，原先老的算法就不是完全适用。”

另一方面，做研究和做产品的目标存在一定区别，在寻找问题解决方案时会出现不同偏向。睿华对此有深刻体会，“做研究，研究者希望提出一个相对确定的问题，然后寻找解决方案，这个解决方案相对比较新颖、是以前没有人提到的。但是这个东西更像一个玩具模型，你不能靠玩具积木去做一个楼，当你真的在盖一幢大厦时，遇见的现实问题就多了很多，而且解决问题的思路也不大一样。在做产品的过程中，目标只有一个——如何达到产品标准以满足用户的需求。”

在与微软产品团队合作的过程中，睿华几乎把原先论文的方案都改了，重新写了一个算法，充分考虑了产品的需求。“研究只要求我找到一个问题并解决就好了，不过做产品的话，还要考虑以后是不是便于去调整修改。从做产品的角度考虑，我选择放弃了原来的算法，重新寻找新的解决方法。”她继续说道，“其实，有时候在产品中采用的不一定是“the
state of
art”的技术，我不是技术迷，我不追求一定要用最华丽的最难的技术来解问题，但我希望它是一个长期有效的解决方案。”

自此，算法上的问题基本解决。

随后，睿华的团队开始与微软亚洲研究院创新工程组的高光平、刘欣、李俊杰进行技术产品转化，合作开发阅读视图功能。经过多番讨论和落实，最终实现了在IE11中的部署——IE11的阅读视图功能对新闻或小说进行文字抽取的准确率很高，同时可以完整抽取图片，让用户根据自身爱好自行先选择文字、行距和背景颜色，不打断用户阅读的好心情！

群策群力：舒心的合作

其实最初，微软产品团队并不知晓睿华及其团队的研究，他们打算通过第三方公司的专利来实现IE11中的阅读视图功能，而微软内部的良好合作机制让微软研究院得以把睿华团队的技术分享给微软产品团队。

“正如洪院长曾讲过的，当微软产品团队有需求时，他们可以直接使用储存在微软内部的技术，这就是研究院存在的一个重要价值。在这个技术上，我们研究了11年之久，就是期待某一天，当微软需要以用户的需求为导向来优化产品功能时，我们有储备好的、现成的技术可以来直接用；相反，如果在发现产品团队对这个技术有需求时才去研究技术的话，就有些晚了，周期会非常长。”回想起这次合作，睿华这样谈道。

睿华对创新工程组的工程师们评价很高：“跟他们合作非常舒服，我主要专注在算法上，光平则会专注解决技术转化的工作，帮助在IE11的编码上实现我的算法、转化成产品功能。光平有跟Windows产品团队合作的丰富经验，效率很高。整个过程，我都很愉快。”

对于这次和睿华开展的合作，微软产品团队的首席项目经理Jane
Liles评价道：“微软研究院的研究工作使我们在很短的时间内成功地在IE中实现了一项全新的功能，而不是借助第三方公司的帮助。研究院在这个合作项目上关注了大大小小、几乎所有的产品细节，极大的帮助扫清了功能上线时所必须要保证的精度问题。这是一次非常愉快并且成功的合作。“

最后

合作远没有结束，产品功能的进一步改进仍在继续，仍需要研究员和工程师的通力合作。一款优秀的产品就像一只能在蓝天自由飞翔的鸟。研究员和工程师就像鸟的两个翅膀，缺一个，鸟都很难飞起来。

____________________________________________________________________________

相关阅读：

IE 11中的阅读视图简介

阅读视图互动演示

相关人物：

宋睿华

窦志成

相关论文：

·        
Shuyi Zheng, Ruihua Song, Ji-Rong Wen, and C. Lee Giles.
Efficient Record-Level Wrapper Induction. In Proceedings of
CIKM'09, 2009.

·        
Shuyi Zheng, Matthew R. Scott,
Ruihua Song, and Ji-Rong Wen. Pictor: an interactive system for
importing data from a website. In the Proceedings of
SIGKDD 2008 (demo), 2008

·        
Shuyi Zheng, Ruihua Song, and Ji-Rong Wen.
Joint Optimization of Template Detection and Wrapper
Generation. In the Proceedings of SIGKDD 2007,
2007

·        
Shuyi Zheng, Ruihua Song, and Ji-Rong Wen. Template-Independent
News Extraction Based on Visual Consistency. In the Proceedings
of AAAI 2007, 2007

·        
Xing Xie, Gengxin Miao, Ruihua Song, Ji-Rong Wen, and Wei-Ying Ma.
Efficient Browsing of Web Search Results on Mobile Devices Based
on Block Importance Model. PerCom 2005: 17-26

·        
Ruihua Song, Haifeng Liu,
Ji-Rong Wen, Wei-Ying Ma: Learning important models for web page
blocks based on layout and content analysis. SIGKDD Explorations
6(2): 14-23 (2004)

·        
Ruihua Song, Haifeng Liu, Ji-Rong Wen, and
Wei-Ying Ma. Learning Block Importance Models for Web Pages.
WWW 2004: 203-211, Best Paper Runners-Up

欢迎关注

微软亚洲研究院官方微博：http://e.weibo.com/msra/profile

微软亚洲研究院人人主页：http://www.renren.com/600674137