導航圖標生成方法和裝置製造方法
2023-06-16 11:31:11 5
導航圖標生成方法和裝置製造方法
【專利摘要】本發明公開了一種導航圖標生成方法和裝置。其中，該導航圖標生成方法包括：根據目標網頁網址來獲取對應的網頁標題；根據所述網頁標題生成圖標文字；根據所述圖標文字以及圖標規格所述網頁相對應的導航圖標。通過本發明，解決了現有技術中添加沒有定製網站導航圖標的網頁到導航頁面時使預設圖標從而使導航圖標顯示單一，區分特徵不明顯的問題，實現了導航頁面中網站導航圖標多樣化，容易辨識的效果。
【專利說明】 導航圖標生成方法和裝置
【技術領域】
[0001]本發明涉及瀏覽器領域，具體而言，涉及一種導航圖標生成方法和裝置。
【背景技術】
[0002]在瀏覽器的(網站)導航頁面中添加網頁的快捷方式，會在導航頁面生成該網頁相應的導航圖標，這個導航圖標大多數的網站本身並沒有定義；而本身有定義導航圖標的網站，在不同的移動終端上，受限屏幕硬體特性，網站本身定義的圖標顯示效果可能有缺陷，主要為圖標顯示以及可識別的問題:解析度高的圖標在解析度低的移動終端上顯示會很大；反之會很小。這些都會直接影響用戶的使用體驗。對上述問題，目前移動終端瀏覽器會採用對網站導航圖標重新定製的處理方式，但這個方式也存在缺陷:瀏覽器廠商不可能針對全部網站的導航圖標進行重新定製，那麼當用戶添加網頁瀏覽器沒有為其定製導航圖標，且網頁對應的網站本身也沒有針對移動終端定義可觸摸的導航圖標，那麼瀏覽器將會使用預設的導航圖標，例如白底灰色地球圖標。如果用戶在導航頁面中添加的網頁大多是這些網站的頁面，那麼瀏覽器的導航頁面就會呈現一片預設的導航圖標，由於預設的導航圖標都是一樣的，因此用戶很難基於這些導航圖標來區分不同的網頁。
[0003]針對現有技術中瀏覽器導航頁面中顯示預設的導航圖標時顯示樣式單一，區分特徵不明顯的問題，目前尚未提出有效的解決方案。
【發明內容】
[0004]本發明的主要目的在於提供一種導航圖標生成方法和裝置，以解決現有技術中瀏覽器導航頁面中顯示預設的導航圖標時顯示樣式單一的問題。
[0005]為了實現上述目的，根據本發明的一個方面，提供了 一種導航圖標生成方法。根據本發明的導航圖標生成方法包括:根據待處理的目標網頁的網頁網址，獲取該目標網頁的網頁標題；基於所述網頁標題，生成導航圖標中的圖標文字；根據所述圖標文字以及圖標規格，生成與所述目標網頁對應的導航圖標圖標規格包括:圖標大小、圖標形狀、圖標背景顏色。
[0006]進一步地，基於所述網頁標題生成導航圖標中的圖標文字包括:從所述網頁標題中的第一個字符開始，確定所述網頁標題中第一個符合第一預定條件的字符，作為圖標文字的起始文字；順序獲取所述網頁標題中自所述起始文字起的字符，作為所述圖標文字中的文字，直至遇到符合第二預定條件的字符，其中，所述第一預定條件包括所述字符是中文字符、英文字符和數字字符中之一，所述第二預定條件包括所述字符是空格、符號字符和非中英文語種字符中之一。
[0007]進一步地，基於所述網頁標題生成導航圖標中的圖標文字包括:在確定為所述網頁標題中的所有字符都不符合第一預定條件時，基於所述目標網頁的網頁網址中的域名確定所述圖標文字。
[0008]進一步地，所述符號字符是指定符號字符。[0009]進一步地，所述圖標大小是預先設定的或者基於移動終端的設備顯示參數信息確定的。
[0010]進一步地，所述圖標形狀是預先設定的或者基於移動終端中的作業系統確定。
[0011]其中，在所述目標網頁包含網頁圖標時，所述圖標背景顏色基於所述目標網頁的網頁圖標確定。
[0012]其中，在所述目標網頁不包含網頁圖標時，所述圖標背景顏色被設定為預定顏色值。
[0013]為了實現上述目的，根據本發明的另一方面，提供了一種導航圖標生成裝置，其包括:
[0014]網頁標題獲取單元，用於根據待處理的目標網頁的網頁網址，獲取該目標網頁的網頁標題；
[0015]圖標文字生成單元，用於基於所述網頁標題，生成導航圖標中的圖標文字；
[0016]導航圖標生成單元，用於根據所述圖標文字以及圖標規格，生成與所述目標網頁對應的導航圖標，所述圖標規格包括:圖標大小、圖標形狀、圖標背景顏色。
[0017]所述圖標文字生成單元包括:起始文字確定模塊，用於從所述網頁標題中的第一個字符開始，確定所述網頁標題中第一個符合第一預定條件的字符，作為圖標文字的起始文字，所述第一預定條件包括所述字符是中文字符、英文字符和數字字符中之一；
[0018]圖標文字獲取模塊，用於順序獲取所述網頁標題中自所述起始文字起的字符，作為所述圖標文字中的文字，直至遇到符合第二預定條件的字符，所述第二預定條件包括所述字符是空格、符號字符和非中英文語種字符中之一。
[0019]進一步地，在確定為所述網頁標題中的所有字符都不符合第一預定條件時，所述圖標文字生成單元被配置為基於所述目標網頁的網頁網址中的域名確定所述圖標文字。
[0020]通過本發明，根據待處理的目標網頁的網頁網址，獲取該目標網頁的網頁標題；基於所述網頁標題，生成導航圖標中的圖標文字；根據所述圖標文字以及圖標規格，生成與所述目標網頁對應的導航圖標。由於每個目標網的網頁標題不相同，那麼根據網頁標題生成的導航圖標也會不同，從而解決了現有技術中添加沒有定製網站導航圖標的網頁到導航頁面時使預設圖標從而使導航圖標顯示單一，區分特徵不明顯的問題，實現了導航頁面中網站導航圖標多樣化，容易辨識的效果。
【專利附圖】
【附圖說明】
[0021]構成本申請的一部分的附圖用來提供對本發明的進一步理解，本發明的示意性實施例及其說明用於解釋本發明，並不構成對本發明的不當限定。在附圖中:
[0022]圖1是根據本發明實施例的導航圖標生成方法的第一流程圖；
[0023]圖2是根據本發明實施例的導航圖標生成方法的第二流程圖；
[0024]圖3是根據本發明實施例的生成圖標背景顏色流程圖；
[0025]圖4是根據本發明實施例的根據圖標文字和圖標規格，生成相應的導航圖標的流程圖；
[0026]圖5是根據本發明實施例的導航圖標生成方法的第三流程圖；
[0027]圖6是根據本發明實施例的導航圖標裝置的結構示意圖；[0028]圖7是本發明移動終端的結構示意圖；
[0029]圖8是本發明知乎網站的網頁圖標不意圖；
[0030]圖9是本發明圖標背景的顏色方案為單一的純色示意圖；
[0031]圖10是本發明新浪微博的網頁圖標不意圖；
[0032]圖11是本發明圖標背景的顏色方案為各主色互相溶合的漸變色示意圖；
[0033]圖12是本發明圖標文字投影效果為淺色調(灰色)的投影示意圖；以及
[0034]圖13是本發明圖標文字投影效果為深色調(黑色)的投影示意圖。
【具體實施方式】
[0035]需要說明的是，在不衝突的情況下，本申請中的實施例及實施例中的特徵可以相互組合。下面將參考附圖並結合實施例來詳細說明本發明。
[0036]為了使本【技術領域】的人員更好地理解本發明方案，下面將結合本發明實施例中的附圖，對本發明實施例中的技術方案進行清楚、完整地描述，顯然，所描述的實施例僅僅是本發明一部分的實施例，而不是全部的實施例。基於本發明中的實施例，本領域普通技術人員在沒有做出創造性勞動前提下所獲得的所有其他實施例，都應當屬於本發明保護的範圍。
[0037]本發明實施例提供了 一種導航圖標生成方法。
[0038]圖1是根據本發明實施例的導航圖標生成方法的第一流程圖，包括步驟:
[0039]步驟10、根據待處理的目標網頁的網頁網址，獲取該目標網頁的網頁標題；
[0040]步驟11、基於所述網頁標題，生成導航圖標中的圖標文字；
[0041]步驟12、根據所述圖標文字以及圖標規格，生成與所述目標網頁對應的導航圖標，所述圖標規格包括:圖標大小、圖標形狀、圖標背景顏色。
[0042]圖2是根據本發明實施例的導航圖標生成方法的第二流程圖。如圖所示，該導航圖標生成方法包括如下步驟:
[0043]步驟S100，根據待處理的目標網頁的網頁網址判斷是否有適合的導航圖標，如果有，則直接使用，如果沒，就進入步驟Si 10.[0044]適合的導航圖標包括:
[0045]1、瀏覽器中存在該網頁的定製圖標；
[0046]2、網頁指定了可以直接使用的圖標，該圖標作為目標網頁的導航圖標。
[0047]上述直接使用的圖標一股是指符合觸控螢幕的定製導航圖標，其會在網頁中代碼體現，例如:
[0048]
[0049]步驟S110，根據待處理的目標網頁的網頁網址獲取其網頁標題。
[0050]將處理的目標網頁添加到瀏覽器的快速導航，一是手動輸入處理的目標網頁的網址；一是通過其他方式(例如「粘貼」，「添加到導航」)將處理的目標網頁添加到導航頁面；[0051 ] 在後臺根據待處理的目標網頁的網頁網址解析網頁，從網頁的原始碼中獲取網頁標題。
[0052]網頁標題在源碼中表示為:[0053]網頁標題
[0054]步驟S120，基於獲取到的網頁標題，生成導航圖標中的圖標文字。
[0055]從網頁標題中的第一個字符開始，確定所述網頁標題中第一個符合第一預定條件的字符，作為圖標文字的起始文字；
[0056]順序獲取所述網頁標題中自所述起始文字起的字符，作為所述圖標文字中的文字，直至遇到符合第二預定條件的字符。
[0057]其中，
[0058]所述第一預定條件包括所述字符是中文字符、英文字符和數字字符中之一；
[0059]所述第二預定條件包括所述字符是空格、符號字符和非中英文語種字符中之一。
[0060]例如，優視瀏覽器首頁的標題為「UC瀏覽器官網手機瀏覽器免費下載iPhone/安卓瀏覽器首選www.uc.cn」:[0061]對於優視瀏覽器首頁的標題「UC瀏覽器官網手機瀏覽器免費下載iPhone/安卓瀏覽器首選www.uc.cn」，第一個字符為「U」，判斷出第一個字符是第一預定字符，依次判斷至遇到下劃線，下劃線為第二預定字符，第二預定字符前的最後一個第一預定字符是「網」，則將「UC瀏覽器官網」作為圖標文字。
[0062]如果目標網頁的標題字符不為第一預定字符時，將目標網頁地址的域名設為圖標文字。
[0063]例如，網頁「www.uc.cn/help.htm」，其網頁標題是「【幫助信息】」，由於標題第一字符為「【」，不屬於第一預定字符，因此會以該網頁對應的域名「uc.cn」作為圖標文字。
[0064]步驟S130，獲取移動終端的設備顯示參數，根據設備顯示參數來生成圖標大小參數。
[0065]移動終端的顯示屏具有多樣性，例如目前主流的有720p或1080p的屏幕，再這些不同的屏幕上使用相同的圖標大小參數是由問題最優的處理方式是能根據移動終端的設備顯示參數來生成相應的圖標大小；
[0066]而對於同一類參數的移動終端的顯示屏，則可以使用同一預設的值。
[0067]步驟S140，獲取移動終端的作業系統參數，根據作業系統參數來生成圖標形狀參數。
[0068]不同的作業系統其圖標的形狀是不同的，例如聯想的樂OS，其系統中的圖標形狀是圓形的；而祖瓜，其系統中的圖標形狀是方形的。根據移動終端的作業系統參數來生成圖標形狀參數，能使導航圖標形狀與作業系統中的一致，用戶的視覺體驗一致性更好。
[0069]步驟S150，獲取目標網頁對應的網頁圖標(Favicon)，獲取成功進入S160 ;獲取失敗進入S170.[0070]步驟S160，獲取成功，則提取該網頁圖標的主色作為圖標背景顏色。
[0071]步驟S170，如果獲取網頁圖標失敗，則將圖標背景顏色設為預定的顏色值。
[0072]步驟S180，根據獲取到圖標大小、圖標形狀、圖標背景顏色生成圖標規格，然後根據所述圖標文字以及圖標規格，生成與所述目標網頁對應的導航圖標。
[0073]從上面流程可以看到，圖標文字是導航圖標主要組成部分，其是根據目標網頁的網頁標題確定的，由於每個目標網頁的網頁標題不相同，因此由此生成的導航圖標也不相同。通過本發明的上述方法，能使得不同的網頁在瀏覽器導航頁面中生成的導航圖標不相同，從而從而解決了現有技術中添加沒有定製網站導航圖標的網頁到導航頁面時使預設圖標從而使導航圖標顯示單一，區分特徵不明顯的問題，實現了導航頁面中網站導航圖標多樣化，容易辨識的效果。
[0074]圖3是根據本發明實施例的生成圖標背景顏色流程圖。如圖所示，該導航圖標背景顏色生成方法包括如下步驟:
[0075]步驟S151，獲取目標頁面對應的網頁圖標。獲取成功進入步驟S152，獲取失敗進入步驟S153。
[0076]網頁圖標在頁面原始碼中形式:
[0077]
[0078]步驟S152，基於獲取到的網頁圖標提取圖標的主色，如果得到的顏色是單一的顏色，那麼圖標背景顏色為單一的顏色；如果得到的顏色不是單一的，根據獲取到的多種顏色，進行漸變計算，得到多種顏色互相過渡融合的漸變色，並以這個作為圖標背景顏色。
[0079]一個圖標背景色為純色的例子:知乎網站的網頁圖標為藍底白字，見圖8，那麼獲取到的主色是單一的淺藍色，那麼圖標背景的顏色方案為單一的純色，見圖9。
[0080]一個圖標背景色為多色的例子。新浪微博的網頁圖標是一樣眼加弧形擴散曲線組成，見圖10，那麼獲取到的主色有2鍾，分別是紅色、橙黃色，那麼圖標背景的顏色方案為各主色互相溶合的漸變色，見圖11:
[0081]上面只是一個示範的效果，顏色的漸變過渡方向可以更加靈活，例如可以是不規則的漸變過渡。
[0082]為了保證圖標的效果，在獲取網頁圖標時，白色、黑色、灰色這些色是不參與取色權重，比如上面新浪微博的網頁圖標顏色是黑色、紅色、橙黃色，但最後獲取到的主色是紅色、橙黃色。
[0083]步驟S153，從預設的顏色方案庫中隨機選一種顏色來作為圖標背景顏色。
[0084]隨機抽取的規則可以使上次隨機抽取顏色方案的對比色方案，例如上次隨機抽取的顏色方案是紫色調，那麼這次抽取的顏色方案是黃色調。這樣能保證相鄰的兩次取色有明顯的區分。
[0085]隨機抽取的規則也可以是根據網頁的特徵來選擇相應的顏色方案，比如通過網頁的域名特徵(例如第一個字母)，來從預設的顏色方案庫中抽取出相應的顏色方案。
[0086]圖4是根據本發明實施例的根據圖標文字和圖標規格，生成相應的導航圖標的流程圖。如圖所示，包括如下步驟:
[0087]步驟S161，基於圖標背景顏色，從顏色配置庫中找到相應的色調。
[0088]顏色配置庫中保存著顏色和色調數據，它們是一一對應的關係:以顏色的類別(例如紅，綠，藍)，顏色的深淺(例如#fd0000, #fd6666, #fd9999)。
[0089]其中色調主要劃分為淺系以及深系。
[0090]步驟S162，如果圖標背景顏色屬於淺色調，圖標文字使用深色調的顏色，投影效果為淺色調(灰色)的投影，見圖12。
[0091]步驟S163，如果圖標背景顏色屬於深色調，圖標文字使用淺色調的顏色，投影效果為深色調(黑色)的投影，見圖13。
[0092]圖5是根據本發明實施例的導航圖標生成方法的另一流程圖。如圖所示，當用戶點擊瀏覽器導航頁面中的導航圖標訪問網頁，導航圖標生成方法包括以下步驟:
[0093]步驟S200，獲取目標網頁的網頁圖標，如果沒有獲取到網頁圖標，則結束流程；如果獲取到網頁圖標，則進入步驟S201 ；
[0094]步驟S201，對獲取到的目標網頁圖標進行哈希運算，獲取唯一碼A ;根據目標網頁網址從瀏覽器緩存中讀取已保存的網頁圖標，對其進行哈希運算，獲取唯一碼B，將A與B進行對比:
[0095]如果兩者的數值一樣，導航圖標保持不變；
[0096]如果瀏覽器緩存中不存在已保存的網頁圖標，導航圖標保持不變；
[0097]如果兩者的數據不一樣，進入步驟S202 ；
[0098]步驟S202，基於獲取到的目標網頁的網頁圖標，提取到的圖標背景顏色；
[0099]步驟S203，根據獲取到的顏色生成新的圖標背景顏色，更新導航頁面中目標網頁對應的導航圖標。
[0100]本發明實施例還提供了 一種導航圖標生成裝置。
[0101]圖6是根據本發明實施例的導航圖標裝置的結構示意圖。如圖所示，該導航圖標生成裝置60包括:
[0102]網頁標題獲取單元，用於根據待處理的目標網頁的網頁網址，獲取該目標網頁的網頁標題；
[0103]圖標文字生成單元，用於基於所述網頁標題，生成導航圖標中的圖標文字；
[0104]導航圖標生成單元，用於根據所述圖標文字以及圖標規格，生成與所述目標網頁對應的導航圖標，所述圖標規格包括:圖標大小、圖標形狀、圖標背景顏色。
[0105]進一步地，圖標文字生成單元還包括:
[0106]起始文字確定模塊，用於從所述網頁標題中的第一個字符開始，確定所述網頁標題中第一個符合第一預定條件的字符，作為圖標文字的起始文字，所述第一預定條件包括所述字符是中文字符、英文字符和數字字符中之一；
[0107]圖標文字獲取模塊，用於順序獲取所述網頁標題中自所述起始文字起的字符，作為所述圖標文字中的文字，直至遇到符合第二預定條件的字符，所述第二預定條件包括所述字符是空格、符號字符和非中英文語種字符中之一。
[0108]其中，在確定為所述網頁標題中的所有字符都不符合第一預定條件時，所述圖標文字生成單元被配置為基於所述目標網頁的網頁網址中的域名確定所述圖標文字。
[0109]圖7是本發明移動終端的結構示意圖。如圖所示，導航圖標生成裝置位於移動終端70內，導航圖標生成裝置接收用戶在瀏覽器導航頁面中添加導航的請求，獲取目標網頁的屬性以及當前終端的屬性，為目標網頁在瀏覽器導航頁面生成相應的導航圖標。
[0110]本發明實施例還提供了一種計算機存儲介質。該計算機存儲介質可存儲有程序，該程序用於執行上述的導航圖標的生成方法中的部分或全部步驟。
[0111]以上所述僅為本發明的優選實施例而已，並不用於限制本發明，對於本領域的技術人員來說，本發明可以有各種更改和變化。凡在本發明的精神和原則之內，所作的任何修改、等同替換、改進等，均應包含在本發明的保護範圍之內。
【權利要求】
1.一種導航圖標生成方法，包括: 根據待處理的目標網頁的網頁網址,獲取該目標網頁的網頁標題； 基於所述網頁標題，生成導航圖標中的圖標文字； 根據所述圖標文字以及圖標規格，生成與所述目標網頁對應的導航圖標，所述圖標規格包括:圖標大小、圖標形狀、圖標背景顏色。
2.根據權利要求1所述的導航圖標生成方法，其中，基於所述網頁標題生成導航圖標中的圖標文字包括: 從所述網頁標題中的第一個字符開始，確定所述網頁標題中第一個符合第一預定條件的字符，作為圖標文字的起始文字； 順序獲取所述網頁標題中自所述起始文字起的字符，作為所述圖標文字中的文字，直至遇到符合第二預定條件的字符， 其中，所述第一預定條件包括所述字符是中文字符、英文字符和數字字符中之一，所述第二預定條件包括所述字符是空格、符號字符和非中英文語種字符中之一。
3.根據權利要求2所述的導航圖標生成方法，基於所述網頁標題生成導航圖標中的圖標文字包括: 在確定為所述網頁標題中的所有字符都不符合第一預定條件時，基於所述目標網頁的網頁網址中的域名確定所述圖標文字。
4.根據權利要求2所述的導航圖標生成方法，其中，所述符號字符是指定符號字符。
5.根據權利要求1所述的導航圖標生成方法，其中，所述圖標大小是預先設定的或者基於移動終端的設備顯示參數信息確定的。
6.根據權利要求1所述的導航圖標生成方法，其中，所述圖標形狀是預先設定的或者基於移動終端中的?呆作系統確定。
7.根據權利要求1所述的導航圖標生成方法，其中，在所述目標網頁包含網頁圖標時，所述圖標背景顏色基於所述目標網頁的網頁圖標確定。
8.根據權利要求1所述的導航圖標生成方法，其中，在所述目標網頁不包含網頁圖標時，所述圖標背景顏色被設定為預定顏色值。
9.一種導航圖標生成裝置，包括: 網頁標題獲取單元，用於根據待處理的目標網頁的網頁網址，獲取該目標網頁的網頁標題； 圖標文字生成單元，用於基於所述網頁標題，生成導航圖標中的圖標文字； 導航圖標生成單元，用於根據所述圖標文字以及圖標規格，生成與所述目標網頁對應的導航圖標，所述圖標規格包括:圖標大小、圖標形狀、圖標背景顏色。
10.根據權利要求9所述的導航圖標生成裝置，其中，所述圖標文字生成單元包括: 起始文字確定模塊，用於從所述網頁標題中的第一個字符開始，確定所述網頁標題中第一個符合第一預定條件的字符，作為圖標文字的起始文字，所述第一預定條件包括所述字符是中文字符、英文字符和數字字符 中之一； 圖標文字獲取模塊，用於順序獲取所述網頁標題中自所述起始文字起的字符，作為所述圖標文字中的文字，直至遇到符合第二預定條件的字符，所述第二預定條件包括所述字符是空格、符號字符和非中英文語種字符中之一。
11.根據權利要求9所述的導航圖標生成裝置，其中，在確定為所述網頁標題中的所有字符都不符合第一預定條件時，所述圖標文字生成單元被配置為基於所述目標網頁的網頁網址中的域名確定所述圖標文字。
【文檔編號】G06F17/30GK103927386SQ201410180719
【公開日】2014年7月16日 申請日期:2014年4月28日 優先權日:2014年4月28日
【發明者】梁捷, 楊琳, 陳國華 申請人:優視科技有限公司