CN108959542A - 一种新型自定义网页生成方法及装置 - Google Patents

Abstract

本发明公开了一种新型自定义网页生成方法及装置，包括：获取原网页的初始主色值、若干个初始颜色值和用户自定义的目标主色值，主色值为网页所有像素点的颜色中比例最高的颜色的颜色值；根据该初始主色值、该目标主色值以及该若干个初始颜色值，分别确定该若干个初始颜色值各自对应的目标颜色值，其中，该目标颜色值与该初始颜色值和该目标主色值的乘积正相关、且与该初始主色值负相关；使用该若干个目标颜色值，生成与用户自定义的该目标主色值对应的网页。采用本发明实施例提供的方法，与现有技术相比，避免了网站开发者预先设置多个网页模板，自定义网页生成更加灵活。

Description

一种新型自定义网页生成方法及装置

技术领域

本发明涉及互联网技术领域，尤其涉及一种新型自定义网页生成方法及装置。

背景技术

目前，互联网技术日新月异，用户对网页主题的自定义需求越来越高。现 有的网页自定义方法主要有以下三种，

第一种，网站预定义了多种主题模板供用户选择，当用户选择不同模板时， 主要改变的是网页的页面结构，即网页中各个模块的位置发生变化，在各模块 位置发生变化的同时，各模块的背景颜色或背景图片也有可能改变。但各模块 的位置关系及相应的各模块的背景颜色或背景图片均是网站预先定义的。

第二种，用户对网页中某个区域的颜色进行设置，网站服务器端根据用户 的设置将相应的区域颜色设定为用户指定的颜色。

第三种，网站开发者利用浏览器的滤镜功能，在源代码中添加相应的代码 对网页显示效果进行控制。该方式针对的是网站开发者对网页的控制，并不能 针对用户对网页的自定义。

综上所述，现有的针对用户的网页自定义方法，主要是用户对网站预定义 的多种可选择的模板或者颜色进行选择，网站针对用户的选择生成相应的网 页，将网页进行呈现。以上方案本质上均是静态的，需要网站开发者预先设置 模板，人工预设比较麻烦，并且供用户可选择的模板是有限的，无法满足用户 自定义的需求，因此，现有的自定义网页的方案还不够灵活。

发明内容

本发明实施例提供一种新型自定义网页生成方法及装置，用以解决现有技术中存在的自定义网页设置不够灵活、需要网站开发者预先设置网页模板的问题。

本发明实施例提供一种新型自定义网页生成方法，包括：获取原网页的初始主色值、若干个初始颜色值和用户自定义的目标主色 值，主色值为网页所有像素点的颜色中比例最高的颜色的颜色值；

根据所述初始主色值、所述目标主色值以及所述若干个初始颜色值，分别 确定所述若干个初始颜色值各自对应的目标颜色值，其中，所述目标颜色值与 所述初始颜色值和所述目标主色值的乘积正相关、且与所述初始主色值负相 关；

使用所述若干个目标颜色值，生成与用户自定义的所述目标主色值对应的 网页。

采用本发明实施例提供的方法，针对用户自定义的目标主色值，通过对原 网页若干个初始颜色进行颜色转换，得到若干个目标颜色值，使用该若干个目 标颜色值，生成与用户自定义的目标主色值对应的网页。因此，不再需要网站 开发者预先设定网页的多个模板，相比于现有技术，本方案提供的自定义网页 生成方法更加灵活。

相应的，本发明实施例还提供一种自定义网页生成装置，包括：

获取单元，用于获取原网页的初始主色值、若干个初始颜色值和用户自定 义的目标主色值，主色值为网页所有像素点的颜色中比例最高的颜色的颜色 值；目标颜色值确定单元，用于根据所述初始主色值、所述目标主色值以及所 述若干个初始颜色值，分别确定所述若干个初始颜色值各自对应的目标颜色 值，其中，所述目标颜色值与所述初始颜色值和所述目标主色值的乘积正相关、 且与所述初始主色值负相关；网页生成单元，用于使用所述若干个目标颜色值，生成与用户自定义的所 述目标主色值对应的网页。

