CN103744942A - 网页浏览方法及装置、网页浏览终端设备 - Google Patents

Abstract

本发明提供了一种夜间模式下的网页浏览方法，在该方法中，将在夜间模式下进行网页加载时获取的网页元素的RGB色值转换为默认HSL色值（H_normal，S_normal，L_normal）；基于预定的转换规则，将所述默认HSL色值（H_normal，Snormal，Lnormal）转换为夜间模式HSL色值（Hni_ght，Sni_ght，Lni_ght）；将夜间模式HSL色值（Hni_ght，Sni_ght，Lni_ght）转换为夜间模式RGB色值；以及根据夜间模式RGB色值来对网页元素进行渲染显示。利用该方法，能够在夜间模式下，结合夜间模式的配色方案，通过获取原网页颜色元素进行分层次色彩转换来提高网页视觉界面结构的还原度。

Description

网页浏览方法及装置、网页浏览终端设备

技术领域

本发明涉及移动通信领域，更为具体地，涉及一种夜间模式下的网页浏览方法及装置，以及一种能够实现上述网页浏览方法的网页浏览终端设备。

背景技术

为了使得用户在晚上等光线比较弱的场景下更好地在移动终端上使用浏览器来进行网页浏览，现在大部分主流移动端浏览器都实现了夜间模式功能。所述夜间模式功能的实现主要包括两种方式。第一种现有方式是将整个浏览器界面(包括网页内容)统一降低明度，比如QQ手机浏览器、百度手机浏览器等。第二种现有方式是将浏览器界面和网页内容分开处理，浏览器界面使用夜间模式皮肤方案，同时将网页的背景色替换成低明度的颜色并将图片降低明度，比如UC优视公司的浏览器产品。图1示出了日间模式下的网页浏览时的所浏览的网页的显示效果图；图2示出了按照第一种现有方式实现的夜间模式下所浏览的网页的显示效果图；以及图3示出了按照第二种现有方式实现的夜间模式下所浏览的网页的显示效果图。

从图2和图3中示出的显示效果图可以看出，这两种实现方式都存在比较明显的缺陷。在第一种现有实现方式中，在转换成夜间模式后，由于是对浏览器界面和网页内容统一降低明度，使得移动终端的屏幕亮度降低，从而大大降低了网页内容的可读性，十分不利于用户在光线比较弱的环境下进行网页浏览。在第二种现有实现方式中，在转换成夜间模式后，虽然浏览器界面与网页背景以及图片的色彩都比较适于在夜间使用，但是对原网页的还原度太低，网页的结构和层次都表现得不好。

发明内容

鉴于上述，本发明提出了一种夜间模式下的网页浏览方法及装置，该方法及装置能够在夜间模式下，结合夜间模式的配色方案，通过获取原网页颜色元素进行分层次色彩转换来提高网页视觉界面结构的还原度。

本发明还提出了一种网页浏览终端设备，该网络浏览终端设备能够实现如上所述的夜间模式下的网页浏览。

根据本发明的一个方面，提供了一种夜间模式下的网页浏览方法，包括：当在夜间模式下进行网页加载时，获取所加载的网页的网页元素的RGB色值；将所获取的网页元素的RGB色值转换为默认HSL色值(H_normal，S_normal，L_normal)，所述HSL色值中的H表示色相，S表示饱和度，L表示明度；基于预定的转换规则，将所述默认HSL色值(H_normal，S_normal，L_normal)转换为夜间模式HSL色值(H_night，S_night，L_night)；将所述夜间模式HSL色值(H_night，S_night，L_night)转换为夜间模式RGB色值；以及根据所述夜间模式RGB色值来对所述网页元素进行渲染显示，其中，所述预定的转换规则包括：H_night设定为预定固定值，S_night与S_normal成正比关系，以及L_night与L_normal成反比关系。

在上述方面的一个或多个示例中，所述预定的转换规则为：H_night=A，A是预定固定值；S_night=S_min+S_normal×(S_max-S_min)；L_night=L_max-L_normal×(L_max-L_min)；其中，S_max是所定义的夜间模式的色值饱和度最大值，S_min是所定义的夜间模式的色值饱和度最小值，L_max是所定义的夜间模式的色值明度最大值，以及L_min是所定义的夜间模式的色值明度最小值。

在上述方面的一个或多个示例中，A=220，S_max=0.28，S_min=0.15，L_max=0.2以及L_min=0.07。

在上述方面的一个或多个示例中，RGB色值转换为HSL色值的转换公式包括：

M=max(R，G，B)；

m=min(R，G，B)；

