CN101202748A - 一种微浏览器浏览网页的方法及微浏览器 - Google Patents

Abstract

本发明提供一种微浏览器浏览网页的方法，使用该方法时，服务器端接收客户端的请求消息，所述请求消息中携带网址信息和设备属性参数；根据所述网址信息从网络服务器获取页面信息；对所述页面信息进行解析，获得所述页面信息中各元素的位置信息，将所述页面信息以及所述位置信息发送至所述客户端。本发明还提供了相应的微浏览器。由于本发明将浏览器划分为服务器和客户端，并且由服务器完成对页面排版时进行的计算过程，减轻了客户端的计算要求，同时，由于服务器在对页面进行排版时按照页面初始的设计版式计算各元素的位置信息，从而保证了客户端显示页面信息时保证了原有的设计版式，符合用户习惯，提高了用户体验。

Description

一种微浏览器浏览网页的方法及微浏览器

技术领域

本发明涉及嵌入式设备通过微浏览器访问网络的技术，尤其是嵌入式设备的微浏览器浏览网页的方法及相应的微浏览器。

背景技术

随着技术的发展，人们越来越希望通过在手机等移动嵌入式设备访问互联网获取信息资源，以便在任何情况下随时随地的获取所要资讯。

起初的嵌入式设备(如手机等)上只支持wap页面的浏览，随着嵌入式设备性能的不断提高，在嵌入式设备上浏览专为PC设计的web页面已成为现实。由于嵌入式设备的显示屏幕远远小于PC屏幕，在显示web页面时通常需要事先对Web页面进行处理。目前一些嵌入式设备的浏览器浏览web网页的方法，通常是把获取的网页在嵌入式设备上重新进行排版，以适应显示屏幕的宽度，然后按html的顺序按列依次显示于显示屏幕，这种模式通常称之为小屏幕适配技术。

但是利用上文所述的通过小屏幕适配技术浏览网页的方法存在问题：由于小屏幕适配技术需要根据嵌入式设备的显示属性将网页重新排版，因此在嵌入式设备上无法按web页面本来的设计版式来进行浏览，无法了解网站的本来的页面风格，从而也使得网站的风格特色无法通过嵌入式设备的浏览器让用户达到与PC浏览器浏览一致的感受。

发明内容

本发明提供一种微浏览器浏览网页的方法及微浏览器，能够使用户浏览web网页时了解网页的整体布局，增强用户体验。

本发明提供一种微浏览器浏览网页的方法，包括步骤：

服务器端接收客户端的请求消息，所述请求消息中携带网址信息和设备属性参数；

根据所述网址信息从网络服务器获取页面信息；

对所述页面信息进行解析，获得所述页面信息中各元素的位置信息，将所述页面信息以及所述位置信息发送至所述客户端。

本发明还提供一种微浏览器，包括客户端和服务器；

所述客户端用于构造请求消息，所述请求消息中携带网址信息和设备属性参数；

所述服务器用于接收所述客户端的请求消息，根据所述网址信息从网络服务器获取页面信息；对所述页面信息进行解析，获得所述页面信息中各元素的位置信息，将所述页面信息以及所述位置信息发送至所述客户端。

由于本发明将浏览器划分为服务器和客户端，并且由服务器完成对页面排版时进行的计算过程，减轻了客户端的计算要求，同时，由于服务器在对页面进行排版时按照页面初始的设计版式计算各元素的位置信息，从而保证了客户端显示页面信息时保证了原有的设计版式，符合用户习惯，提高了用户体验。

附图说明

图1为本发明的一个实施例中微浏览器浏览网页的方法的流程图；

图2为本发明的另一个实施例中微浏览器浏览网页的方法的流程图。

具体实施方式

