CN103927386A - 导航图标生成方法和装置 - Google Patents

Abstract

本发明公开了一种导航图标生成方法和装置。其中，该导航图标生成方法包括：根据目标网页网址来获取对应的网页标题；根据所述网页标题生成图标文字；根据所述图标文字以及图标规格所述网页相对应的导航图标。通过本发明，解决了现有技术中添加没有定制网站导航图标的网页到导航页面时使缺省图标从而使导航图标显示单一，区分特征不明显的问题，实现了导航页面中网站导航图标多样化，容易辨识的效果。

Description

导航图标生成方法和装置

技术领域

本发明涉及浏览器领域，具体而言，涉及一种导航图标生成方法和装置。

背景技术

在浏览器的(网站)导航页面中添加网页的快捷方式，会在导航页面生成该网页相应的导航图标，这个导航图标大多数的网站本身并没有定义；而本身有定义导航图标的网站，在不同的移动终端上，受限屏幕硬件特性，网站本身定义的图标显示效果可能有缺陷，主要为图标显示以及可识别的问题：分辨率高的图标在分辨率低的移动终端上显示会很大；反之会很小。这些都会直接影响用户的使用体验。对上述问题，目前移动终端浏览器会采用对网站导航图标重新定制的处理方式，但这个方式也存在缺陷：浏览器厂商不可能针对全部网站的导航图标进行重新定制，那么当用户添加网页浏览器没有为其定制导航图标，且网页对应的网站本身也没有针对移动终端定义可触摸的导航图标，那么浏览器将会使用缺省的导航图标，例如白底灰色地球图标。如果用户在导航页面中添加的网页大多是这些网站的页面，那么浏览器的导航页面就会呈现一片缺省的导航图标，由于缺省的导航图标都是一样的，因此用户很难基于这些导航图标来区分不同的网页。

针对现有技术中浏览器导航页面中显示缺省的导航图标时显示样式单一，区分特征不明显的问题，目前尚未提出有效的解决方案。

发明内容

本发明的主要目的在于提供一种导航图标生成方法和装置，以解决现有技术中浏览器导航页面中显示缺省的导航图标时显示样式单一的问题。

为了实现上述目的，根据本发明的一个方面，提供了一种导航图标生成方法。根据本发明的导航图标生成方法包括：根据待处理的目标网页的网页网址，获取该目标网页的网页标题；基于所述网页标题，生成导航图标中的图标文字；根据所述图标文字以及图标规格，生成与所述目标网页对应的导航图标图标规格包括：图标大小、图标形状、图标背景颜色。

进一步地，基于所述网页标题生成导航图标中的图标文字包括：从所述网页标题中的第一个字符开始，确定所述网页标题中第一个符合第一预定条件的字符，作为图标文字的起始文字；顺序获取所述网页标题中自所述起始文字起的字符，作为所述图标文字中的文字，直至遇到符合第二预定条件的字符，其中，所述第一预定条件包括所述字符是中文字符、英文字符和数字字符中之一，所述第二预定条件包括所述字符是空格、符号字符和非中英文语种字符中之一。

进一步地，基于所述网页标题生成导航图标中的图标文字包括：在确定为所述网页标题中的所有字符都不符合第一预定条件时，基于所述目标网页的网页网址中的域名确定所述图标文字。

进一步地，所述符号字符是指定符号字符。

进一步地，所述图标大小是预先设定的或者基于移动终端的设备显示参数信息确定的。

进一步地，所述图标形状是预先设定的或者基于移动终端中的操作系统确定。

其中，在所述目标网页包含网页图标时，所述图标背景颜色基于所述目标网页的网页图标确定。

其中，在所述目标网页不包含网页图标时，所述图标背景颜色被设定为预定颜色值。

为了实现上述目的，根据本发明的另一方面，提供了一种导航图标生成装置，其包括：

网页标题获取单元，用于根据待处理的目标网页的网页网址，获取该目标网页的网页标题；

图标文字生成单元，用于基于所述网页标题，生成导航图标中的图标文字；