C=M-m：

H=60×H′：

$L=\frac{1}{2}(M+m):$

在上述方面的一个或多个示例中，HSL色值转换为RGB色值的转换公式包括：

C=(1-|2L-1|)×S；

$H^{\′}=\frac{H}{60};$

X=C(1-|H′mod2-1|)；

$m=L-\frac{1}{2}C;$

(R，G，B)=(R′+m，G′+m，B′+m)。

根据本发明的另一方面，提供了一种网页浏览装置，包括：RGB色值获取单元，用于当在夜间模式下进行网页加载时，获取所加载的网页的网页元素的RGB色值；第一色值转换单元，用于将所获取的网页元素的RGB色值转换为默认HSL色值(Hnormal，Snormal，Lnormal)，所述HSL色值中的H表示色相，S表示饱和度，L表示明度；第二色值转换单元，用于基于预定的转换规则，将所述默认HSL色值(Hnormal，Snormal，Lnormal)转换为夜间模式HSL色值(Hnight，Snight，Lnight)，其中，所述预定的转换规则包括：Hnight设定为预定固定值，Snight与Snormal成正比关系，以及Lnight与Lnormal成反比关系；第三色值转换单元，用于将所述夜间模式HSL色值(Hnight，Snight，Lnight)转换为夜间模式RGB色值；以及渲染单元，用于根据所述夜间模式RGB色值来对所述网页元素进行渲染显示。

在上述的方面的一个或多个示例中，所述预定的转换规则为：Hnight=A，A是预定固定值；S_ni曲t=S_min+S_normal×(S_max-S_min)；L_night=L_max-L_normal×(L_max-L_min)；其中，S_max是所定义的夜间模式的色值饱和度最大值，S_min是所定义的夜间模式的色值饱和度最小值，L_max是所定义的夜间模式的色值明度最大值，以及L_min是所定义的夜间模式的色值明度最小值。

在上述方面的一个或多个示例中，优选地，A=220，S_max=0.28，S_min=0.15，L_max=0.2以及L_min=0.07。

根据本发明的另一方面，提供了一种网页浏览终端设备，包括：显示单元，用于显示网页数据；存储单元；以及一个或多个处理器，被配置为执行如上所述的网页浏览方法来渲染网页数据，以供显示单元显示。

利用上述方法及装置，通过将网页元素的RGB色值转换为默认HSL色值，并且按照预定规则将默认HSL色值转换为夜间模式HSL色值，而后转换回RGB色值来赋予网页元素进行渲染显示，能够在夜间模式下，结合夜间模式的配色方案，通过获取原网页颜色元素进行分层次色彩转换来提高网页视觉界面结构的还原度。

为了实现上述以及相关目的，本发明的一个或多个方面包括后面将详细说明并在权利要求中特别指出的特征。下面的说明以及附图详细说明了本发明的某些示例性方面。然而，这些方面指示的仅仅是可使用本发明的原理的各种方式中的一些方式。此外，本发明旨在包括所有这些方面以及它们的等同物。

附图说明

根据下述参照附图进行的详细描述，本发明的上述和其他目的、特征和优点将变得更加显而易见。在附图中：

图1示出了日间模式下的网页浏览时的所浏览的网页的显示效果图；

图2示出了按照第一种现有方式实现的夜间模式下所浏览的网页的显示效果图；

图3示出了按照第二种现有方式实现的夜间模式下所浏览的网页的显示效果图；

图4示出了根据本发明的实施例的夜间模式下的网页浏览终端设备的方框示意图；

图5示出了根据本发明的实施例的夜间模式下的网页浏览方法的流程图；和

图6示出了根据本发明的实施例的网页浏览方法实现的夜间模式下所浏览的网页的显示效果图。

在所有附图中相同的标号指示相似或相应的特征或功能。

具体实施方式

下面描述本公开的各个方面。应该明白的是，本文的教导可以以多种多样形式具体体现，并且在本文中公开的任何具体结构、功能或两者仅仅是代表性的。基于本文的教导，本领域技术人员应该明白的是，本文所公开的一个方面可以独立于任何其它方面实现，并且这些方面中的两个或多个方面可以按照各种方式组合。例如，可以使用本文所阐述的任何数目的方面，实现装置或实践方法。另外，可以使用其它结构、功能、或除了本文所阐述的一个或多个方面之外或不是本文所阐述的一个或多个方面的结构和功能，实现这种装置或实践这种方法。此外，本文所描述的任何方面可以包括权利要求的至少一个元素。

下面将参照附图描述本发明的实施例。

