CN105183478A - 一种基于颜色传递的网页重构方法及其装置 - Google Patents

Abstract

本发明实施例公开了一种基于颜色传递的网页重构方法及其装置，其中，该方法包括：获取任意两个网页的网页元素信息，对所述网页元素信息进行聚类评估，获得评估结果；获取所述任意两个网页的分块，根据所述评估结果对所述任意两个网页对应的分块进行颜色传递，获得颜色传递结果；对所述颜色传递结果进行校正，并根据校正结果进行网页重构。在本发明实施例中，通过用户指定待重构的网页(目标网页)和用户想要重构成的参考网页，利用本文的重构方法，可以使得重构后的网页具有参考网页的颜色特征，又保证了目标网页元素的对比度和可读性，简化设计人员在配色部分的工作。

Description

一种基于颜色传递的网页重构方法及其装置

技术领域

本发明涉及网页构建技术领域，尤其涉及一种基于颜色传递的网页重构方法及其装置。

背景技术

颜色作为用户对于一个网站观感的最直观感受，拥有一个好的配色对一个网站的建设是相当重要的。随着各种网页设计美学的普及，如何形成良好的网页配色成为目前网页设计的一个重点。颜色传递方法可以通过一系列的图像处理使得目标图片具有参考图片的颜色特征，利用颜色传递的这一特性可以对网页颜色重构进行指导：通过选取合适的参考网页，使得目标网页具有参考网页的颜色特征，达到配色要求。该方法作为图形学中经典的图像色彩迁移方法，可以将参考网页的色彩特征传递到目标网页中，使得目标网页拥有参考网页的色彩特征。传统的颜色传递对图片的相似度要求比较高，这对于参考网页的选择有很大的局限性，如果参考网页与目标网页的结构稍有不同，一般的颜色传递得出的传递效果都不会太好。

目前国内外有关网页重构的研究主要面向的是基于用户操作习惯的自适应或页面友好性优化的网页重构，或是针对不同显示设备的尺寸自适应网页重构，有关网页色彩的研究主要是从色彩来分析用户对网页的印象及观感，或是针对特定用户如色盲用户的网页配色的研究。

基于用户体验的网页重构方法的思想是结合用户的浏览习惯或用户本身的特征，将网页进行重构，使得重构的网页更贴合用户的使用习惯或其自身的操作特征。目前热门的基于用户体验的网页重构方法主要分为：基于用户行为预测的网页重构方法，基于用户体验预测的网页重构方法，基于用户交互障碍自适应的网页重构方法。

1、基于用户行为预测的网页重构方法

将整个网站通过基于状态图的方法分解成树形结构,根据作者提出的算法预测出用户在某个节点的状态下，下一步最有可能访问的节点；然后抽取出这个节点的DOM树结构，将这个节点作为用户下一步操作的第一个显示页面。

虽然实现起来简便直观，但其并没有考虑到页面中的非交互性元素如图片、文本、影像等，这样一方面破坏了原有的网页结构，另一方面也遗漏掉了一些本应该参与显示的元素。

2、基于用户交互体验预测的网页重构方法

用户对于网站的体验在很大程度上受到其对网页第一印象的影响。Reinecke等人提出了一种通过计算网页色彩复杂度，建立一个预测用户对网页第一印象模型的网页色彩评估方法，从网页色彩的角度提出了一种提升用户对于网页第一印象的方法。他们的方法首先将网页从彩度和视觉复杂度两个方面进行分析，预测出让大多素用户对网页印象好的界面。该方案成本高，而且灵活性不强。

3、基于用户交互障碍自适应的网页重构方法

这种方法主要针对色盲人群的网页颜色重构方法。该方法相比于传统的面向色盲用户的网页色彩设计而言具有更真实的观感。他们将用户对于色彩的主管因素考虑进来，建立了一种模拟用户对于色彩主观反映的模型。他们的方法首先抽取出CSS文件中所定义的颜色。之后，针对色盲、色弱患者的特点，作者提出将CSS文件中提取出来的色彩用二原色-三原色等效平面上的色彩进行替换。在获取了每个可替换颜色集的总代价之后，文章使用两次爬山算法得出最优解。通过上述的源色彩-替换色彩的映射生成步骤后，源CSS文件中的每个色彩值将被替换成十六进制的六位替换色彩值。新生成的网页将具备替换色彩的颜色特征，从而达到适应于色盲用户的目的。这种现有方法更适合于色盲用户，但这种方法的局限性在于现代网页设计中，有很大一部分的色彩是由图片直接作为背景而实现的，并没有在CSS文件中定义，导致实际重构的效果并不好。而且，这种重构方法仅适用于特定的人群，不具有广泛性。