导航图标生成单元，用于根据所述图标文字以及图标规格，生成与所述目标网页对应的导航图标，所述图标规格包括：图标大小、图标形状、图标背景颜色。

所述图标文字生成单元包括：起始文字确定模块，用于从所述网页标题中的第一个字符开始，确定所述网页标题中第一个符合第一预定条件的字符，作为图标文字的起始文字，所述第一预定条件包括所述字符是中文字符、英文字符和数字字符中之一；

图标文字获取模块，用于顺序获取所述网页标题中自所述起始文字起的字符，作为所述图标文字中的文字，直至遇到符合第二预定条件的字符，所述第二预定条件包括所述字符是空格、符号字符和非中英文语种字符中之一。

进一步地，在确定为所述网页标题中的所有字符都不符合第一预定条件时，所述图标文字生成单元被配置为基于所述目标网页的网页网址中的域名确定所述图标文字。

通过本发明，根据待处理的目标网页的网页网址，获取该目标网页的网页标题；基于所述网页标题，生成导航图标中的图标文字；根据所述图标文字以及图标规格，生成与所述目标网页对应的导航图标。由于每个目标网的网页标题不相同，那么根据网页标题生成的导航图标也会不同，从而解决了现有技术中添加没有定制网站导航图标的网页到导航页面时使缺省图标从而使导航图标显示单一，区分特征不明显的问题，实现了导航页面中网站导航图标多样化，容易辨识的效果。

附图说明

构成本申请的一部分的附图用来提供对本发明的进一步理解，本发明的示意性实施例及其说明用于解释本发明，并不构成对本发明的不当限定。在附图中：

图1是根据本发明实施例的导航图标生成方法的第一流程图；

图2是根据本发明实施例的导航图标生成方法的第二流程图；

图3是根据本发明实施例的生成图标背景颜色流程图；

图4是根据本发明实施例的根据图标文字和图标规格，生成相应的导航图标的流程图；

图5是根据本发明实施例的导航图标生成方法的第三流程图；

图6是根据本发明实施例的导航图标装置的结构示意图；

图7是本发明移动终端的结构示意图；

图8是本发明知乎网站的网页图标示意图；

图9是本发明图标背景的颜色方案为单一的纯色示意图；

图10是本发明新浪微博的网页图标示意图；

图11是本发明图标背景的颜色方案为各主色互相溶合的渐变色示意图；

图12是本发明图标文字投影效果为浅色调(灰色)的投影示意图；以及

图13是本发明图标文字投影效果为深色调(黑色)的投影示意图。

具体实施方式

需要说明的是，在不冲突的情况下，本申请中的实施例及实施例中的特征可以相互组合。下面将参考附图并结合实施例来详细说明本发明。

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

本发明实施例提供了一种导航图标生成方法。

图1是根据本发明实施例的导航图标生成方法的第一流程图，包括步骤：

步骤10、根据待处理的目标网页的网页网址，获取该目标网页的网页标题；

步骤11、基于所述网页标题，生成导航图标中的图标文字；

步骤12、根据所述图标文字以及图标规格，生成与所述目标网页对应的导航图标，所述图标规格包括：图标大小、图标形状、图标背景颜色。

图2是根据本发明实施例的导航图标生成方法的第二流程图。如图所示，该导航图标生成方法包括如下步骤：

步骤S100，根据待处理的目标网页的网页网址判断是否有适合的导航图标，如果有，则直接使用，如果没，就进入步骤S110.

适合的导航图标包括：

1、浏览器中存在该网页的定制图标；

2、网页指定了可以直接使用的图标，该图标作为目标网页的导航图标。

上述直接使用的图标一股是指符合触摸屏的定制导航图标，其会在网页中代码体现，例如：

＜link rel＝″apple-touch-icon-precomposed″href＝″http：//uc.cn/logo.png″＞

步骤S110，根据待处理的目标网页的网页网址获取其网页标题。

将处理的目标网页添加到浏览器的快速导航，一是手动输入处理的目标网页的网址；一是通过其他方式(例如“粘贴”，“添加到导航”)将处理的目标网页添加到导航页面；

