頁設(shè)計(jì)中交互層面網(wǎng)頁內(nèi)容分隔的整體框架結(jié)構(gòu),使得劃分出的內(nèi)容塊具有視覺層面的模塊性;另一方面同時(shí)需要兼顧頁面內(nèi)容的關(guān)聯(lián)性,有內(nèi)容依賴關(guān)系的元素在頁面分塊中盡可能不被拆分。
[0083]本發(fā)明的網(wǎng)頁分塊技術(shù)采用多種分塊算法的結(jié)合,實(shí)現(xiàn)分塊結(jié)果盡可能與網(wǎng)頁中的內(nèi)容塊相一致。根據(jù)本發(fā)明的一個(gè)實(shí)施例,網(wǎng)頁分塊的主要流程包括以下步驟:
[0084]1)S301:網(wǎng)頁文件的解析和內(nèi)容排版、渲染計(jì)算;基于WEB標(biāo)準(zhǔn)的網(wǎng)頁加載,瀏覽器進(jìn)行網(wǎng)頁的加載、解析。為了優(yōu)化瀏覽加速服務(wù)端的運(yùn)行效率,網(wǎng)頁解析時(shí)可以關(guān)閉部分不必要的瀏覽器特性。比如:關(guān)閉服務(wù)端瀏覽器的網(wǎng)頁圖片、視頻的加載顯示功能,關(guān)閉部分的JavaScript功能。
[0085]2)S302:基于DOM樹的網(wǎng)頁元素的位置計(jì)算;遍歷步驟S301所生成的DOM樹,計(jì)算每個(gè)DOM節(jié)點(diǎn)在網(wǎng)頁中的寬度、高度和坐標(biāo)位置。
[0086]3) S303:基于DOM樹的網(wǎng)頁元素的視覺邊距計(jì)算;遍歷DOM樹,基于上下層DOM節(jié)點(diǎn)間的位置覆蓋關(guān)系,計(jì)算每個(gè)DOM節(jié)點(diǎn)的上、下、左、右視覺空白邊距。
[0087]4)S304:在DOM樹上,自頂向下根據(jù)視覺邊距進(jìn)行內(nèi)容的拆分,拆分出網(wǎng)頁單元內(nèi)容塊;在上述步驟S303之后,進(jìn)一步計(jì)算出網(wǎng)頁內(nèi)的主要視覺分隔欄。以這些分隔欄為基礎(chǔ),將網(wǎng)頁劃分為若干內(nèi)容塊。
[0088]5)S305:合并具有強(qiáng)依賴關(guān)系的內(nèi)容塊;對各個(gè)內(nèi)容塊進(jìn)行內(nèi)容特征的識別,識別出常見的頁面內(nèi)容。比如:文章標(biāo)題、文章正文、翻頁塊、導(dǎo)航欄等。根據(jù)內(nèi)容閱讀的需要,合并相關(guān)內(nèi)容塊。
[0089]6)S306:輸出分塊結(jié)果。以上述最終的分塊結(jié)果的每個(gè)塊為基本單位,輸出網(wǎng)頁的內(nèi)容。
[0090]圖4是根據(jù)本發(fā)明實(shí)施例的網(wǎng)頁分塊的示意效果圖。
[0091]根據(jù)參照圖3描述的上述分塊步驟,分別計(jì)算出整頁的分隔欄如圖4中虛線所示。以這些虛線為基礎(chǔ),將整頁劃分為圖示的塊I至塊12。圖4示意性地說明了根據(jù)本發(fā)明的網(wǎng)頁分塊的效果,其中的具體網(wǎng)頁內(nèi)容并不構(gòu)成對本發(fā)明的限定。
[0092]本發(fā)明的塊排序技術(shù)能夠額外提高本發(fā)明的效果。
[0093]在針對個(gè)人電腦的PC網(wǎng)站網(wǎng)頁設(shè)計(jì)中,由于屏幕寬度較大,可能存在左右平列的多列內(nèi)容,其中包括主體內(nèi)容列也可能包括非主體內(nèi)容的列,由于是并排展現(xiàn),這些內(nèi)容被序列化后在手機(jī)上加載時(shí)有可能主體在前或者主體在后。如果主體在后,則影響用戶對網(wǎng)頁主體內(nèi)容的閱讀。另一種情況,在PC網(wǎng)站網(wǎng)頁中主體內(nèi)容之前有一定數(shù)量的其它內(nèi)容,如廣告區(qū)域、網(wǎng)站導(dǎo)航欄等。由于手機(jī)寬度的限制,這些內(nèi)容被序列化并壓縮到手機(jī)屏幕寬度后,高度會(huì)變得很大,從而影響手機(jī)用戶對網(wǎng)頁主體內(nèi)容的閱讀。
[0094]通過塊排序技術(shù)能夠解決上述情況下的網(wǎng)頁主體內(nèi)容之前存在過多非主體內(nèi)容的問題。例如,可以根據(jù)網(wǎng)頁內(nèi)所識別塊的重要度來進(jìn)行塊順序調(diào)整的依據(jù)。例如,塊排序可以采用以下兩種方式中的任一種方式或以下兩種方式的結(jié)合來實(shí)現(xiàn):基于DOM樹下位置為左右并列或上下并列的多個(gè)節(jié)點(diǎn)的順序調(diào)整;以及基于內(nèi)容類型識別,將特定內(nèi)容塊調(diào)整位置到與其相關(guān)聯(lián)內(nèi)容塊的附近。
[0095]另一方面,在手機(jī)端,將根據(jù)網(wǎng)頁實(shí)際被瀏覽的需要,延遲加載互聯(lián)網(wǎng)網(wǎng)頁被劃分出的所述內(nèi)容塊。采用多種方法判斷是否需要觸發(fā)更多內(nèi)容塊的加載:
[0096]1.可以根據(jù)當(dāng)前瀏覽中的縱向的滾動(dòng)位置與瀏覽器已加載內(nèi)容的累計(jì)高度的比較來進(jìn)行判斷。當(dāng)閱讀位置距離已加載內(nèi)容的尾部已經(jīng)很近時(shí),觸發(fā)后續(xù)內(nèi)容塊的加載。
[0097]2.在網(wǎng)頁的大的段落處設(shè)置確認(rèn)節(jié)點(diǎn),由瀏覽用戶在頁面內(nèi)點(diǎn)擊確認(rèn)后觸發(fā)繼續(xù)的自動(dòng)加載。
[0098]前面對本發(fā)明具體示例性實(shí)施方案所呈現(xiàn)的描述是出于說明和描述的目的。前面的描述并不想要成為毫無遺漏的,也不是想要把本發(fā)明限制為所公開的精確形式,顯然,根據(jù)上述教導(dǎo)很多改變和變化都是可能的。選擇示例性實(shí)施方案并進(jìn)行描述是為了解釋本發(fā)明的特定原理及其實(shí)際應(yīng)用,從而使得本領(lǐng)域的其它技術(shù)人員能夠?qū)崿F(xiàn)并利用本發(fā)明的各種示例性實(shí)施方案及其各種選擇形式和修改形式。本發(fā)明的范圍意在由所附權(quán)利要求書及其等效形式所限定。
【主權(quán)項(xiàng)】
1.一種網(wǎng)頁內(nèi)容的延遲加載方法,包括以下步驟: 發(fā)起步驟:通過無線移動(dòng)終端的瀏覽器向?yàn)g覽加速服務(wù)器發(fā)起瀏覽加速請求; 獲取和分析步驟:在接收到所述瀏覽加速請求之后,通過所述瀏覽加速服務(wù)器從互聯(lián)網(wǎng)服務(wù)器獲取網(wǎng)頁內(nèi)容并對所述網(wǎng)頁內(nèi)容進(jìn)行分析,生成返回信息; 返回步驟:通過所述瀏覽加速服務(wù)器將所述返回信息返回至所述無線移動(dòng)終端; 加載和展現(xiàn)步驟:根據(jù)瀏覽進(jìn)度以及所述返回信息,通過所述無線移動(dòng)終端的瀏覽器延遲加載并展現(xiàn)所述網(wǎng)頁內(nèi)容。
2.根據(jù)權(quán)利要求1所述的網(wǎng)頁內(nèi)容的延遲加載方法,其特征在于,所述網(wǎng)頁內(nèi)容至少包括文本、圖片、視頻或音頻。
3.根據(jù)權(quán)利要求1所述的網(wǎng)頁內(nèi)容的延遲加載方法,其特征在于,對所述網(wǎng)頁內(nèi)容進(jìn)行分析包括根據(jù)所述網(wǎng)頁內(nèi)容的總體結(jié)構(gòu)將所述網(wǎng)頁內(nèi)容分為若干內(nèi)容塊,所述返回信息至少包括內(nèi)容塊信息,所述內(nèi)容塊信息包括所述內(nèi)容塊的排序。
4.根據(jù)權(quán)利要求1所述的網(wǎng)頁內(nèi)容的延遲加載方法,其特征在于,所述返回信息包括功能菜單命令,所述功能菜單命令使得所述無線移動(dòng)終端的瀏覽器能夠生成功能菜單,實(shí)現(xiàn)瀏覽所述網(wǎng)頁內(nèi)容所需的快捷工具和/或來自所述互聯(lián)網(wǎng)服務(wù)器的針對所述無線移動(dòng)終端的定制功能。
5.根據(jù)權(quán)利要求1所述的網(wǎng)頁內(nèi)容的延遲加載方法,其特征在于,所述瀏覽加速服務(wù)器持續(xù)保存所述網(wǎng)頁內(nèi)容的訪問狀態(tài),如果所述無線移動(dòng)終端的瀏覽器對所述網(wǎng)頁內(nèi)容的加載暫?;蛑袛?,則在所述無線移動(dòng)終端的瀏覽器下次訪問所述網(wǎng)頁內(nèi)容時(shí),所述瀏覽加速服務(wù)器使用所保存的訪問狀態(tài),使得所述無線移動(dòng)終端的瀏覽器能夠基于所保存的訪問狀態(tài)繼續(xù)訪問。
6.一種網(wǎng)頁內(nèi)容的延遲加載系統(tǒng),包括: 發(fā)起模塊,用于通過無線移動(dòng)終端的瀏覽器向?yàn)g覽加速服務(wù)器發(fā)起瀏覽加速請求; 獲取和分析模塊,用于在接收到所述瀏覽加速請求之后,通過所述瀏覽加速服務(wù)器從互聯(lián)網(wǎng)服務(wù)器獲取網(wǎng)頁內(nèi)容并對所述網(wǎng)頁內(nèi)容進(jìn)行分析,生成返回信息; 返回模塊,用于通過所述瀏覽加速服務(wù)器將所述返回信息返回至所述無線移動(dòng)終端;加載和展現(xiàn)模塊,用于根據(jù)瀏覽進(jìn)度以及所述返回信息,通過所述無線移動(dòng)終端的瀏覽器延遲加載并展現(xiàn)所述網(wǎng)頁內(nèi)容。
7.根據(jù)權(quán)利要求6所述的網(wǎng)頁內(nèi)容的延遲加載系統(tǒng),其特征在 于,所述網(wǎng)頁內(nèi)容至少包括文本、圖片、視頻或音頻。
8.根據(jù)權(quán)利要求6所述的網(wǎng)頁內(nèi)容的延遲加載系統(tǒng),其特征在于,對所述網(wǎng)頁內(nèi)容進(jìn)行分析包括根據(jù)所述網(wǎng)頁內(nèi)容的總體結(jié)構(gòu)將所述網(wǎng)頁內(nèi)容分為若干內(nèi)容塊,所述返回信息至少包括內(nèi)容塊信息,所述內(nèi)容塊信息包括所述內(nèi)容塊的排序。
9.根據(jù)權(quán)利要求6所述的網(wǎng)頁內(nèi)容的延遲加載系統(tǒng),其特征在于,所述返回信息包括功能菜單命令,所述功能菜單命令使得所述無線移動(dòng)終端的瀏覽器能夠生成功能菜單,實(shí)現(xiàn)瀏覽所述網(wǎng)頁內(nèi)容所需的快捷工具和/或來自所述互聯(lián)網(wǎng)服務(wù)器的針對所述無線移動(dòng)終端的定制功能。
10.根據(jù)權(quán)利要求6所述的網(wǎng)頁內(nèi)容的延遲加載系統(tǒng),其特征在于,所述瀏覽加速服務(wù)器持續(xù)保存所述網(wǎng)頁內(nèi)容的訪問狀態(tài),如果所述無線移動(dòng)終端的瀏覽器對所述網(wǎng)頁內(nèi)容的加載暫停或中斷,則在所述無線移動(dòng)終端的瀏覽器下次訪問所述網(wǎng)頁內(nèi)容時(shí),所述瀏覽加速服務(wù)器使用所保存的訪問狀態(tài),使得所述無線移動(dòng)終端的瀏覽器能夠基于所保存的訪問狀態(tài)繼續(xù)訪問。
【專利摘要】本發(fā)明提供網(wǎng)頁內(nèi)容的延遲加載方法及系統(tǒng)。本發(fā)明提供的網(wǎng)頁內(nèi)容的延遲加載方法,包括:發(fā)起步驟:通過無線移動(dòng)終端的瀏覽器向?yàn)g覽加速服務(wù)器發(fā)起瀏覽加速請求;獲取和分析步驟:在接收到所述瀏覽加速請求之后,通過所述瀏覽加速服務(wù)器從互聯(lián)網(wǎng)服務(wù)器獲取網(wǎng)頁內(nèi)容并對所述網(wǎng)頁內(nèi)容進(jìn)行分析,生成返回信息;返回步驟:通過所述瀏覽加速服務(wù)器將所述返回信息返回至所述無線移動(dòng)終端;加載和展現(xiàn)步驟:根據(jù)瀏覽進(jìn)度以及所述返回信息,通過所述無線移動(dòng)終端的瀏覽器延遲加載并展現(xiàn)所述網(wǎng)頁內(nèi)容。本發(fā)明能夠縮短無線移動(dòng)終端在網(wǎng)頁瀏覽中的加載延遲并減少流量浪費(fèi)。本發(fā)明還有利于提升無線移動(dòng)終端設(shè)備的電池續(xù)航性能。
【IPC分類】H04L29-08, G06F17-30
【公開號】CN104750851
【申請?zhí)枴緾N201510175552
【發(fā)明人】錢海祥
【申請人】錢海祥
【公開日】2015年7月1日
【申請日】2015年4月14日