发明内容

本发明的目的在于克服现有技术的不足，本发明提供了一种基于颜色传递的网页重构方法及其装置，可以减少大部分元素的配色设计，极大地缩短了整个设计周期，而且减少了对用户对色彩方面的专业要求。

为了解决上述问题，本发明提出了一种基于颜色传递的网页重构方法，所述方法包括：

获取任意两个网页的网页元素信息，对所述网页元素信息进行聚类评估，获得评估结果；

获取所述任意两个网页的分块，根据所述评估结果对所述任意两个网页对应的分块进行颜色传递，获得颜色传递结果；

对所述颜色传递结果进行校正，并根据校正结果进行网页重构。

优选地，所述对所述网页元素信息进行聚类评估，获得评估结果的步骤包括：

对单个网页的网页元素信息进行聚类评估，获得每个网页的聚类评估结果；

对不同网页的聚类评估结果进行页间匹配评估。

优选地，所述对所述颜色传递结果进行校正的步骤，包括：

检查结果元素中是否含有特殊元素，若含有，检查结果元素对应的参考网页的匹配元素中是否含有同类特殊元素的定义，若有，覆盖结果元素，否则用目标网页中的定义覆盖结果元素；

若不含有特殊元素，则从结果元素中进行多次色彩随机抽样，取抽样结果均值avgRes；

从匹配元素中取得对应元素的CSS色彩定义，记为standard；

对比avgRes与standard的偏差，若偏差大于5％，用standard覆盖传递结果，否则保留原结果。

相应地，本发明还提供一种基于颜色传递的网页重构装置，所述装置包括：

聚类评估模块，用于获取任意两个网页的网页元素信息，对所述网页元素信息进行聚类评估，获得评估结果；

颜色传递模块，用于获取所述任意两个网页的分块，根据所述评估结果对所述任意两个网页对应的分块进行颜色传递，获得颜色传递结果；

网页重构模块，用于对所述颜色传递结果进行校正，并根据校正结果进行网页重构。

优选地，所述聚类评估模块包括：

聚类单元，用于对单个网页的网页元素信息进行聚类评估，获得每个网页的聚类评估结果；

评估单元，用于对不同网页的聚类评估结果进行页间匹配评估。

优选地，所述网页重构模块包括：

校正单元，用于对所述颜色传递结果进行校正；

重构单元，用于根据校正结果进行网页重构。

优选地，所述校正单元还用于检查结果元素中是否含有特殊元素，若含有，检查结果元素对应的参考网页的匹配元素中是否含有同类特殊元素的定义，若有，覆盖结果元素，否则用目标网页中的定义覆盖结果元素；若不含有特殊元素，则从结果元素中进行多次色彩随机抽样，取抽样结果均值avgRes；从匹配元素中取得对应元素的CSS色彩定义，记为standard；对比avgRes与standard的偏差，若偏差大于5％，用standard覆盖传递结果，否则保留原结果。

在本发明实施例中，通过用户指定待重构的网页(目标网页)和用户想要重构成的参考网页，利用本文的重构方法，可以使得重构后的网页具有参考网页的颜色特征，又保证了目标网页元素的对比度和可读性，简化设计人员在配色部分的工作。

附图说明

为了更清楚地说明本发明实施例或现有技术中的技术方案，下面将对实施例或现有技术描述中所需要使用的附图作简单地介绍，显而易见地，下面描述中的附图仅仅是本发明的一些实施例，对于本领域普通技术人员来讲，在不付出创造性劳动的前提下，还可以根据这些附图获得其它的附图。

图1是本发明实施例的基于颜色传递的网页重构方法的流程示意图；

图2是本发明实施例中元素的邻居示意图；

图3是本发明实施例中网页元素聚类的过程示意图；