本发明提供一种在嵌入式设备上浏览互联网上的web网页的方法，以解决嵌入式设备的小屏幕对web网页查看不便，操作复杂的问题。本发明将微浏览器划分为服务器端和客户端，并将客户端安装于嵌入式设备上，为嵌入式设备提供访问网络的途径；由服务器从目标服务器上获取web网页信息，并按照web页面初始的设计版式对页面进行排版，形成基于初始的设计版式的页面数据；由客户端按照初始的设计版式进行整体缩小，从而使得在嵌入式设备上能对浏览的web页面全局了解其页面布局，进一步，可以对浏览的WEB页面局部放大，以便可以快速移到欲查看的部分。

本发明通过以下过程实现。

如图1所示，服务器端接收客户端的请求消息，该请求消息中携带网址信息和设备属性参数(S101)；服务器根据该网址信息从网络服务器(例如，第三方网站、定制网站、应用系统等)获取页面信息(S102)，并对所述页面信息进行解析，计算以获得所述页面信息中各元素的位置信息(S103)，然后将所述页面信息以及所述位置信息发送至所述客户端(S104)，以便使客户端显示页面信息时能够根据位置关系将页面中的各元素按照初始的设计版式显示出来。

由于本发明将浏览器划分为服务器和客户端，并且由服务器完成对页面排版时进行的计算过程，减轻了客户端的计算要求，同时，由于服务器在对页面进行排版时按照页面初始的设计版式计算各元素的位置信息，从而保证了客户端显示页面信息时保证了原有的设计版式，符合用户习惯，提高了用户体验。

考虑到页面信息中可能包括超过嵌入式设备显示屏幕的显示范围的大块文字块，为了便于用户阅读，本发明对这种文字块在服务器端进行排版处理，以便进一步提高用户体验。客户端发送的请求消息中包括设备属性参数，设备属性参数可以包括多种与显示相关的参数，例如嵌入式设备显示屏幕的尺寸、支持的字体、字号大小等，服务器端在将所述页面信息发送至所述客户端之前，当根据所述设备属性参数获知从目标服务器获取的页面信息中包括显示区域超过屏幕的显示范围的文字块时，根据所述设备属性参数对文字块进行适应屏幕的适配处理。另外，还可以针对不同型号的嵌入式设备的不同字体，对页面信息中包含的文字进行适配处理。

进一步，服务器端在传输之前还可以对页面中的图片进行压缩；当服务器根据设备属性参数获知当前的图片超过显示屏幕时，可以基于初始的页面版式进行图片缩放。

另外，对于图片的传输过程可以通过以下方式增强用户的视觉感受，进一步提高用户体验：

客户端没有读完由服务器传送的图片之时，如果客户端已获悉图片的尺寸，但未获得相应的图片，则服务器可以自动填充一个颜色进去，填充的颜色可以是随机选择几种预先已经设计好的颜色，例如浅灰色、浅黄色、浅蓝色、浅红色等。该过程可以通过常规技术手段实现，不再赘述。

若客户端被设置为无图片格式，即不显示图片，则可以由服务器发送一个图片对应大小的框，并在其中填充的颜色，同样可以随机选择几种预先设计好的颜色，例如浅灰色、浅黄色、浅蓝色、浅红色。值得指出的是，如果网页信息中没有说明大小的图片，可以不传送过去。

以下阐述客户端的工作原理。

由于排版计算的相关步骤由服务器来完成，因此客户端根据计算结果对页面信息进行显示，客户端对服务器端发送的相关信息进行解析，根据接收到的页面信息和页面中的各元素的位置信息将所述页面信息生成缩略图，并进行显示。

如上文所述，服务器端根据所述设备属性参数对所述页面信息中的字体进行适应字体大小的排版处理；客户端针对页面中的文字根据嵌入式设备所支持的字体的大小对所述页面信息进行适配处理。客户端的字体通常有两种情况，一种情况是字体较少的客户端，如symbian，java等，可以按大中小三种字体来匹配服务器端发过来最接近的字体，另一种如windows mobile，由于支持的字体较多9-36号字体，因此，它可以更精确的匹配字体的大小。