在后台根据待处理的目标网页的网页网址解析网页，从网页的源代码中获取网页标题。

网页标题在源码中表示为：

＜title＞网页标题＜/title＞

步骤S120，基于获取到的网页标题，生成导航图标中的图标文字。

从网页标题中的第一个字符开始，确定所述网页标题中第一个符合第一预定条件的字符，作为图标文字的起始文字；

顺序获取所述网页标题中自所述起始文字起的字符，作为所述图标文字中的文字，直至遇到符合第二预定条件的字符。

其中，

所述第一预定条件包括所述字符是中文字符、英文字符和数字字符中之一；

所述第二预定条件包括所述字符是空格、符号字符和非中英文语种字符中之一。

例如，优视浏览器首页的标题为“UC浏览器官网手机浏览器免费下载iPhone/安卓浏览器首选www.uc.cn”：

对于优视浏览器首页的标题“UC浏览器官网手机浏览器免费下载iPhone/安卓浏览器首选www.uc.cn”，第一个字符为“U”，判断出第一个字符是第一预定字符，依次判断至遇到下划线，下划线为第二预定字符，第二预定字符前的最后一个第一预定字符是“网”，则将“UC浏览器官网”作为图标文字。

如果目标网页的标题字符不为第一预定字符时，将目标网页地址的域名设为图标文字。

例如，网页“www.uc.cn/help.htm”，其网页标题是“【帮助信息】”，由于标题第一字符为“【”，不属于第一预定字符，因此会以该网页对应的域名“uc.cn”作为图标文字。

步骤S130，获取移动终端的设备显示参数，根据设备显示参数来生成图标大小参数。

移动终端的显示屏具有多样性，例如目前主流的有720p或1080p的屏幕，再这些不同的屏幕上使用相同的图标大小参数是由问题最优的处理方式是能根据移动终端的设备显示参数来生成相应的图标大小；

而对于同一类参数的移动终端的显示屏，则可以使用同一预设的值。

步骤S140，获取移动终端的操作系统参数，根据操作系统参数来生成图标形状参数。

不同的操作系统其图标的形状是不同的，例如联想的乐OS，其系统中的图标形状是圆形的；而MIUI，其系统中的图标形状是方形的。根据移动终端的操作系统参数来生成图标形状参数，能使导航图标形状与操作系统中的一致，用户的视觉体验一致性更好。

步骤S150，获取目标网页对应的网页图标(Favicon)，获取成功进入S160；获取失败进入S170.

步骤S160，获取成功，则提取该网页图标的主色作为图标背景颜色。

步骤S170，如果获取网页图标失败，则将图标背景颜色设为预定的颜色值。

步骤S180，根据获取到图标大小、图标形状、图标背景颜色生成图标规格，然后根据所述图标文字以及图标规格，生成与所述目标网页对应的导航图标。

从上面流程可以看到，图标文字是导航图标主要组成部分，其是根据目标网页的网页标题确定的，由于每个目标网页的网页标题不相同，因此由此生成的导航图标也不相同。通过本发明的上述方法，能使得不同的网页在浏览器导航页面中生成的导航图标不相同，从而从而解决了现有技术中添加没有定制网站导航图标的网页到导航页面时使缺省图标从而使导航图标显示单一，区分特征不明显的问题，实现了导航页面中网站导航图标多样化，容易辨识的效果。

图3是根据本发明实施例的生成图标背景颜色流程图。如图所示，该导航图标背景颜色生成方法包括如下步骤：

步骤S151，获取目标页面对应的网页图标。获取成功进入步骤S152，获取失败进入步骤S153。

网页图标在页面源代码中形式：

＜link rel＝″shortcut icon″href＝″http：//uc.cn/favicon.ico″/＞

步骤S152，基于获取到的网页图标提取图标的主色，如果得到的颜色是单一的颜色，那么图标背景颜色为单一的颜色；如果得到的颜色不是单一的，根据获取到的多种颜色，进行渐变计算，得到多种颜色互相过渡融合的渐变色，并以这个作为图标背景颜色。