本申请的其它特征和优点将在随后的说明书中阐述，并且，部分地从说明 书中变得显而易见，或者通过实施本申请而了解。本申请的目的和其他优点可 通过在所写的说明书、权利要求书、以及附图中所特别指出的结构来实现和获 得。

附图说明

附图用来提供对本发明的进一步理解，并且构成说明书的一部分，与本发 明实施例一起用于解释本发明，并不构成对本发明的限制。在附图中：

图1为本发明实施例提供的自定义网页生成方法的流程图之一；

图2为本发明实施例提供的自定义网页生成方法的流程图之二；

图3为本发明实施例提供的自定义网页生成装置的结构示意图。

具体实施方式

为了给出更灵活的自定义网页生成的实现方案，本发明实施例提供了一种 新型自定义网页生成方法及装置，以下结合说明书附图对本发明的优选实施例进行 说明，应当理解，此处所描述的优选实施例仅用于说明和解释本发明，并不用 于限定本发明。并且在不冲突的情况下，本申请中的实施例及实施例中的特征 可以相互组合。

本发明实施例提供一种新型自定义网页生成方法，如图1所示，包括：步骤101、获取原网页的初始主色值、若干个初始颜色值和用户自定义的 目标主色值，主色值为网页所有像素点的颜色中比例最高的颜色的颜色值。

步骤102、根据该初始主色值、该目标主色值以及该若干个初始颜色值， 分别确定该若干个初始颜色值各自对应的目标颜色值，其中，该目标颜色值与 该初始颜色值和该目标主色值的乘积正相关、且与该初始主色值负相关。

步骤103、使用该若干个目标颜色值，生成与用户自定义的该目标主色值 对应的网页。

上述方法中，主色值也可以称为主色调，在网页中统计所有像素点的颜色 中比例最高的颜色的颜色值，将该颜色值作为网页的主色值。用户自定义的目 标主色值，可以是用户输入的目标主色值包括的目标主色R值、目标主色G 值和目标主色B值，也可以是用户通过颜色模块选择的目标颜色的颜色值。

针对用户自定义的目标主色值，通过对原网页若干个初始颜色进行颜色转 换，得到若干个目标颜色值，使用该若干个目标颜色值，生成与用户自定义的 目标主色值对应的网页。因此，不再需要网站开发者预先设定网页的多个模板， 相比于现有技术，本方案提供的自定义网页生成方法可以自动、实时的生成用 户定制的网页，灵活性更强。

下面结合附图，用具体实施例对本发明提供的方法及装置和相应系统进行 详细描述。具体步骤如图2所示，包括：

步骤201、获取原网页的初始主色值、若干个初始颜色值和用户自定义的 目标主色值，主色值为网页所有像素点的颜色中比例最高的颜色的颜色值。

其中，本方案中所提到的颜色均为真彩色，所以主色值、颜色值等均包括 R值、G值、B值三个值。如初始主色值包括初始主色R值、初始主色G值和 初始主色B值，目标主色值包括目标主色R值、目标主色G值和目标主色B 值，每个初始颜色值包括初始R值、初始G值和初始B值。为了方便后续描 述，将原网页的初始主色值记为a（R，G，B），将用户自定义的目标主色值记 为b（R，G，B），若干个初始颜色值均用c（R，G，B）来表示。

原网页可能会有多个源代码文件，从原网页的多个源代码文件中，获取若 干个表示颜色的代码字段所表示的初始颜色值，该多个源代码文件，可以是 CSS文件，或者是HTML文件；除了在多个源代码文件中获取初始颜色值， 还需在原网页的多个图片文件中，获取若干个像素的初始颜色值；将在代码文 件以及图片文件中获取的若干个初始颜色值，作为原网页的若干个初始颜色 值。

