據(jù)國(guó)內(nèi)三大運(yùn)營(yíng)商數(shù)據(jù)來(lái)看，中國(guó)的手機(jī)用戶數(shù)已達(dá)10億，超過(guò)2/5的手機(jī)用戶每個(gè)月都會(huì)從手機(jī)終端訪問(wèn)網(wǎng)頁(yè)，如今的手機(jī)端手機(jī)網(wǎng)站比例 有提升，但是對(duì)于這些存在的手機(jī)版本網(wǎng)站來(lái)說(shuō)，鄭州seo公司老秦查看了很大一部分手機(jī)網(wǎng)站，很少做SEO優(yōu)化工作，在這里，鄭州seo公司老秦認(rèn)為手機(jī)端的手機(jī)網(wǎng)站優(yōu)化并不是PC網(wǎng)站的簡(jiǎn)單copy過(guò)來(lái)的手機(jī)版本。
由于是手機(jī)用戶，用戶瀏覽網(wǎng)頁(yè)的時(shí)間是零碎的，不可能耐心點(diǎn)擊很多的頁(yè)面，因此，要想做好一個(gè)手機(jī)端網(wǎng)站的優(yōu)化，就需要盡可能在制作手機(jī)端手機(jī)網(wǎng)站的過(guò)程中精簡(jiǎn)手機(jī)網(wǎng)站設(shè)計(jì)，并要合理的做好手機(jī)端網(wǎng)站的SEO優(yōu)化。
一、手機(jī)端網(wǎng)站的頁(yè)面設(shè)計(jì)
網(wǎng)頁(yè)設(shè)計(jì)要盡可能的設(shè)計(jì)簡(jiǎn)單，手機(jī)端可視區(qū)域小，布局上不同于傳統(tǒng)網(wǎng)頁(yè)，需要充分利用有限的空間去展示信息。
1、頁(yè)面適配手機(jī)屏幕
隨著手機(jī)屏幕的不斷的增大，同時(shí)也遇到一些用戶手機(jī)屏幕還是處于240*320這種屏幕的大小，當(dāng)然也存著在一些不規(guī)則的屏幕分辨率心寸大小，對(duì)于很多的UI來(lái)說(shuō)，不同的手機(jī)屏幕很多時(shí)候得出多套的圖才能保證手機(jī)客戶端在不同的屏幕上實(shí)現(xiàn)匹配。
2、頁(yè)面專(zhuān)門(mén)針對(duì)手機(jī)屏幕設(shè)計(jì)
（1）、頁(yè)面隨屏幕寬度變化，無(wú)橫向滾動(dòng)條。
（2）、不放大時(shí)，能清晰瀏覽內(nèi)容，文字大小不低于12像素。
（3）、不放大時(shí)，按鈕、鏈接等點(diǎn)擊方便（具體可查看鄭州seo公司老秦博客《如何通過(guò)修改CSS樣式來(lái)增強(qiáng)平板電腦的用戶體驗(yàn)》的相關(guān)介紹），按鈕尺寸不能過(guò)大或過(guò)小。
3、使用更 多三級(jí)的頁(yè)面結(jié)構(gòu)
減少手機(jī)站的頁(yè)面層級(jí)，降低用戶認(rèn)知難度，一個(gè)標(biāo)準(zhǔn)的手機(jī)站應(yīng)該包含壹 頁(yè)、列表頁(yè)和詳情頁(yè)三種類(lèi)型，以滿足廣告主的推廣需求和用戶的認(rèn)知需要。
對(duì)于頁(yè)面類(lèi)型及層級(jí)，鄭州seo公司老秦建議不超過(guò)3個(gè)，保證簡(jiǎn)單、 的用戶體驗(yàn)，據(jù)鄭州seo公司老秦博客的分析，使用盡量淺的頁(yè)間結(jié)構(gòu)，減少用戶點(diǎn)擊次數(shù)，提升瀏覽體驗(yàn)。
（1）、壹 頁(yè)
整站內(nèi)容索引，內(nèi)容預(yù)覽(使用“更多”“詳情”等鏈接)，壹 頁(yè)作為用戶分流前到達(dá)的頁(yè)面，要求能夠匯集整個(gè)網(wǎng)站的大部分模塊和功能，以保證不同需求的用戶在著陸后都能尋找到自己想要的信息。
手機(jī)站一般壹 頁(yè)又可以分為導(dǎo)航式和內(nèi)容式，導(dǎo)航式因其風(fēng)格簡(jiǎn)潔，一般又可用作 宣傳，起到快速傳達(dá) 形象的作用，內(nèi)容式因其豐富的內(nèi)容，常用來(lái)快速傳達(dá)廣告主想傳遞的信息。
（2）、列表頁(yè)
頻道內(nèi)容、分類(lèi)、列表為主，列表頁(yè)一般用于展現(xiàn)結(jié)構(gòu)簡(jiǎn)單，并且重復(fù)度較高的內(nèi)容，更 常見(jiàn)于商家的產(chǎn)品/服務(wù)，形式也一般相對(duì)簡(jiǎn)單，用于滿足展現(xiàn)多產(chǎn)品/服務(wù)的需求，根據(jù)商家產(chǎn)品/服務(wù)信息不同一般分為純文字和圖文兩種基本形式。
（3）、內(nèi)容頁(yè)
推薦以結(jié)構(gòu)化形式展現(xiàn)內(nèi)容，詳情頁(yè)一般用作展示壹 頁(yè)和列表頁(yè)未顯示完全的信息，以滿足用戶了解詳情的需求，從而輔助用戶進(jìn)行決策。
4、使用清晰的導(dǎo)航組件
全站導(dǎo)航：快速到達(dá)各個(gè)頻道（具體可查看鄭州seo公司老秦博客《如何規(guī)劃并架構(gòu)網(wǎng)站的導(dǎo)航信息結(jié)構(gòu)》的相關(guān)介紹）；
局部導(dǎo)航：在單個(gè)頻道的壹 頁(yè)、列表、詳情頁(yè)面間手機(jī)；
相關(guān)鏈接：相關(guān)頻道之間的鏈接。
5、頁(yè)面單列布局，重要內(nèi)容顯示在壹 屏
頁(yè)面內(nèi)容模塊從上到下，單列布局，重要內(nèi)容展現(xiàn)在壹 屏。
6、保證良好的可用性
（1）、頁(yè)面內(nèi)容無(wú)缺失，交互功能正常使用。
（2）、不使用flash
（3）、使用html5來(lái)實(shí)現(xiàn)動(dòng)畫(huà)。
7、專(zhuān)業(yè) 交互方式，簡(jiǎn)化操作流程，提升使用體驗(yàn)
（1）、專(zhuān)業(yè) 的交互方式能很有效地提升用戶體驗(yàn)，一方面能夠簡(jiǎn)化操作流程提升操作效率，另外，鄭州seo公司老秦覺(jué)得這對(duì)于產(chǎn)品功能易用性的提升也是較大的。
（2）、滑動(dòng)切換圖片相比于自動(dòng)切換和點(diǎn)擊切換，滑動(dòng)切換增強(qiáng)了用戶操作的主動(dòng)性、同時(shí)提升了切換的便捷性。
（3）、滑動(dòng)切換頁(yè)面用戶可以通過(guò)滑動(dòng)進(jìn)行頁(yè)面之間的切換，節(jié)省用戶尋址時(shí)間。
（4）、點(diǎn)擊放大圖片點(diǎn)擊縮略圖放大圖片，減少了操作流程，一定程度上減少了因頁(yè)面跳轉(zhuǎn)帶來(lái)的用戶流失。
（5）、頁(yè)面區(qū)域點(diǎn)擊區(qū)域點(diǎn)擊能較大提升用戶點(diǎn)擊的效率，減少用戶因定位點(diǎn)擊區(qū)域造成的效率損失。
（6）、點(diǎn)擊加載更多一方面減少單張頁(yè)面的非必要信息，讓頁(yè)面變得簡(jiǎn)潔，同時(shí)能減少頁(yè)面間的跳轉(zhuǎn)，降低因網(wǎng)速等原因造成的用戶流失。
8、保證廣泛的兼容性
在主流操作系統(tǒng)、瀏覽器中均可正常展現(xiàn)，比如：操作系統(tǒng)：Android，iOS；瀏覽器：UC、QQ、iOS Safari、Android。
二、手機(jī)端網(wǎng)站內(nèi)容設(shè)置優(yōu)化
對(duì)于手機(jī)網(wǎng)站的壹 頁(yè)或者頻道壹 頁(yè)的網(wǎng)頁(yè)代碼中的keywords、description更好 加上與PC端有所區(qū)別的meta標(biāo)簽和關(guān)鍵詞，在每個(gè)頁(yè)面的關(guān)鍵字及描述像做傳統(tǒng)PC端網(wǎng)站一樣，做好針對(duì)性的填寫(xiě)工作，對(duì)搜索結(jié)果的展現(xiàn)(摘要)以及優(yōu)化工作大有幫助（具體可查看鄭州seo公司老秦博客《如何優(yōu)化一個(gè)手機(jī)端手機(jī)網(wǎng)站》的相關(guān)介紹）。
1、一致性
著陸頁(yè)內(nèi)容與關(guān)鍵字、廣告文字的相關(guān)性，不僅保證廣告與目標(biāo)頁(yè)面呼應(yīng)和一致，更重要的能夠提升潛在客戶在著陸頁(yè)上面的點(diǎn)擊次數(shù)，減少客戶流失。
2、可信度
通過(guò)告知潛在客戶公司名稱(chēng)、聯(lián)系地址、客服電話等信息，能夠有效地提升網(wǎng)站(公司)的可信度。
3、重要信息壹 屏顯示
具體產(chǎn)品信息盡量出現(xiàn)在網(wǎng)頁(yè)的第1-2屏，避免與用戶玩尋寶游戲。
4、根據(jù)行業(yè)特性，放置針對(duì)性的內(nèi)容
重點(diǎn)關(guān)注手機(jī)頁(yè)面的信息構(gòu)建，以滿足用戶需求；
基礎(chǔ)信息：公司介紹、產(chǎn)品/服務(wù)介紹。
信任信息：榮譽(yù)資質(zhì)、專(zhuān)家團(tuán)隊(duì)、案例。
轉(zhuǎn)化信息：電話、地址。
5、精簡(jiǎn)文字，處理好圖片
精簡(jiǎn)文字量：PC內(nèi)容一半左右。
使用圖片、幻燈片提升展示效果，并注意壓縮圖片尺寸。
推薦用寬圖片展示LOGO，正方形圖片展示產(chǎn)品。
三、優(yōu)化手機(jī)端頁(yè)面性能
隨著手機(jī)互聯(lián)網(wǎng)的發(fā)展，我們?cè)桨l(fā)要關(guān)注手機(jī)頁(yè)面的性能優(yōu)化，我們能做得是對(duì)手機(jī)端頁(yè)面本身優(yōu)化，這也是我們專(zhuān)業(yè)價(jià)值的體現(xiàn)，所以我們需要 做手機(jī)端頁(yè)面性能優(yōu)化（具體可查看鄭州seo公司老秦博客《手機(jī)網(wǎng)站制作的常用方法及優(yōu)化技巧》的相關(guān)介紹）。
1、控制加載時(shí)間與網(wǎng)頁(yè)大小
跳出前等待時(shí)間的用戶比例；
加載時(shí)間：?jiǎn)雾?yè)面5S以內(nèi)；
網(wǎng)頁(yè)大小：?jiǎn)雾?yè)面50K以內(nèi)；
優(yōu)化加載時(shí)間和網(wǎng)頁(yè)大?。褐攸c(diǎn)在前端優(yōu)化；
減少HTTP請(qǐng)求：減少重定向，合并圖片，懶加載；
減少傳輸數(shù)據(jù)大?。簤嚎s圖像，開(kāi)啟GZIP……；
考慮到手機(jī)設(shè)備和手機(jī)互聯(lián)網(wǎng)的特點(diǎn)，鄭州seo公司老秦建議在進(jìn)行手機(jī)網(wǎng)站的頁(yè)面開(kāi)發(fā)設(shè)計(jì)時(shí)，一個(gè)總的原則是考慮用戶訪問(wèn)的效率，降低頁(yè)面加載時(shí)間（具體可查看鄭州seo公司老秦博客《提高網(wǎng)站在手機(jī)端打開(kāi)速度的方法技巧》的相關(guān)介紹）。
2、減少訪問(wèn)請(qǐng)求數(shù)
從設(shè)計(jì)實(shí)現(xiàn)層面簡(jiǎn)化頁(yè)面，不要放太多的圖片、復(fù)雜的表達(dá)、動(dòng)畫(huà)、視頻等等。
資源合并及壓縮：比如將背景圖片、導(dǎo)航圖片等等作為一張圖片，這樣只需一次請(qǐng)求，而不是多次。
靜態(tài)資源(Css、Js、Image)懶加載；
異步執(zhí)行inline腳本；
避免重復(fù)的資源請(qǐng)求；
縮小cooike；
設(shè)置連接方式為keep-alive；
減少DNS查詢；
手機(jī)端可見(jiàn)區(qū)域是有限的，采用延遲加載方式；
開(kāi)啟服務(wù)器壓縮(gzip方式)。
3、優(yōu)化圖片處理
圖片走CDN；
少用動(dòng)態(tài)gif圖；
圖片不適宜過(guò)多及過(guò)大；
避免使用bmp圖片；
圖片壓縮；
零碎圖片使用css Sprite技術(shù)一次性下載。
4、優(yōu)化HTML
減少HTML標(biāo)簽，減少不必要的嵌套；
廢棄table標(biāo)簽；
減少DOM深度；
壓縮HTML，去掉注釋?zhuān)崭駬Q行等信息。
5、優(yōu)化JS
使用臨時(shí)變量或者數(shù)組存儲(chǔ)document.images及document.forms等集合數(shù)據(jù)；
慎用with語(yǔ)法；
使用AJAX緩存；
避免eval及Function語(yǔ)法；
避免使用inlineScript；
異步、底部加載js；
合并壓縮js；
字符串連接使用數(shù)組的join方式。
鄭州seo公司老秦博客點(diǎn)評(píng)：
無(wú)論是PC端還是手機(jī)端，網(wǎng)站都要考慮清楚消費(fèi)群體的定位問(wèn)題，雖然智能手機(jī)用戶數(shù)量非常普及，但是要明白中國(guó)的大部分手機(jī)用戶使用的網(wǎng)絡(luò)速度還是遠(yuǎn)不及PC端的，所以，在頁(yè)面設(shè)計(jì)時(shí)，要考慮到用戶打開(kāi)網(wǎng)頁(yè)的時(shí)長(zhǎng)，這不僅僅是用戶體驗(yàn)的問(wèn)題，也是盡量減少百度索引抓取的工作，讓百度蜘蛛盡可能多的爬行和收錄頁(yè)面。
版權(quán)聲明：本站部分文章，由 鄭州路普科技整理發(fā)表(信息來(lái)自互聯(lián)網(wǎng),不代表本站觀點(diǎn))，如有冒犯請(qǐng)聯(lián)系我們