图4是本发明实施例中元素匹配评估的过程示意图；

图5是本发明实施例中网页元素传递校正的过程示意图；

图6是本发明实施例的基于颜色传递的网页重构装置的结构组成示意图。

具体实施方式

下面将结合本发明实施例中的附图，对本发明实施例中的技术方案进行清楚、完整地描述，显然，所描述的实施例仅仅是本发明一部分实施例，而不是全部的实施例。基于本发明中的实施例，本领域普通技术人员在没有作出创造性劳动前提下所获得的所有其他实施例，都属于本发明保护的范围。

图1是本发明实施例的基于颜色传递的网页重构方法的流程示意图，如图1所示，该方法包括：

S101，获取任意两个网页的网页元素信息，对网页元素信息进行聚类评估，获得评估结果；

S102，获取任意两个网页的分块，根据评估结果对任意两个网页对应的分块进行颜色传递，获得颜色传递结果；

S103，对颜色传递结果进行校正，并根据校正结果进行网页重构。

在本发明实施例中，网页元素信息主要包括元素的位置(x,y坐标)、宽度与高度、类型、父元素ID等等。采用了CSSBox工具用来获取网页元素信息并存入数据库中，方便之后的网页信息处理模块对网页信息处理。

S101进一步包括：

对单个网页的网页元素信息进行聚类评估，获得每个网页的聚类评估结果；

对不同网页的聚类评估结果进行页间匹配评估。

在获取到网页元素信息后，首先对网页内的元素进行聚类评估。这样对于同一类的元素，只需要进行统一的评估即可，通过聚类可以减少后续的匹配评估的计算代价。此外，元素的聚类也可用于后续的校对工作中。

对于元素的聚类，通过比较元素的类型、大小、元素的邻居，HTML结构来实现聚类(详见表1)。

表1两个元素的聚类条件表

元素的类型对比是通过比较两个元素的HTML定义中所属的HTML类型是否相同实现的，如果两个元素的类型不同，两者不属于同一聚类，如果元素属于特殊类型如img,text,link等，也不参与聚类。将类型相同的元素标记为E_{toBeClustreed}供后续聚类评估。

E_{toBeClustreed}＝{e|e.type≠(text,img,link),e∈E}

元素的邻居：对于两个元素a和b，a.position＝(xa,ya)，b.position＝(xb,yb)，a和在同一X轴(或者Y轴)上，而且两者间没有其它元素的话，则a和是X(或Y)上的邻居，记为neighbor(a,b)。