步骤202、分别对初始主色值的初始主色R值、初始主色G值、初始主色 B值和目标主色值的目标主色R值、目标主色G值、目标主色B值按照数值 大小排序。

例如，初始主色值a（R，G，B），排序后为a（B）>a（G）>a（R），目 标主色值b（R，G，B），排序后为b（R）>b（B）>b（G）。

步骤203、针对每个初始颜色值，分别将该初始颜色值的初始R值、初始 G值和初始B值作为初始X值，执行如下步骤：

根据该初始颜色值的初始X值、初始主色X值和与该初始主色X值的大 小顺序位置相同的目标主色Y值，确定目标颜色值的目标Y值，其中，该目 标主色Y值为该目标主色R值、目标主色G值、目标主色B值之一，该目标 Y值与该初始X值和该目标主色Y值的乘积正相关、且与该初始主色X值负 相关。

进一步的，初始颜色值的初始X值、初始主色X值、目标颜色值的目标Y 值和目标主色Y值，满足如下关系式：

初始颜色值的初始X值/初始主色X值=目标颜色值的目标Y值/目标主色 Y值。

结合步骤202中的举例，可以得到如下三个关系式：

c（B）/a（B）=d（R）/b（R）；

c（G）/a（G）=d（B）/b（B）；

c（R）/a（R）=d（G）/b（G）；

分别将初始主色值的初始R值、初始G值、初始B值和目标主色值的目 标R值、目标G值、目标B值按照大小顺序排序，可以保证确定的若干个目 标颜色值更符合用户指定的目标主色值，与用户指定的目标主色值更加一致。

步骤204、通过上述关系式，确定d（R）、d（G）、d（B），即确定每个初 始颜色值对应的目标颜色值。

这样，对于原网页所有CSS、HTML代码文件中表示颜色字段的代码表示 的若干个初始颜色值，以及原网页所有的图片文件中若干个像素的初始颜色 值，均确定出与其对应的目标颜色值。

步骤205、使用该若干个目标颜色值，生成与用户自定义的目标主色值对 应的网页。

基于同一发明构思，根据本发明上述实施例提供的自定义网页生成方法， 相应地，本发明另一实施例还提供了自定义网页生成装置，应用于用户终端， 装置结构示意图如图3所示，具体包括：

获取单元301，用于获取原网页的初始主色值、若干个初始颜色值和用户 自定义的目标主色值，主色值为网页所有像素点的颜色中比例最高的颜色的颜 色值；

目标颜色值确定单元302，用于根据该初始主色值、该目标主色值以及该 若干个初始颜色值，分别确定该若干个初始颜色值各自对应的目标颜色值，其 中，该目标颜色值与该初始颜色值和该目标主色值的乘积正相关、且与该初始 主色值负相关；

网页生成单元303，用于使用该若干个目标颜色值，生成与用户自定义的 该目标主色值对应的网页。

进一步的，获取单元301，获取原网页的若干个初始颜色值，具体用于在 原网页的代码文件中，获取若干个表示颜色的代码字段所表示的初始颜色值， 以及在该原网页的图片文件中，获取若干个像素的初始颜色值，作为原网页的 若干个初始颜色值。

进一步的，获取单元301，具体用于在原网页的CSS代码文件中，获取若 干个表示颜色的代码字段对应的初始颜色值，以及在原网页的HTML代码文 件中，获取若干个表示颜色的代码字段对应的初始颜色值。

进一步的，初始主色值包括初始主色R值、初始主色G值和初始主色B 值，该目标主色值包括目标主色R值、目标主色G值和目标主色B值，每个 初始颜色值包括初始R值、初始G值和初始B值；

目标颜色值确定单元302，根据该初始主色值、该目标主色值以及该若干 个初始颜色值，确定该若干个初始颜色值各自对应的目标颜色值，具体用于： 分别对该初始主色值的初始主色R值、初始主色G值、初始主色B值和该目 标主色值的目标主色R值、目标主色G值、目标主色B值按照数值大小排序；