一个图标背景色为纯色的例子：知乎网站的网页图标为蓝底白字，见图8，那么获取到的主色是单一的浅蓝色，那么图标背景的颜色方案为单一的纯色，见图9。

一个图标背景色为多色的例子。新浪微博的网页图标是一样眼加弧形扩散曲线组成，见图10，那么获取到的主色有2钟，分别是红色、橙黄色，那么图标背景的颜色方案为各主色互相溶合的渐变色，见图11：

上面只是一个示范的效果，颜色的渐变过渡方向可以更加灵活，例如可以是不规则的渐变过渡。

为了保证图标的效果，在获取网页图标时，白色、黑色、灰色这些色是不参与取色权重，比如上面新浪微博的网页图标颜色是黑色、红色、橙黄色，但最后获取到的主色是红色、橙黄色。

步骤S153，从预设的颜色方案库中随机选一种颜色来作为图标背景颜色。

随机抽取的规则可以使上次随机抽取颜色方案的对比色方案，例如上次随机抽取的颜色方案是紫色调，那么这次抽取的颜色方案是黄色调。这样能保证相邻的两次取色有明显的区分。

随机抽取的规则也可以是根据网页的特征来选择相应的颜色方案，比如通过网页的域名特征(例如第一个字母)，来从预设的颜色方案库中抽取出相应的颜色方案。

图4是根据本发明实施例的根据图标文字和图标规格，生成相应的导航图标的流程图。如图所示，包括如下步骤：

步骤S161，基于图标背景颜色，从颜色配置库中找到相应的色调。