(({e|((y_b＜e.position.y＜y_a)∨(y_a＜e.position.y＜y_b))}＝φ)

∧(x_a＝x_b)∨((y_a＝y_b)

∧{e|((x_b＜e.position.x＜x_a)∨(x_a＜e.position.x＜x_b))}＝φ)

→neighbor(a,b)

相应的，按照A,B的相对位置可以分为上下左右四个方向的邻居，如图2所示。

对于两个待评估的元素而言，若两者具有相似的邻居分布(包括邻居的大小、类型、位置)，这两者的聚类程度更高。

元素的大小指的是两个待聚类评估的元素之间的长与宽的比较，若两个元素长宽均相同，则两个元素在大小条件下的评分是满分。

元素的色彩对比是通过抽取元素所在的CSS文件中background:color的定义来进行的对比。由于网页设计的特点，同一聚类中的元素的背景色不会相差太大，因此可以对比两个元素的RGB各通道值间的欧氏距离来判断两个元素背景色彩的相似度。规定阈值为10，距离在10内的认为两个元素在色彩上的评分是100分，超过10则为0分。

元素的HTMLDOM树中的父节点是否一样，如果一样的话，两个元素属于同一聚类的可能性较大；如果两个元素的父节点不同，则对比两个元素的父节点是否同类，以及对比兄弟节点的相似度。除此之外，考虑到后续重构部分是对元素的CSS文件作修改的，因此如果两个元素属于同一个CSS类，则无论前述条件下的判断如何，都认为这两个元素属于同一聚类，应采用一致操作。

网页元素的聚类流程如下：

步骤1：定义聚类评估得分score＝0，判断两个网页元素的所在的CSS类是否相同，如果CSS类相同，score＝100，跳转到STEP7,否则，执行步骤2；

步骤2：定义类型评估得分tScore＝0，tScore＝100，否则，tScore＝0；

步骤3:定义尺寸评估得分sScore＝0，利用前述的尺寸评估方法得到sScore；

步骤4:HTML评估得分hScore＝0，对比两个元素的parentID对应元素的类型、大小，根据相似度得出hScore；

步骤5:利用WebpageElemUtil中的邻居评估方法得到邻居评估得分nScore；

步骤6:利用score＝0.2^*tScore+0.4^*sScore+0.1^*hScore+0.1^*nScore计算出聚类评估总分；

步骤7:判断最终得分是否小于60，若小于60，则两个元素不属于同一聚类，若不小于60，则两个元素属于同一聚类。

根据聚类结果进行匹配评估，具体评估流程为：首先比较两个待评估元素的类型是否属于同类。从大小比例、位置、HTML结构以及邻居等四个方面对两个元素的相似度进行匹配评估。

由于匹配算法对于每一个聚类中的元素是看作相同的，因此在聚类时，每个条件都是严格的。理论上说应该保证每个元素严格符合每个条件才能聚类，考虑到HTML设计时设计人员的代码误差，定义数值比较下的误差值不能大于5％，在5％以内则以偏差量来给予其评分，这个值是通过以往实验的经验得出的。

具体评分的计算方法为：

$score=\left\{\begin{array}{cc}100-40*offset/5\%& \left(-5\%\≤offset\≤5\%\right)\\ 0& \left(else\right)\end{array}\right.$

其中，offset的计算方式为：

$offset=\frac{|x^{\′}-x|}{x}$

即表示值x'与值x的偏差。

在通过上述的评估后，根据每个条件下的评分进行综合评估，最后给出两个元素聚类评估结果。整体流程如图3所示。

在对每个网页的元素完成聚类后，对两个网页进行匹配评估，在进行匹配评估时，需要同时考虑每个聚类中的单个元素间的匹配评估，和以聚类为单位进行的整体评估，评估结果取两种情况下较高的得分。

根据元素的特征抽取出的条件提取出匹配评估条件，并对每个条件进行定义，其中元素的邻居判断方法与聚类中的邻居判断方法相同，各个条件的定义如表2所示。

表2两个元素的匹配评估条件表

元素的类型：通过对网页元素的统计发现，一般从主观上认为可以匹配得上的元素在很多情况下均具有相似的类型，将常见且具有重构可能的HTML设计中的类型提取出来按相似度聚类得到了表3，其中，如果两个元素类型是特殊类则必须相同才能匹配。同一聚类中的类型是相似的，不同聚类中的类型在类型匹配评估时匹配度很低。

表3元素的类型聚类表

类型聚类	类型
		功能类	<button>,<link>
容器类	<div>,<span>,<nav，<section>,<aside>
		列表类	<list>,<ul>,<ol>
表单类	<form>,<table>
		特殊类	<header>,<footer>

在考虑两个元素是否可进行颜色传递时，需要考虑两个元素的大小差距。在比较两个元素的大小时，一方面比较两个元素的长宽是否相近；另一方面，在其他条件得分均较高而元素长宽大小差距较大时，比较两个元素的长宽比例是否相近,具体比较公式为：

$sizeComp=80*\frac{{\mathrm{width}}^{,}/{\mathrm{height}}^{,}}{{\mathrm{width}}_0/{\mathrm{height}}_0}+10*{\mathrm{width}}^{,}/{\mathrm{width}}_0+10*{\mathrm{height}}^{,}/{\mathrm{height}}_0$

其中，width',height'指的是目标网页的元素宽度和长度，width₀,height₀指的是参考网页的元素宽度和长度；元素的大小是决定是否进行颜色传递的主要因素。

聚类算法还需要比较元素的HTML结构，元素的HTML结构一方面指的是元素所在DOM树中节点的位置以及DOM树的结构，在计算两个元素的匹配度时候，如果两个元素的DOM树结构越类似，两者在结构上的得分越高；另一方面，元素的HTML结构也指元素父节点的类型如<div>,<li>等。进行匹配评估时，以两个元素的DOM结构匹配评估为主。

在考虑影响元素分类的条件时，元素的位置关系是不可忽略的因素。元素的位置可以通过其在页面中以左上角为基点以右、下为正方向的坐标轴中的绝对坐标值确定，也可以通过元素与标志性元素如页头，大标题等元素的相对位置来确定。如果两个元素在各自的页面中具有相近的位置，则两者的匹配程度较高，具体的比较方式为：

posComp＝50*(x'/x₀+y'/y₀)

通过上述的匹配评估步骤后，可以得出从目标网页到源网页的颜色传递匹配元素对，将匹配好的元素信息存入数据库中，供后面的颜色传递算法使用。整个评估步骤为：首先比较两个待评估元素的类型是否属于同类。之后从大小比例，位置，HTML结构以及邻居等四个方面对两个元素的相似度进行匹配评估，具体流程如图4所示。

在对目标网页和源网页的元素进行匹配评估后，将匹配的结果存入数据库中，供后续颜色传递调用。

在将两个网页的元素进行完匹配评估后，即可对网页进行颜色传递。由于本文采用的颜色传递方法是直接针对图片进行操作，故而需要先获取两个网页的截图。之后根据匹配信息对截图的对应区域进行提取，将提取后的图片进行颜色传递。

颜色传递算法的选择主要考虑以下几个因素：

选择颜色传递算法首先考虑的是时间复杂度，由于基于颜色传递的网页重构方法是轻量级的方法，对资源的依赖不宜过大，而且由于在网页重构的过程中还有颜色校正的步骤，因此对于运算速度快而且可以产生较能接受的传递结果的颜色传递算法，相比运算速度慢而结果好的算法而言更适合于网页重构方法。

在颜色传递时，如果两个图片的色彩差距相当大时，可能产生传递结果的色彩与实际欲传递结果的色彩相差很大的情况，虽然可以在校正步骤中解决失真的情况，但是校正步骤耗时长，计算代价大，应尽可能减少校正步骤，因此在选择颜色传递算法时，如果对网页传递产生较大色彩失真的算法不应采纳。

如果待传递的两个图片结构差距很大时，容易产生图片噪声，图片噪声主要表现在结果图出现纹理上的模糊、多出不期望的色彩、结果图结构改变等，因此采用的颜色传递算法应尽量减少噪声的产生。

有的颜色传递算法虽然能够产生较好的传递结果，但是一般这类算法要求较多次的迭代以及输入参数，从用户使用的角度而言，应尽可能地简化颜色传递的步骤。

通过对比图片失真情况和图像噪声的大小，采用基于颜色统计的颜色传递算法，因为它比较适合于网页元素分块截图间的颜色传递，而且匹配好了的网页元素具有结构相似，色彩分布简单的特点，用该算法可以得到较好的传递效果而且操作时间快。

虽然颜色传递可以对整幅网页的截图产生一个传递结果，但是从实际操作来看，直接以整幅图片为单位来进行颜色传递的话产生出的效果并不好。但是从实际的网页设计中发现，除了以背景图片作为图片色彩表现的情况外，一般的单个网页元素以background形式来表现的话其色彩是单一的，因此考虑将网页截图按照单个元素为单位进行颜色传递。通过实际操作发现，这样的传递方式效果较好。

进一步地，对颜色传递结果进行校正的步骤，包括：

检查结果元素中是否含有特殊元素，若含有，检查结果元素对应的参考网页的匹配元素中是否含有同类特殊元素的定义，若有，覆盖结果元素，否则用目标网页中的定义覆盖结果元素；

若不含有特殊元素，则从结果元素中进行多次色彩随机抽样，取抽样结果均值avgRes；

从匹配元素中取得对应元素的CSS色彩定义，记为standard；

对比avgRes与standard的偏差，若偏差大于5％，用standard覆盖传递结果，否则保留原结果。

具体实施中，在通过了两个网页截图间的颜色传递后，将传递结果传输到网页重构模块中，网页重构模块的功能主要包括对颜色传递结果的校正与根据校正结果的网页重构。在重构的时候主要需要注意两个问题：首先，特殊HTML元素不参与颜色传递，直接借鉴参考网页的元素定义；其次，被覆盖的元素变色后应该还原。考虑到颜色传递结果本身的误差以及网页本身包含的特殊元素，需要对颜色传递结果进行校对。校正步骤主要包括传递结果的校正和特殊元素的校正。校正过程如图5所示。

针对传递结果，首先从参考网页获取对应匹配元素的CSS色彩定义作为标准，之后对传递结果中的元素色彩进行多次随机取样，将取样平均值与标准值进行对比，如果误差值在5％以内则认为传递结果正确，否则将标准值作为最终结果值。其次是对于特殊元素的校正，首先查看传递结果中的元素是否含有特殊元素，如果含有特殊元素的话，查看匹配元素中有关该类特殊元素的定义，若匹配元素中没有该类特殊元素的定义，则保留原始的特殊元素定义，既不做颜色传递的修改也不用参考网页的元素定义覆盖；若匹配元素中有该类元素的定义，则采用匹配元素中的定义作为最终结果。

由于网页元素的设计通常具有只会对一个元素定义一种背景色的特性，对于每个传递后的网页元素只需要获取到修改后的色彩结果对原始的色彩定义进行覆盖即可，而不用担心会出现多个色彩同时覆盖到一个元素的情况，因此对于结果图而言，只需要对相应的元素区域进行抽样取色即为待重构成为的色彩。

考虑到网页设计中可能出现元素重叠导致在颜色传递时出现传递错误的问题，对于每个元素的色彩需要通过随机取样的方式抽取五份色彩，找出其中频率较大的色彩，并与同一聚类中的其他元素找出的色彩对比，取频率最高的作为这个聚类中所有元素的重构色彩。这是因为一方面有可能因为元素重叠导致原来的元素出现了多种色彩导致单次取样的结果不准，另一方面原始的元素本身有可能包含其他色彩如字体的颜色等，也需要采用随机抽样来避免。

对于特殊的HTML元素，采用的重构方式是直接调用参考网页中相应的元素的CSS色彩定义。如果参考网页中没有找到相应的元素，则查看重构后的色彩与元素的色彩是否相近，如果相近的话则将元素的色彩改为重构色彩的补色，否则保持原有元素的色彩不变。

相应地，本发明实施例还提供一种基于颜色传递的网页重构装置，如图6所示，该装置包括：

聚类评估模块1，用于获取任意两个网页的网页元素信息，对网页元素信息进行聚类评估，获得评估结果；

颜色传递模块2，用于获取任意两个网页的分块，根据评估结果对任意两个网页对应的分块进行颜色传递，获得颜色传递结果；

网页重构模块3，用于对颜色传递结果进行校正，并根据校正结果进行网页重构。

进一步地，聚类评估模块1包括：

聚类单元，用于对单个网页的网页元素信息进行聚类评估，获得每个网页的聚类评估结果；

评估单元，用于对不同网页的聚类评估结果进行页间匹配评估。

网页重构模块3包括：

校正单元，用于对颜色传递结果进行校正；

重构单元，用于根据校正结果进行网页重构。

校正单元还用于检查结果元素中是否含有特殊元素，若含有，检查结果元素对应的参考网页的匹配元素中是否含有同类特殊元素的定义，若有，覆盖结果元素，否则用目标网页中的定义覆盖结果元素；若不含有特殊元素，则从结果元素中进行多次色彩随机抽样，取抽样结果均值avgRes；从匹配元素中取得对应元素的CSS色彩定义，记为standard；对比avgRes与standard的偏差，若偏差大于5％，用standard覆盖传递结果，否则保留原结果。

本发明的装置实施例中各功能模块的功能可参见本发明方法实施例中的流程处理，这里不再赘述。

通过输入元素信息、网页截图、网页CSS文件，对输入的元素信息进行页内元素聚类评估和页间元素匹配评估，与处理得到的网页分块截图进行颜色传递，再与输入的网页CSS文件进行颜色校正，校正完成之后进行网页重构；一方面降低了网页设计人员对配色知识的要求，另一方面从直观的角度将目标网页的配色风格应用于目标网页上，产生目标网页的配色风格与目标网页相近的效果。用户可以直观地选择参考网页，使得用户自己的网页具有参考网页的配色特征。整个过程中用户只需选择与自己的网页结构相近的参考网页，对自己的网页和参考网页进行截图，即可进行网页重构，整个过程不需要用户进行其他操作即可获取重构结果，而且操作简单，运算速度快，在两个网页结构相似时，产生的重构结果尤为明显。

另外，对操作者的配色知识并没有较高要求，只需要用户选择自己想要拥有的颜色特征的网页即可进行自动的重构。可以减少大部分元素的配色设计，只需对自身网页中的部分图片进行重新设计即可，极大地缩短了整个设计周期，而且减少了对用户对色彩方面的专业要求。

本领域普通技术人员可以理解上述实施例的各种方法中的全部或部分步骤是可以通过程序来指令相关的硬件来完成，该程序可以存储于一计算机可读存储介质中，存储介质可以包括：只读存储器(ROM，ReadOnlyMemory)、随机存取存储器(RAM，RandomAccessMemory)、磁盘或光盘等。

另外，以上对本发明实施例所提供的基于颜色传递的网页重构方法及其装置进行了详细介绍，本文中应用了具体个例对本发明的原理及实施方式进行了阐述，以上实施例的说明只是用于帮助理解本发明的方法及其核心思想；同时，对于本领域的一般技术人员，依据本发明的思想，在具体实施方式及应用范围上均会有改变之处，综上所述，本说明书内容不应理解为对本发明的限制。

Claims (7)

1.一种基于颜色传递的网页重构方法，其特征在于，所述方法包括：

获取任意两个网页的网页元素信息，对所述网页元素信息进行聚类评估，获得评估结果；

获取所述任意两个网页的分块，根据所述评估结果对所述任意两个网页对应的分块进行颜色传递，获得颜色传递结果；

对所述颜色传递结果进行校正，并根据校正结果进行网页重构。

2.如权利要求1所述的基于颜色传递的网页重构方法，其特征在于，所述对所述网页元素信息进行聚类评估，获得评估结果的步骤包括：

对单个网页的网页元素信息进行聚类评估，获得每个网页的聚类评估结果；

对不同网页的聚类评估结果进行页间匹配评估。

3.如权利要求1所述的基于颜色传递的网页重构方法，其特征在于，所述对所述颜色传递结果进行校正的步骤，包括：

检查结果元素中是否含有特殊元素，若含有，检查结果元素对应的参考网页的匹配元素中是否含有同类特殊元素的定义，若有，覆盖结果元素，否则用目标网页中的定义覆盖结果元素；

若不含有特殊元素，则从结果元素中进行多次色彩随机抽样，取抽样结果均值avgRes；

从匹配元素中取得对应元素的CSS色彩定义，记为standard；

对比avgRes与standard的偏差，若偏差大于5％，用standard覆盖传递结果，否则保留原结果。

4.一种基于颜色传递的网页重构装置，其特征在于，所述装置包括：

聚类评估模块，用于获取任意两个网页的网页元素信息，对所述网页元素信息进行聚类评估，获得评估结果；

颜色传递模块，用于获取所述任意两个网页的分块，根据所述评估结果对所述任意两个网页对应的分块进行颜色传递，获得颜色传递结果；

网页重构模块，用于对所述颜色传递结果进行校正，并根据校正结果进行网页重构。

5.如权利要求4所述的基于颜色传递的网页重构装置，其特征在于，所述聚类评估模块包括：

聚类单元，用于对单个网页的网页元素信息进行聚类评估，获得每个网页的聚类评估结果；

评估单元，用于对不同网页的聚类评估结果进行页间匹配评估。

6.如权利要求4所述的基于颜色传递的网页重构装置，其特征在于，所述网页重构模块包括：

校正单元，用于对所述颜色传递结果进行校正；

重构单元，用于根据校正结果进行网页重构。

7.如权利要求6所述的基于颜色传递的网页重构装置，其特征在于，所述校正单元还用于检查结果元素中是否含有特殊元素，若含有，检查结果元素对应的参考网页的匹配元素中是否含有同类特殊元素的定义，若有，覆盖结果元素，否则用目标网页中的定义覆盖结果元素；若不含有特殊元素，则从结果元素中进行多次色彩随机抽样，取抽样结果均值avgRes；从匹配元素中取得对应元素的CSS色彩定义，记为standard；对比avgRes与standard的偏差，若偏差大于5％，用standard覆盖传递结果，否则保留原结果。