现有技术中的小屏幕适配技术浏览网页时，由于需要重新排版，导致页面上很多信息隐藏较深，查看不方便，通常需要通过不断的翻页来进行一页页查看，定位到需要看的内容非常的麻烦，无法快速准确的定位，而通过本发明能够进一步简化用户的操作流程，方便用户快速定位目标。服务器发给客户端的页面信息中包括页面的大小参数，客户端根据所述设备属性参数与所述页面的大小参数在缩略图上生成定位框，在一个优选实例中，该定位框选定的目标区域的范围可以为将该选定区域放大到全屏显示时的页面信息，用户可以通过该定位框选定希望浏览的页面信息，当客户端接收到用户发送的触发指令时，定位框选定目标区域，将所述目标区域在显示区域内进行放大。从而，使得用户查看页面信息时可以方便的选定目标，提高用户体验。

本发明中用户可以通过嵌入式设备的控制按键发送上述触发指令，因此，客户端需要建立定位框与控制按键关联的触发事件，当所述控制按键接收到用户的触发指令时，触发所述定位框相应的触发事件。触发事件可以是选定目标区域、以及将定位框进行移动等事件，可以通过不同的控制按键建立不同的触发事件。

为了进一步模拟用户通过PC访问网页的体验效果，可以在放大后屏幕上生成虚拟鼠标，并可以通过方向键控制虚拟鼠标上下左右移动，虚拟鼠标移动至焦点位置时页面信息中的各焦点元素可以通过不同背景色进行标识。虚拟鼠标的实现方法通过常规技术手段实现，在此不再赘述。

对于上述用户通过定位框对缩略图的某个区域进行放大，以及将放大后的区域进行还原的过程中客户端的光标的工作原理，以下将提供一个优选实例予以说明。

当用户在缩略图上进行浏览的时候，由于缩略图较小，当用户在缩略图上移动时，可以显示出对应的文字或图片信息，可以将光标的样式设置成放大镜的显示，以方便用户不必点击进去，就可以方便了解是否是想要切换进去的网页位置。当然，对于不需要该功能的用户，可以提供一个设置选项使用户关闭该功能，也就是默认没有微缩图片；该过程可以通过常规技术手段实现，不再赘述。

当客户端采用小字体显示页面信息时，在缩略图上移动光标时，可以设置光标每次移动的左右距离为19个像素，上下移动的距离为36个像素，由于通常在微缩图的模式下，屏幕的高度大于宽度，并且，由于19大体上相当于一个汉字宽度大2-3个像素，因此该操作较符合用户习惯，以进一步提高用户体验。对于光标的移动方式，还可以有以下增强用户体验的实现途径：当用户按住左键、右键、向上、向下键不放之时，前两次光标(焦点)移动的效率可以为正常，例如200ms；第三次之后的光标(焦点)移动的效率可以加快1倍，为100ms，移动的效率可以为正常等。以上仅作为一种优选方式，并非实现本发明的光标的唯一工作原理。

对于放大后的页面信息，光标移动可以基于焦点的移动，通过焦点的选中计算光标的目标位置，下面进行详细阐述：

若没有焦点的情况，也就是在空白屏幕或者没有焦点的屏幕上进行移动，每次点击光标，上下或者左右方向点击的时候，类似于放大前的移动，移动的距离为19个像素。

在有焦点的情况下(例如，页面信息包括图片、链接、控件等)，从焦点上，向上移动光标，每次移动效率，为1-19个像素。也就是说，如果上面20个像素以上的位置还有一个焦点，不会自动定焦，需要再次点击一次上。而如果1-19个像素的向上范围有第二个焦点，则刚好移动到那个焦点上；如果上面什么都没有，就仅仅移动19个向上，以便更准确的定位到焦点上。由于向下移动通常是用户的一个主要操作，用户主要期望通过下操作定位自己期望浏览的内容，因此，当从焦点向下移动光标，每次移动效率在(1-19*4)个像素。方法同上移动光标情况。另外，从焦点向左或者向右移动光标，每次移动效率在(1-19*2)个像素。方法可以参照向上移动光标情况。不再赘述。不同的字体模式下，可以根据字的大小进行同比例调节。