针对每个初始颜色值，分别将该初始颜色值的初始R值、初始G值和初 始B值作为初始X值，执行如下步骤：

根据该初始颜色值的初始X值、该初始主色X值和与该初始主色X值的 大小顺序位置相同的目标主色Y值，确定该目标颜色值的目标Y值，其中， 该目标主色Y值为该目标主色R值、目标主色G值、目标主色B值之一，该 目标Y值与该初始X值和该目标主色Y值的乘积正相关、且与该初始主色X 值负相关。

进一步的，初始颜色值的初始X值、该初始主色X值、该目标颜色值的 目标Y值和该目标主色Y值，满足如下关系式：

初始颜色值的初始X值/初始主色X值=目标颜色值的目标Y值/目标主色 Y值。

上述各单元的功能可对应于图1至图2所示流程中的相应处理步骤，在此 不再赘述。

综上所述，本发明实施例提供的方案，获取原网页的初始主色值、若干个 初始颜色值和用户自定义的目标主色值，主色值为网页所有像素点的颜色中比 例最高的颜色的颜色值；根据该初始主色值、该目标主色值以及该若干个初始 颜色值，分别确定该若干个初始颜色值各自对应的目标颜色值，其中，该目标 颜色值与该初始颜色值和该目标主色值的乘积正相关、且与该初始主色值负相 关；使用该若干个目标颜色值，生成与用户自定义的该目标主色值对应的网页。 采用本发明实施例提供的方法，与现有技术相比，避免了网站开发者预先设置 多个网页模板，自定义网页生成更加灵活。

本申请的实施例所提供的自定义网页生成装置可通过计算机程序实现。本 领域技术人员应该能够理解，上述的模块划分方式仅是众多模块划分方式中的 一种，如果划分为其他模块或不划分模块，只要自定义网页生成装置具有上述 功能，都应该在本申请的保护范围之内。

本申请是参照根据本申请实施例的方法、设备（系统）、和计算机程序产 品的流程图和／或方框图来描述的。应理解可由计算机程序指令实现流程图和 ／或方框图中的每一流程和／或方框、以及流程图和／或方框图中的流程和／ 或方框的结合。可提供这些计算机程序指令到通用计算机、专用计算机、嵌入 式处理机或其他可编程数据处理设备的处理器以产生一个机器，使得通过计算 机或其他可编程数据处理设备的处理器执行的指令产生用于实现在流程图一 个流程或多个流程和／或方框图一个方框或多个方框中指定的功能的装置。

这些计算机程序指令也可存储在能引导计算机或其他可编程数据处理设 备以特定方式工作的计算机可读存储器中，使得存储在该计算机可读存储器中 的指令产生包括指令装置的制造品，该指令装置实现在流程图一个流程或多个 流程和／或方框图一个方框或多个方框中指定的功能。

这些计算机程序指令也可装载到计算机或其他可编程数据处理设备上，使 得在计算机或其他可编程设备上执行一系列操作步骤以产生计算机实现的处 理，从而在计算机或其他可编程设备上执行的指令提供用于实现在流程图一个 流程或多个流程和／或方框图一个方框或多个方框中指定的功能的步骤。

显然，本领域的技术人员可以对本发明进行各种改动和变型而不脱离本发 明的精神和范围。这样，倘若本发明的这些修改和变型属于本发明权利要求及 其等同技术的范围之内，则本发明也意图包含这些改动和变型在内。

Claims (1)

1.一种新型自定义网页生成方法，其特征在于，包括：获取原网页的初始主色值、若干个初始颜色值和用户自定义的目标主色 值，主色值为网页所有像素点的颜色中比例最高的颜色的颜色值；根据所述初始主色值、所述目标主色值以及所述若干个初始颜色值，分别确定所述若干个初始颜色值各自对应的目标颜色值，其中，所述目标颜色值与所述初始颜色值和所述目标主色值的乘积正相关、且与所述初始主色值负相关；使用所述若干个目标颜色值，生成与用户自定义的所述目标主色值对应的网页。