图4示出了根据本发明的实施例的夜间模式下的网页浏览终端设备1的方框示意图。所述网页浏览终端设备1可以是任何具有网页浏览能力的终端设备，包括台式计算机、笔记本电脑、智能移动终端、苹果公司或其它公司生产的IPad产品、个人数据助理等。

如图4所示，网页浏览终端设备1包括网页浏览装置10、存储单元20以及显示单元30。网页浏览装置10可以包括RGB色值获取单元110、第一色值转换单元120、第二色值转换单元130、第三色值转换单元140和渲染单元1 50。

RGB色值获取单元110用于当在夜间模式下进行网页加载时，获取所加载的网页的网页元素的RGB色值。例如，当浏览器获取该网页的网页数据进行网页加载时，可以获取该网页的各组成网页元素的RGB色值，比如HTML、CSS元素的RGB色值。

在获得各个组成网页元素的RGB色值后，第一色值转换单元120用于将所获取的网页元素的RGB色值转换为默认HSL色值(Hnormal，Snormal，Lnormal)。这里，HSL颜色模式是一种颜色模型，其中H表示色相，S表示饱和度，L表示明度。

在本发明的一个示例中，第一色值转换单元120可以采用下述公式1来将网页元素的RGB色值转换为默认HSL色值(Hnormal，Snormal，Lnormal)。

M=max(R，G，B)；

m=min(R，G，B)；

C=M-m：

H=60×H′：

$L=\frac{1}{2}(M+m);$

在上述公式1中，H、L和S分别是HSL颜色模型中的色相、饱和度和明度，R、G和B是网页元素的RGB色值，其它变量是中间符号，没有特定含义。

上面给出的仅仅是将网页元素的RGB色值转换为默认HSL色值(Hnormal，Snormal，Lnormal)的一种实现方式。在本发明的其它示例中，也可以采用其它合适方式进行色值转换。

在如上获得默认HSL色值后，第二色值转换单元130基于预定的转换规则，将所述默认HSL色值(Hnormal，Snormal，Lnormal)转换为夜间模式HSL色值(Hnight，Snight，Lnight)，其中，所述预定的转换规则包括：Hnight设定为预定固定值，Snight与Snormal成正比关系，以及Lnight与Lnormal成反比关系。换言之，默认色值饱和度Snormal越高，夜间模式色值饱和度Snight越高。默认色值饱和度Snormal越低，夜间模式色值饱和度Snight越低。比如，在默认色值中，假设蓝色为A色值，灰色为B色值，蓝色笔灰色饱和度高，则转换夜间模式后，A色值转换的颜色比B色值转换的颜色饱和度高。反之，默认色值明度越高，夜间模式色值明度越低。默认色值明度越低，夜间模式色值明度越高。比如，在默认色值中，假设深灰色为A色值，浅灰色为B色值，深灰色的明度比浅灰色的明度低，则转换夜间模式后，A色值转换的颜色比B色值转换的颜色明度高。

在本发明的一个示例中，所述预定的转换规则可以为：H_night=A，A是预定固定值；S_ni曲t=S_min+S_normal×(S_max-S_min)；L_night=L_max-L_normal×(L_max-L_min)；其中，S_max是所定义的夜间模式的色值饱和度最大值，S_min是所定义的夜间模式的色值饱和度最小值，L_max是所定义的夜间模式的色值明度最大值，以及L_min是所定义的夜间模式的色值明度最小值。这里，夜间模式的色值饱和度在S_max和S_min之间波动，以及色值明度在L_max和L _min之间波动。

在上述方面的一个或多个示例中，优选地，A=220，S_max=0.28，S_min=0.15，L_max=0.2以及L_min=0.07。在本发明的其它示例中，上述参数也可以采用其它合适值。

在获得夜间模式HSL色值Hnight，Snight，Lnight)后，第三色值转换单元140将所述夜间模式HSL色值(Hnight，Snight，Lnight)转换为夜间模式RGB色值。

在本发明的一个示例中，第三色值转换单元140可以采用下述公式2来将所述夜间模式HSL色值(Hnight，Snight，Lnight)转换为夜间模式RGB色值。

C=(1-|2L-1|)×S；

$H^{\′}=\frac{H}{60};$

X=C(1-|H′mod2-1|)；

$m=L-\frac{1}{2}C;$

(R，G，B)=(R′+m，G′+m，B′+m)。

在上述公式2中，H、L和S分别是HSL颜色模型中的色相、饱和度和明度，R、G和B是网页元素的RGB色值，其它变量是中间符号，没有特定含义。

