淺談基于移動(dòng)搜索的網(wǎng)頁設(shè)計(jì)優(yōu)化研究論文

時(shí)間:2021-06-08 09:57:12 論文范文 我要投稿

淺談基于移動(dòng)搜索的網(wǎng)頁設(shè)計(jì)優(yōu)化研究論文

  1 引言(Introduction)

淺談基于移動(dòng)搜索的網(wǎng)頁設(shè)計(jì)優(yōu)化研究論文

  據(jù)媒體預(yù)測(cè),到2016年,全球移動(dòng)設(shè)備的互聯(lián)網(wǎng)搜索量將超過桌面設(shè)備。移動(dòng)搜索是指以移動(dòng)設(shè)備為終端,用戶通過移動(dòng)通信設(shè)備輸入搜索項(xiàng),對(duì)互聯(lián)網(wǎng)的檢索結(jié)果通過無線網(wǎng)絡(luò)返回給用戶。移動(dòng)互聯(lián)網(wǎng)搜索引擎優(yōu)化(Mobile Search Engine Optimization,縮寫為MSEO,簡(jiǎn)稱移動(dòng)搜索優(yōu)化),它是在傳統(tǒng)PC互聯(lián)網(wǎng)搜索引擎優(yōu)化(即SEO)基礎(chǔ)上發(fā)展起來的一種關(guān)于移動(dòng)搜索引擎的排名優(yōu)化。

  2 移動(dòng)搜索的特點(diǎn)(The characteristics of mobile search)

  2.1 移動(dòng)搜索的特點(diǎn)

  首先,移動(dòng)搜索具有可用性特點(diǎn)。移動(dòng)設(shè)備可用性包括:界面可視性、導(dǎo)航、內(nèi)容等。網(wǎng)頁界面可用性表現(xiàn)為同一窗口中內(nèi)容要精簡(jiǎn),按內(nèi)容的重要性排列顯示;網(wǎng)頁版面布局要方便用戶更容易地接收信息等。其次,移動(dòng)搜索具有可訪問性特點(diǎn)。移動(dòng)搜索用戶與桌面搜索用戶相比,對(duì)搜索結(jié)果的關(guān)注度更高。移動(dòng)用戶更多的是搜索能解決身邊的問題,諸如餐飲、旅游、公交等,主要關(guān)注生活服務(wù)類、健康保健類、教育培訓(xùn)類這三類信息,因此移動(dòng)SEO的需求主要是針對(duì)這些網(wǎng)站的搜索引擎優(yōu)化。

  2.2 根據(jù)移動(dòng)搜索特點(diǎn)的網(wǎng)頁移動(dòng)化策略

  網(wǎng)頁移動(dòng)化策略有兩個(gè):(1)響應(yīng)式網(wǎng)頁設(shè)計(jì)。(2)搜索引擎開放適配服務(wù),抓取移動(dòng)資源。響應(yīng)式網(wǎng)頁設(shè)計(jì)(Responsive web design)是一種網(wǎng)頁設(shè)計(jì)的方法,該設(shè)計(jì)可使網(wǎng)站從桌面電腦顯示器到移動(dòng)設(shè)備上適合閱讀和導(dǎo)航。響應(yīng)式網(wǎng)頁設(shè)計(jì)就是能夠用一套樣式,使網(wǎng)站的頁面能夠在不同分辨率的屏幕下都有很好的表現(xiàn)形式。百度的移動(dòng)資源有兩種抓取方式,一是通過傳統(tǒng)的蜘蛛(spider)抓取,另一種是通過百度提供的“開放適配”服務(wù)。目前百度開放適配服務(wù)共提供三種方案:自主適配、標(biāo)注Meta聲明、提交對(duì)應(yīng)關(guān)系Sitemap。按照百度官方的定義用“開放適配”的抓取速度會(huì)優(yōu)于傳統(tǒng)的網(wǎng)頁抓取。

  3 移動(dòng)端網(wǎng)站優(yōu)化的規(guī)則和策略(The mobileterminal website optimization rules and strategies)

  3.1 百度移動(dòng)搜索結(jié)果的排名標(biāo)準(zhǔn)

  百度鼓勵(lì)mobile資源,根據(jù)百度移動(dòng)搜索結(jié)果的排名標(biāo)準(zhǔn):(1)檢索友好性,其友好性判斷標(biāo)準(zhǔn)是網(wǎng)站有沒有可以匹配移動(dòng)設(shè)備的HTML5結(jié)構(gòu)。(2)有完整的功能/服務(wù)滿足用戶需求,保證內(nèi)容/服務(wù)的穩(wěn)定可用,保證訪問速度及到達(dá)率。(3)移動(dòng)化交互體驗(yàn),符合移動(dòng)終端特性。(4)使用規(guī)范的html5/xhtml協(xié)議語言。

  3.2 移動(dòng)端搜索結(jié)果的排名策略

  移動(dòng)端網(wǎng)站優(yōu)化打破傳統(tǒng)網(wǎng)站的優(yōu)化方式,移動(dòng)端搜索結(jié)果的排名策略主要由基礎(chǔ)相關(guān)性、資源質(zhì)量、檢索友好性三個(gè)部分組成。

  機(jī)頁面進(jìn)行適配,移動(dòng)網(wǎng)站的DOCTYPE聲明有助于搜索引擎識(shí)別該頁面是否適合手機(jī)瀏覽,mobile頁面協(xié)議編寫如果不規(guī)范,會(huì)造成百度無法正常識(shí)別。 聲明應(yīng)該位于文檔中的最前面的位置,處于 標(biāo)簽之前,其聲明格式。

  4 基于移動(dòng)搜索的網(wǎng)頁優(yōu)化(Webpage optimizationbased on mobile search)

  面對(duì)移動(dòng)搜索市場(chǎng),移動(dòng)用戶需求與標(biāo)準(zhǔn)的桌面搜索需求是不同的,移動(dòng)用戶更傾向于即時(shí)需求,移動(dòng)搜索與桌面搜索相比,具有:(1)在移動(dòng)設(shè)備上的小屏幕,可能只能出現(xiàn)5個(gè)搜索結(jié)果。(2)移動(dòng)搜索查詢往往極短,查詢的關(guān)鍵詞也比傳統(tǒng)桌面搜索更少。(3)移動(dòng)搜索查詢結(jié)果受到字?jǐn)?shù)限制。例如,PC端和移動(dòng)端搜索結(jié)果,PC端30多個(gè)中文漢字才截?cái)啵苿?dòng)端不到20個(gè)字就截?cái)唷?/p>

  4.1 移動(dòng)端網(wǎng)站樣式表的優(yōu)化

  制作的.一個(gè)移動(dòng)樣式表單,稱之為“handheld.css”,這個(gè)CSS可以把傳統(tǒng)網(wǎng)頁格式化為移動(dòng)設(shè)備可以瀏覽的網(wǎng)頁。

  

  如果客戶端是手機(jī)等移動(dòng)設(shè)備時(shí),就會(huì)載入這個(gè)css樣式表。

  4.2 移動(dòng)端網(wǎng)頁標(biāo)簽的優(yōu)化

  (1)meta標(biāo)簽優(yōu)化,使用標(biāo)注meta聲明開放適配協(xié)議。站長(zhǎng)在站點(diǎn)PC頁的源代碼頭部嵌入一行或多行Meta信息,由Meta信息來指明該P(yáng)C頁對(duì)應(yīng)的手機(jī)頁的URL。Meta聲明的格式:

  (2)描述標(biāo)簽(description)的優(yōu)化,使用description目的是用來說明頁面的主體內(nèi)容。描述標(biāo)簽也會(huì)被顯示在搜索結(jié)果當(dāng)中被用戶所見。

  (3)jquery標(biāo)簽的優(yōu)化,提升移動(dòng)用戶的使用體驗(yàn)。例如,滑動(dòng)切換圖片相比于自動(dòng)切換和點(diǎn)擊切換,滑動(dòng)切換增強(qiáng)了用戶操作的主動(dòng)性、隱藏標(biāo)簽和顯示標(biāo)簽實(shí)現(xiàn)動(dòng)畫效果,同時(shí)提升了切換的便捷性。

  4.3 移動(dòng)端頁面結(jié)構(gòu)的優(yōu)化

  使用三層的頁面結(jié)構(gòu)。由于移動(dòng)端是直接用手指操作,需要響應(yīng)元素點(diǎn)擊區(qū)域要相對(duì)明顯,布局上可以多上下排列。移動(dòng)網(wǎng)站的頁面加載速度要比普通網(wǎng)頁加載速度慢,所以減少頁面數(shù)量非常重要。用戶是不會(huì)有耐心不斷打開網(wǎng)頁上的,所以盡可能簡(jiǎn)化網(wǎng)站的布局也是很重要。一個(gè)標(biāo)準(zhǔn)的移動(dòng)站應(yīng)該包含首頁、列表頁和詳情頁三種類型,頁面類型及層級(jí)不超過三個(gè),保證簡(jiǎn)單、高效的用戶體驗(yàn)。使用盡量淺的頁間結(jié)構(gòu),減少用戶點(diǎn)擊次數(shù),提升瀏覽體驗(yàn)。

  4.4 移動(dòng)端網(wǎng)頁導(dǎo)航的優(yōu)化

  網(wǎng)頁導(dǎo)航可用性表現(xiàn)為用戶能快速地找到所需的信息,是用戶體驗(yàn)的重要實(shí)現(xiàn)方式。移動(dòng)網(wǎng)站可以采用的導(dǎo)航種類較PC端要少,按照范圍的不同,可以分為三大類:結(jié)構(gòu)性導(dǎo)航、關(guān)聯(lián)性導(dǎo)航和公用程序?qū)Ш健R话闶醉搶?dǎo)航可以分為導(dǎo)航式和內(nèi)容式兩種,導(dǎo)航式因其風(fēng)格簡(jiǎn)潔可起到快速傳達(dá)品牌形象的作用;內(nèi)容式因其豐富的內(nèi)容,可快速傳遞信息。通過導(dǎo)航,用戶可以知道所在頁面在整個(gè)網(wǎng)站中的位置,在移動(dòng)端導(dǎo)航中盡量使用文字鏈接,不要使用復(fù)雜的js或者flash。使用圖片做導(dǎo)航時(shí),可以使用Alt告訴搜索引擎所指向的網(wǎng)頁內(nèi)容。

  4.5 移動(dòng)端網(wǎng)頁屏幕分辨率的自適應(yīng)

  移動(dòng)端網(wǎng)站的頁面需做到以下三點(diǎn):一是頁面隨屏幕寬度變化,無橫向滾動(dòng)條;二是屏幕不放大時(shí),能清晰瀏覽內(nèi)容,文字大小不低于12像素;三是屏幕不放大時(shí),按鈕、鏈接等點(diǎn)擊方便,按鈕尺寸不能過大或過小。

  (1)根據(jù)移動(dòng)端屏幕的特點(diǎn)實(shí)現(xiàn)移動(dòng)端屏幕適配,需要用到如下代碼:

  例 如 : < meta name = " viewport " content="width=480,target-densitydpi=dpi,minimal-ui">,移動(dòng)頁面設(shè)計(jì) 480*854的比例。

  (2)橫豎屏的適配,需要用到Js的代碼控制如下所示:

  window.addEventListener("orientationchange",function () {

  This.isOrietation = true;

  This.changeOriention();

  });

  //執(zhí)行橫豎屏的事件都通過一個(gè)偵聽完成,做一個(gè)統(tǒng)一的管理;在屏幕橫豎屏切換完成之后再執(zhí)行相應(yīng)的事件C的代碼控制如下所示:

  @media screen and(orientation:landspace){...} //定義橫屏的顯示樣式

  @media screen and(orientation:portrait){...} //定義豎屏的顯示樣式

  @media only screen and(orientation:portrait) and(device-width:768px){...} //定義某個(gè)尺寸的特殊樣式 豎屏?xí)r寬度為768px 符合一般ipad的條件

  5 結(jié)論(Conclusion)

  移動(dòng)網(wǎng)絡(luò)搜索引擎在全球范圍內(nèi)正日益普及,移動(dòng)端網(wǎng)站設(shè)計(jì)優(yōu)化,如何提升用戶在移動(dòng)端的搜索體驗(yàn),如何將使得移動(dòng)端的網(wǎng)頁更加適合移動(dòng)平臺(tái)的發(fā)展特性,是當(dāng)前移動(dòng)網(wǎng)站設(shè)計(jì)者需要考慮的首要問題。

【淺談基于移動(dòng)搜索的網(wǎng)頁設(shè)計(jì)優(yōu)化研究論文】相關(guān)文章:

基于NURBS的葉片優(yōu)化設(shè)計(jì)研究07-29

淺談基于CATIA 的方程曲線設(shè)計(jì)建模研究論文10-25

優(yōu)化:淺談搜索引擎如何計(jì)算網(wǎng)頁權(quán)重 -電腦資料01-01

淺談如何設(shè)計(jì)橋梁與優(yōu)化方法的論文10-24

淺談基于移動(dòng)互聯(lián)技術(shù)的公共自行車租賃系統(tǒng)設(shè)計(jì)論文10-26

基于iSIGHT的多學(xué)科設(shè)計(jì)優(yōu)化技術(shù)研究07-29

基于iSIGHT的多學(xué)科設(shè)計(jì)優(yōu)化技術(shù)研究07-03

基于伴隨方程的翼型數(shù)值優(yōu)化設(shè)計(jì)方法研究07-15

基于混合優(yōu)化策略的目標(biāo)分配優(yōu)化研究08-17