颜色配置库中保存着颜色和色调数据，它们是一一对应的关系：以颜色的类别(例如红，绿，蓝)，颜色的深浅(例如#fd0000，#fd6666，#fd9999)。

其中色调主要划分为浅系以及深系。

步骤S162，如果图标背景颜色属于浅色调，图标文字使用深色调的颜色，投影效果为浅色调(灰色)的投影，见图12。

步骤S163，如果图标背景颜色属于深色调，图标文字使用浅色调的颜色，投影效果为深色调(黑色)的投影，见图13。

图5是根据本发明实施例的导航图标生成方法的另一流程图。如图所示，当用户点击浏览器导航页面中的导航图标访问网页，导航图标生成方法包括以下步骤：

步骤S200，获取目标网页的网页图标，如果没有获取到网页图标，则结束流程；如果获取到网页图标，则进入步骤S201；

步骤S201，对获取到的目标网页图标进行哈希运算，获取唯一码A；根据目标网页网址从浏览器缓存中读取已保存的网页图标，对其进行哈希运算，获取唯一码B，将A与B进行对比：

如果两者的数值一样，导航图标保持不变；

如果浏览器缓存中不存在已保存的网页图标，导航图标保持不变；

如果两者的数据不一样，进入步骤S202；

步骤S202，基于获取到的目标网页的网页图标，提取到的图标背景颜色；

步骤S203，根据获取到的颜色生成新的图标背景颜色，更新导航页面中目标网页对应的导航图标。

本发明实施例还提供了一种导航图标生成装置。

图6是根据本发明实施例的导航图标装置的结构示意图。如图所示，该导航图标生成装置60包括：

网页标题获取单元，用于根据待处理的目标网页的网页网址，获取该目标网页的网页标题；

图标文字生成单元，用于基于所述网页标题，生成导航图标中的图标文字；

导航图标生成单元，用于根据所述图标文字以及图标规格，生成与所述目标网页对应的导航图标，所述图标规格包括：图标大小、图标形状、图标背景颜色。

进一步地，图标文字生成单元还包括：

起始文字确定模块，用于从所述网页标题中的第一个字符开始，确定所述网页标题中第一个符合第一预定条件的字符，作为图标文字的起始文字，所述第一预定条件包括所述字符是中文字符、英文字符和数字字符中之一；

图标文字获取模块，用于顺序获取所述网页标题中自所述起始文字起的字符，作为所述图标文字中的文字，直至遇到符合第二预定条件的字符，所述第二预定条件包括所述字符是空格、符号字符和非中英文语种字符中之一。

其中，在确定为所述网页标题中的所有字符都不符合第一预定条件时，所述图标文字生成单元被配置为基于所述目标网页的网页网址中的域名确定所述图标文字。

图7是本发明移动终端的结构示意图。如图所示，导航图标生成装置位于移动终端70内，导航图标生成装置接收用户在浏览器导航页面中添加导航的请求，获取目标网页的属性以及当前终端的属性，为目标网页在浏览器导航页面生成相应的导航图标。

本发明实施例还提供了一种计算机存储介质。该计算机存储介质可存储有程序，该程序用于执行上述的导航图标的生成方法中的部分或全部步骤。

以上所述仅为本发明的优选实施例而已，并不用于限制本发明，对于本领域的技术人员来说，本发明可以有各种更改和变化。凡在本发明的精神和原则之内，所作的任何修改、等同替换、改进等，均应包含在本发明的保护范围之内。

Claims (11)

1.一种导航图标生成方法，包括：

根据待处理的目标网页的网页网址，获取该目标网页的网页标题；

基于所述网页标题，生成导航图标中的图标文字；

根据所述图标文字以及图标规格，生成与所述目标网页对应的导航图标，所述图标规格包括：图标大小、图标形状、图标背景颜色。

2.根据权利要求1所述的导航图标生成方法，其中，基于所述网页标题生成导航图标中的图标文字包括：

从所述网页标题中的第一个字符开始，确定所述网页标题中第一个符合第一预定条件的字符，作为图标文字的起始文字；

顺序获取所述网页标题中自所述起始文字起的字符，作为所述图标文字中的文字，直至遇到符合第二预定条件的字符，

其中，所述第一预定条件包括所述字符是中文字符、英文字符和数字字符中之一，所述第二预定条件包括所述字符是空格、符号字符和非中英文语种字符中之一。

3.根据权利要求2所述的导航图标生成方法，基于所述网页标题生成导航图标中的图标文字包括：

在确定为所述网页标题中的所有字符都不符合第一预定条件时，基于所述目标网页的网页网址中的域名确定所述图标文字。

4.根据权利要求2所述的导航图标生成方法，其中，所述符号字符是指定符号字符。

5.根据权利要求1所述的导航图标生成方法，其中，所述图标大小是预先设定的或者基于移动终端的设备显示参数信息确定的。

6.根据权利要求1所述的导航图标生成方法，其中，所述图标形状是预先设定的或者基于移动终端中的操作系统确定。

7.根据权利要求1所述的导航图标生成方法，其中，在所述目标网页包含网页图标时，所述图标背景颜色基于所述目标网页的网页图标确定。

8.根据权利要求1所述的导航图标生成方法，其中，在所述目标网页不包含网页图标时，所述图标背景颜色被设定为预定颜色值。

9.一种导航图标生成装置，包括：

网页标题获取单元，用于根据待处理的目标网页的网页网址，获取该目标网页的网页标题；

图标文字生成单元，用于基于所述网页标题，生成导航图标中的图标文字；

导航图标生成单元，用于根据所述图标文字以及图标规格，生成与所述目标网页对应的导航图标，所述图标规格包括：图标大小、图标形状、图标背景颜色。

10.根据权利要求9所述的导航图标生成装置，其中，所述图标文字生成单元包括：

起始文字确定模块，用于从所述网页标题中的第一个字符开始，确定所述网页标题中第一个符合第一预定条件的字符，作为图标文字的起始文字，所述第一预定条件包括所述字符是中文字符、英文字符和数字字符中之一；

图标文字获取模块，用于顺序获取所述网页标题中自所述起始文字起的字符，作为所述图标文字中的文字，直至遇到符合第二预定条件的字符，所述第二预定条件包括所述字符是空格、符号字符和非中英文语种字符中之一。

11.根据权利要求9所述的导航图标生成装置，其中，在确定为所述网页标题中的所有字符都不符合第一预定条件时，所述图标文字生成单元被配置为基于所述目标网页的网页网址中的域名确定所述图标文字。