然后，渲染单元150根据所述夜间模式RGB色值来对所述网页元素进行渲染，以便在网页浏览终端设备1的显示单元30上显示。

存储单元20可以包括高速随机存取存储器，也可以包括非易失性存储器，比如一个或多个磁盘存储器、闪存装置或者其它固态非易失性存储器。存储单元30被配置为保存网页显示所需的数据。显示单元30用于显示网页数据。

这里要说明的是，网页浏览装置10可以利用硬件实现，也可以利用软件实现，或者可以利用软件和硬件相结合实现。比如，网页浏览装置10可以利用一个或多个处理器来实现。在这种情况下，存储单元20还被配置为保存用于执行网页浏览装置10的功能的应用程序。一个或多个处理器被配置为在接收到夜间模式下进行网页浏览的指令后，调用存储单元30中保存的相应应用程序来实现网页浏览，从而实现网页浏览装置10的功能。

图5示出了根据本发明的实施例的夜间模式下的网页浏览方法的流程图。

如图5所示，在步骤S5 10，当在夜间模式下进行网页加载时(即，在接收到夜间模式下进行网页浏览的指令后)，获取所加载的网页的网页元素的RGB色值。接着，在步骤S520，将所获取的网页元素的RGB色值转换为默认HSL色值(H_normal，S_normal，L_normal)，所述HSL色值中的H表示色相，S表示饱和度，L表示明度。关于将所获取的网页元素的RGB色值转换为默认HSL色值(H_normal，S_normal，L_normal)，可以采用上述公式1来进行转换。

然后，在步骤S530，基于预定的转换规则，将所述默认HSL色值(H_normal，S_normal，L_normal)转换为夜间模式HSL色值(H_night，S_night，L_night)。所述预定的转换规则可以包括：H_night设定为预定固定值，S_night与S_normal成正比关系，以及L_night与L_normal成反比关系。所述预定的转换规则也可以采用上述的其它方式。

在获得夜间模式HSL色值后，在步骤S540，将所述夜间模式HSL色值(H_night，S_night，L_night)转换为夜间模式RGB色值。关于将所述夜间模式HSL色值(H_night，S_night，L_night)转换为夜间模式RGB色值，可以采用上述公式2来进行转换。然后，在步骤S550，根据所述夜间模式RGB色值来对所述网页元素进行渲染显示，从而在网页浏览终端设备的显示单元上显示。

图6示出了根据本发明的实施例的网页浏览方法实现的夜间模式下所浏览的网页的显示效果图。从图6中可以看出，根据本发明的夜间模式网页浏览方法，可以具有下述效果：(1)在夜间模式的配色下，能够保持图文信息跟背景的对比度，让用户清晰快速地获取信息，也更适合于在低亮度的环境下浏览网页；(2)多层次的色彩还原，让在合适对比度的前提下，保持网页原本的视觉层次感，让网页在夜间模式下更美观和信息层次分明。

利用上述方法及装置，可以通过将网页元素的RGB色值转换为默认HSL色值，并且按照预定规则将默认HSL色值转换为夜间模式HSL色值，而后转换回RGB色值来赋予网页元素进行渲染显示，能够实现在夜间模式下，结合夜间模式的配色方案，通过获取原网页颜色元素进行分层次色彩转换来提高网页视觉界面结构的还原度。

此外，根据本发明的方法还可以被实现为由移动终端中的处理器(比如CPU)执行的计算机程序，并且存储在移动终端的存储器中。在该计算机程序被处理器执行时，执行本发明的方法中限定的上述功能。

此外，根据本发明的方法还可以实现为一种计算机程序产品，该计算机程序产品包括计算机可读介质，在该计算机可读介质上存储有用于执行本发明的方法中限定的上述功能的计算机程序。

此外，上述方法步骤以及系统单元也可以利用控制器以及用于存储使得控制器实现上述步骤或单元功能的计算机程序的计算机可读存储设备实现。

本领域技术人员还将明白的是，结合这里的公开所描述的各种示例性逻辑块、模块、电路和算法步骤可以被实现为电子硬件、计算机软件或两者的组合。为了清楚地说明硬件和软件的这种可互换性，已经就各种示意性组件、方块、模块、电路和步骤的功能对其进行了一般性的描述。这种功能是被实现为软件还是被实现为硬件取决于具体应用以及施加给整个系统的设计约束。本领域技术人员可以针对每种具体应用以各种方式来实现所述的功能，但是这种实现决定不应被解释为导致脱离本发明的范围。尽管前面公开的内容示出了本发明的示例性实施例，但是应当注意，在不背离权利要求限定的本发明的范围的前提下，可以进行多种改变和修改。根据这里描述的发明实施例的方法权利要求的功能、步骤和/或动作不需以任何特定顺序执行。此外，尽管本发明的元素可以以个体形式描述或要求，但是也可以设想多个，除非明确限制为单数。