当光标反向移动的时候，可以根据最小移动像素点进行移动，也就是19个像素点。举例来说：当用户点击下-下-下-上的时候，通常是用户的点击越过了期望点击的范围，这个时候的逆向操作的效率需要降低到标准效率。

当通过光标进行移动的时候，用户经常会发现期望看到文字和手机屏幕刚好对齐吻合的界面，这个时候，当接近对齐的的时候，屏幕可以自动滑动进行对齐。例如，根据单元格(例如div、tr等)来计算移动。在空白区域的移动(也就是后面没有任何文字、图片和焦点)的移动，可以不根据单元格方式计算；在非空白区域的移动(包括文字、图片和各种焦点)，可以在移动超过本单元格的25％之时进行平滑移动，移动的方法可以是根据移动光标的方向，平滑单元格和移动方向的边框对齐。

同样，与浏览缩略图类似，当用户按住左键、右键(或者对应的数字键)不放之时，光标可以前两次(焦点)移动的效率为正常，为200ms；第三至五次光标(焦点)移动的效率为加快1倍，为100ms，移动的效率还是正常；第六次开始的光标(焦点)移动的效率继续增加一倍，向上、下和向左、右的操作类似，不再赘述。

对于本发明，本申请人在申请号为200710031030.9的发明名称为《微浏览器处理网络数据的方法、微浏览器及其服务器》中文件中公开了将浏览器划分为客户端和服务器端的一种实现过程，可以参考相关部分并将其作为本发明的一种实现方式。以下结合图2阐述本发明利用该种实现方式实现时的操作流程。

第一步，用户在浏览器的客户端中输入网址信息；

第二步，客户端根据网址信息以及嵌入式设备的设备参数构造请求消息，通过GPRS等方式连接服务器；

第三步：服务器根据接收到的请求消息进行解析；

第四步：服务器根据请求参数从第三方网站/定制网站/应用系统获取HTML文档；如果引用了其他文档，则获取其他文档，如css文档和javascript文档。

第五步：如果获取的是HTML文档，将HTML文档进行解析，如果是非HTML文档，则通过文档格式转换引擎转换为HTML文档再进行解析；针对不同的文档，进行相应的解析，例如解析CSS文档和JavaScript文档；并构造成DOM树；

第六步：对HTML的DOM树进行小屏幕适配计算，针对不同嵌入式设备的不同字体，以及对HTML中的大块的较宽的文字进行适应屏幕的排版处理，形成基于初始版式的排版结果；

第七步：对小屏幕适配计算结果进行压缩和编码，并发送给客户端；

第八步：客户端接收到数据后，进行解压和解码；

第九步：客户端对解压和解码后的数据按服务器计算出的位置坐标进行布局和展现，生成基于原页面信息的微缩图，并以屏幕与在客户端将显示页面大小的比例生成一个页面定位框；

第十步：客户端移动控制按键控制定位框移动以及触发放大及缩小页面的事件。当进行放大操作时，定位框所框住的页面内容会放大显示布满手机屏幕，并出现虚拟鼠标，可以通过控制按键控制其进行移动，移动范围可以是整个页面的所有地方。长时间按控制按键可以触发加快虚拟鼠标的移动速度的事件。

第十一步：在放大状态下，通过控制按键触发所放大的页面信息恢复至缩略图状态。

值得指出的是，本发明的微浏览器可以实现多种浏览方式，既可以通过上文提供的浏览方式进行浏览，也可以切换至小屏幕适配技术提供的浏览方式进行浏览，通过服务器/客户端结构的微浏览器利用小屏幕适配技术进行浏览的实现方式可以参照申请号为200710031030.9中提供的相关途径实现，在此不再赘述。当将当前的浏览方式进行切换时，客户端需要向服务器发送请求消息，告知将要切换的浏览方式，以便服务器对页面排版时按照相应的技术进行排版。