虽然如上参照图描述了根据本发明的各个实施例进行了描述，但是本领域技术人员应当理解，对上述本发明所提出的各个实施例，还可以在不脱离本发明内容的基础上做出各种改进。因此，本发明的保护范围应当由所附的权利要求书的内容确定。

Claims (9)

1.一种夜间模式下的网页浏览方法，包括：

当在夜间模式下进行网页加载时，获取所加载的网页的网页元素的RGB色值；

将所获取的网页元素的RGB色值转换为默认HSL色值(H_normal，S_normal，L_normal)，所述HSL色值中的H表示色相，S表示饱和度，L表示明度；

基于预定的转换规则，将所述默认HSL色值(H_normal，S_normal，L_normal)转换为夜间模式HSL色值(H_night，S_night，L_night)；

将所述夜间模式HSL色值(H_night，S_night，L_night)转换为夜间模式RGB色值；以及

根据所述夜间模式RGB色值来对所述网页元素进行渲染显示，

其中，所述预定的转换规则包括：H_night设定为预定固定值，S_night与S_normal成正比关系，以及L_night与L_normal成反比关系。

2.如权利要求1所述的网页浏览方法，其中，所述预定的转换规则为：

H_night=A，A是预定固定值；

S_night=S_min+S_normal×(S_max-S_min)；

L_night=L_max-L_normal×(L_max-L_min)；

其中，S_max是所定义的夜间模式的色值饱和度最大值，S_min是所定义的夜间模式的色值饱和度最小值，L_max是所定义的夜间模式的色值明度最大值，以及L_min是所定义的夜间模式的色值明度最小值。

3.如权利要求2所述的网页浏览方法，其中，A=220，S_max=0.28，S_min=0.15，L_max=0.2以及L_min=0.07。

4.如权利要求1所述的网页浏览方法，其中，RGB色值转换为HSL色值的转换公式包括：

M=max(R，G，B)；

m=min(R，G，B)；

C=M-m：

H=60×H′：

$L=\frac{1}{2}(M+m);$

5.如权利要求4所述的网页浏览方法，其中，HSL色值转换为RGB色值的转换公式包括：

C=(1-|2L-1|)×S；

$H^{\′}=\frac{H}{60};$

X=C(1-|H′mod2-1|)；

$m=L-\frac{1}{2}C;$

(R，G，B)=(R′+m，G′+m，B′+m)。

6.一种网页浏览装置，包括：

RGB色值获取单元，用于当在夜间模式下进行网页加载时，获取所加载的网页的网页元素的RGB色值；

第一色值转换单元，用于将所获取的网页元素的RGB色值转换为默认HSL色值(Hnormal，Snormal，Lnormal)，所述HSL色值中的H表示色相，S表示饱和度，L表示明度；

第二色值转换单元，用于基于预定的转换规则，将所述默认HSL色值(Hnormal，Snormal，Lnormal)转换为夜间模式HSL色值(Hnight，Snight，Lnight)，其中，所述预定的转换规则包括：Hnight设定为预定固定值，Snight与Snormal成正比关系，以及Lnight与Lnormal成反比关系；

第三色值转换单元，用于将所述夜间模式HSL色值(Hnight，Snight，Lnight)转换为夜间模式RGB色值；以及

渲染单元，用于根据所述夜间模式RGB色值来对所述网页元素进行渲染显示。

7.如权利要求6所述的网页浏览装置，其中，所述预定的转换规则为：

Hnight=A，A是预定固定值；

S_night=S_min+S_normal×(S_max-S_min)；

L_night=L_max-L_normal×(L_max-L_min)；

其中，S_max是所定义的夜间模式的色值饱和度最大值，S_min是所定义的夜间模式的色值饱和度最小值，L_max是所定义的夜间模式的色值明度最大值，以及L_min是所定义的夜间模式的色值明度最小值。

8.如权利要求7所述的网页浏览装置，其中，A=220，S_max=0.28，S_min=0.15，L_max=0.2以及L_min=0.07。

9.一种网页浏览终端设备，包括：

显示单元，用于显示网页数据；

存储单元；以及

一个或多个处理器，被配置为执行如权利要求1到6中任何一个所述的方法来渲染网页数据，以供显示单元显示。

Images