针对实现上文所述的嵌入式设备通过微浏览器浏览网页的方法，相应的微浏览器的具体结构不再赘述，其实现方式可以通过具有上文所述的相应功能的模块实现上述过程，对于各功能的相应模块的数量以及集成方式不应当理解为对本发明所述的微浏览器的结构的限制。

以上所述的本发明实施方式，并不构成对本发明保护范围的限定。任何在本发明的精神和原则之内所作的修改、等同替换和改进等，均应包含在本发明的权利要求保护范围之内。

Claims (11)

1.一种微浏览器浏览网页的方法，其特征在于，包括步骤：

服务器端接收客户端的请求消息，所述请求消息中携带网址信息和设备属性参数；

根据所述网址信息从网络服务器获取页面信息；

对所述页面信息进行解析，获得所述页面信息中各元素的位置信息，将所述页面信息以及所述位置信息发送至所述客户端。

2.根据权利要求1所述的方法，其特征在于，所述请求消息还包括设备属性参数，将所述页面信息发送至所述客户端之前还包括步骤：

当根据所述设备属性参数获知所述页面信息中包括显示区域超过屏幕的显示范围的文字块时，根据所述设备属性参数对所述文字块进行适配处理。

3.根据权利要求1或2所述的方法，其特征在于，还包括步骤：客户端根据接收到的所述设备属性参数和所述位置信息将所述页面信息生成缩略图，并进行显示。

4.根据权利要求3所述的方法，其特征在于，所述页面信息中包括页面的大小参数，所述步骤还包括：根据所述设备属性参数与所述页面的大小参数生成定位框，当接收到触发指令时，所述定位框选定目标区域，将所述目标区域在显示区域内进行放大。

5.根据权利要求4所述的方法，其特征在于，所述步骤还包括：建立所述定位框与控制按键关联的触发事件，当所述控制按键接收到用户的触发指令时，触发所述定位框相应的触发事件。

6.根据权利要求3所述方法，其特征在于，所述步骤还包括：所述设备属性参数包括客户端所支持的字体，所述服务器端根据所述设备属性参数对所述页面信息中的字体进行适应字体大小的排版处理；

所述客户端根据所支持的字体的大小对所述页面信息进行适配处理。

7.一种微浏览器，其特征在于，包括客户端和服务器；

所述客户端用于构造请求消息，所述请求消息中携带网址信息和设备属性参数；

所述服务器用于接收所述客户端的请求消息，根据所述网址信息从网络服务器获取页面信息；对所述页面信息进行解析，获得所述页面信息中各元素的位置信息，将所述页面信息以及所述位置信息发送至所述客户端。

8.根据权利要求7所述的微浏览器，其特征在于，所述客户端构造的请求消息还包括设备属性参数，

所述服务器还包括用于当根据所述设备属性参数获知所述页面信息中包括显示区域超过屏幕的显示范围的文字块时，根据所述设备属性参数对所述文字块进行适配处理的模块。

9.根据权利要求7或8所述的微浏览器，其特征在于，所述客户端还包括用于根据接收到的所述设备属性参数和所述位置信息将所述页面信息生成缩略图并显示的模块。

10.根据权利要求9所述的微浏览器，其特征在于，所述页面信息中包括页面的大小参数，所述客户端还包括用于根据所述设备属性参数与所述页面的大小参数生成定位框的模块，所述定位框用于当接收到触发指令时选定目标区域，并将所述目标区域在显示区域内进行放大。

11.根据权利要求10所述的方法，其特征在于，所述客户端还包括控制按键，所述控制按键用于建立所述定位框与所述控制按键关联的触发事件，接收到用户的触发指令时，触发所述定位框相应的触发事件。

Images