制作手機(jī)網(wǎng)站有哪些優(yōu)化技巧_手機(jī)網(wǎng)站制作優(yōu)化有什么技巧
手機(jī)網(wǎng)站也是現(xiàn)在很流行的一種,那么如何才能做好手機(jī)網(wǎng)站的建設(shè)呢?下面由學(xué)習(xí)啦小編為大家整理的手機(jī)網(wǎng)站制作的優(yōu)化技巧,希望大家喜歡!
手機(jī)網(wǎng)站制作的優(yōu)化技巧
一、開發(fā)前寫好需求和制作方案
這跟PC端網(wǎng)站、版面的搭建是一樣的,移動(dòng)端因?yàn)槭墙鼛啄觌S著智能手機(jī)的普及才空前發(fā)展起來的,可以說大部分業(yè)內(nèi)人士還是在嘗試,為了提高開發(fā)效率,這就需要跟程序員在開發(fā)前進(jìn)行功能、版面效果實(shí)現(xiàn)方式上的探討和確定,如果有個(gè)參考網(wǎng)站是最好的。
二、移動(dòng)端url適配
首先需要實(shí)現(xiàn)移動(dòng)設(shè)備訪問PC頁面進(jìn)行自動(dòng)跳轉(zhuǎn),然后再去各大搜索引擎站長平臺進(jìn)行移動(dòng)端適配url提交。
三、頁面內(nèi)容友好度
頁面內(nèi)容的友好度是對真實(shí)訪客和搜索引擎兩者的友好:
1、頁面代碼簡潔、不冗余、要做頁面壓縮等;
2、重要的內(nèi)容要在html中以文本的可讀形式進(jìn)行展示,而不要將這些內(nèi)容放到搜索引擎不可讀js、圖片中;尤其是js;
3、圖片尺寸能自適應(yīng),在不同屏幕尺寸進(jìn)行很好的展示,并且要控制好圖片文件大小;
4、TDK標(biāo)簽,個(gè)人認(rèn)為這移動(dòng)網(wǎng)站的標(biāo)題、描述和關(guān)鍵詞大部分情況下是可以跟PC端一致的,當(dāng)然因?yàn)橐苿?dòng)設(shè)備的屏幕限制,為了更好的閱讀體驗(yàn),如果PC端標(biāo)題過長可以進(jìn)行適當(dāng)?shù)恼{(diào)整。
四、不斷的測試、完善
做過程序開發(fā)或者跟蹤的,相信都會知道其實(shí)后期的程序測試和完善都是最花時(shí)間的。而網(wǎng)站手機(jī)版的測試除了對不同頁面和功能實(shí)現(xiàn)進(jìn)行測試,還需要用不同手機(jī)尺寸、手機(jī)系統(tǒng)、不同的手機(jī)瀏覽器和不同設(shè)備進(jìn)行測試,安卓、ios、UC瀏覽器、百度瀏覽器、微信內(nèi)置瀏覽器、智能手機(jī)、平板電腦等。最重要的一點(diǎn),程序修善所有的需求后,一定要所有頁面和展現(xiàn)設(shè)備再全面測試一遍。
五、PC站和移動(dòng)站配置方式的選擇
目前PC站與移動(dòng)站配置方式主要有三種:跳轉(zhuǎn)適配、代碼適配、自適應(yīng)。
1、跳轉(zhuǎn)適配通俗的講就是新建個(gè)手機(jī)網(wǎng)站,移動(dòng)端訪問pc網(wǎng)頁時(shí)能進(jìn)行識別并跳轉(zhuǎn)到相應(yīng)的手機(jī)版面,是目前國內(nèi)被使用最廣的配置方式;
2、代碼適配和自適應(yīng)都是在原網(wǎng)址中給用戶展現(xiàn)手機(jī)版面,其中代碼適配是識別不同的訪問設(shè)備類型生成不同的html,而自適應(yīng)是根據(jù)屏幕尺寸以不同方式進(jìn)行呈現(xiàn),html代碼是相同的。
手機(jī)網(wǎng)站制作優(yōu)化的注意點(diǎn)
一、智能手機(jī)優(yōu)化網(wǎng)站的相關(guān)建議
建立目標(biāo)是智能手機(jī)的網(wǎng)站的時(shí)候,谷歌支持以下三個(gè)不同的配置:
網(wǎng)站使用響應(yīng)式設(shè)計(jì)在同一個(gè)URL下可在所有的設(shè)備下使用,這是谷歌最為推薦的設(shè)置。
第二種和原網(wǎng)站使用同樣的URL,但是每個(gè)URL使用不同的HTML(和CSS)展現(xiàn)取決于用戶使用的哪種桌面和移動(dòng)設(shè)備。
建立單獨(dú)的移動(dòng)網(wǎng)站。
二、響應(yīng)式網(wǎng)站設(shè)計(jì)
響應(yīng)式設(shè)計(jì)師構(gòu)建Web頁面的一種技術(shù),無論使用什么設(shè)備訪問頁面,其HRML代碼都不會變化。
使用響應(yīng)式網(wǎng)頁設(shè)計(jì)的優(yōu)點(diǎn),包括:
移動(dòng)端和PC端的內(nèi)容是同一個(gè)URL,更便于用戶的交互,分享和鏈接。對于谷歌算法來說,也更容易根據(jù)你的內(nèi)容分配指定的索引屬性。
三、設(shè)備特定的HTML
然而,我們知道很多情況下所有網(wǎng)站都使用響應(yīng)式設(shè)計(jì)是不太可能的。這是為什么我們支持網(wǎng)站使用設(shè)備特定的HTML。設(shè)備指定HTML可以識別相同的URL(配置稱為動(dòng)態(tài)服務(wù))或不同的網(wǎng)址。
如果你的網(wǎng)站使用動(dòng)態(tài)服務(wù)配置,我們強(qiáng)烈建議使用不同的HTTP告知緩向服務(wù)器和谷歌算法在用戶代理請求頁面的時(shí)候內(nèi)容可能會改變。我們也用此給Googlebot-Mobile作為一個(gè)抓取標(biāo)志。
這些注釋將幫助谷歌更好的發(fā)現(xiàn)你智能手機(jī)優(yōu)化的內(nèi)容,且?guī)椭雀杷惴靼變?nèi)容的結(jié)構(gòu),有機(jī)會在搜索結(jié)果里面獲得更好的展現(xiàn)。
8個(gè)手機(jī)網(wǎng)站優(yōu)化技巧
1、定位和頁面設(shè)計(jì)
?、贌o論是PC端還是移動(dòng)端,網(wǎng)站都要考慮清楚目標(biāo)客戶的定位問題。這個(gè)可以參考之前老牛講到過的多次網(wǎng)站定位問題,比如搞清楚“目標(biāo)客戶”和“目標(biāo)客戶的客戶”分別要的是什么。
?、谠陧撁嬖O(shè)計(jì)時(shí),要考慮到用戶打開網(wǎng)頁的時(shí)長,避免使用彈窗、flash、javascript等技術(shù)。這不僅僅是影響用戶體驗(yàn),同時(shí)對于搜索引擎而言,基本理解不了。我們要盡量減少百度索引抓取的工作,讓百度蜘蛛盡可能多的爬行和收錄頁面。
在技術(shù)層面來講,Apple產(chǎn)品不支持Flash功能,同時(shí)Flash會占用大量的流量和網(wǎng)速,目前已經(jīng)處于邊緣化,地位逐漸被HTML5所替代。
2、網(wǎng)站盡可能簡潔
?、偈謾C(jī)網(wǎng)站比PC端網(wǎng)站的頁面下載速度要慢得多,因此盡量把頁面數(shù)和頁面大小控制到最低。
?、诖送?,手機(jī)用戶瀏覽網(wǎng)頁的時(shí)間是零碎的,不可能耐心點(diǎn)擊很多的頁面,而且瀏覽習(xí)慣是縱向(上下)滑動(dòng)。因此,網(wǎng)站首頁可以多屏設(shè)計(jì),但是要盡可能的減少網(wǎng)站頁面層級。
?、圩稍兲筋^盡可能精簡再精簡,從客戶進(jìn)入網(wǎng)站到詢盤盡可能提供最直接的方式,比如電話咨詢,杜絕在線留言、發(fā)郵件等。
然后放大招,內(nèi)容涉及到專業(yè)術(shù)語,建議專業(yè)優(yōu)化以站長對比檢查:
3、域名和robots設(shè)置。
?、儆蛎M可能簡短易記,大部分手機(jī)版網(wǎng)站的域名是PC端網(wǎng)站的二級域名,當(dāng)然這個(gè)也很好,與傳統(tǒng)網(wǎng)站保持一致,更讓重視用戶信賴。
?、趓obots設(shè)置上最好不要任何限制,讓所有搜索引擎抓取。另外小生在這里糾正一個(gè)很多站長想當(dāng)然的誤區(qū),百度官方聲明百度spider的爬蟲UA是Baiduspider(www 和wap 一致),個(gè)別站長經(jīng)常會誤認(rèn)為百度手機(jī)爬蟲的UA是baiduspider-mobile,其實(shí)沒這回事。
4、頁面細(xì)節(jié)優(yōu)化。
①專屬的手機(jī)網(wǎng)站頭部標(biāo)簽。
對于手機(jī)網(wǎng)站的首頁或者頻道首頁的網(wǎng)頁代碼中的keywords、description最好加上與PC端有所區(qū)別的meta標(biāo)簽和關(guān)鍵詞,在每個(gè)頁面的關(guān)鍵字及描述像做傳統(tǒng)PC端網(wǎng)站一 樣,做好針對性的填寫工作。對搜索結(jié)果的展現(xiàn)(摘要)以及優(yōu)化工作大有幫助。
?、跍p少死鏈。
如果沒有內(nèi)容,最好用狀態(tài)碼指定,比如404、403 等;如果內(nèi)容死鏈希望重定向到首頁,最好通過302重定向跳轉(zhuǎn),不要使用javascript的動(dòng)態(tài)請求方式跳轉(zhuǎn)。
5、使用規(guī)范化的協(xié)議,做好瀏覽器兼容調(diào)試工作。
一般來說手機(jī)建站有xhtml、html5、wml 三種協(xié)議,最好使用規(guī)范化、標(biāo)準(zhǔn)化的協(xié)議格式,避免造成不必要的麻煩。當(dāng)然也可以做多個(gè)版本的站點(diǎn),站點(diǎn)進(jìn)行不同版式的自動(dòng)適配。
6、url鏈接規(guī)范化。
?、賹τ诙鄠€(gè)板塊的二級域名或者目錄來說,使用規(guī)范、簡單的url,盡量去除與頁面內(nèi)容無關(guān)的參數(shù),如用來區(qū)分手機(jī)型號、區(qū)分訪問用
戶,方便統(tǒng)計(jì)參數(shù)。
?、陧撁鎢rl鏈接跳轉(zhuǎn)最好是正常格式的目標(biāo)url,不要有太多的參數(shù)夾在在url中間進(jìn)行跳轉(zhuǎn)。
7、做好移動(dòng)版與PC版網(wǎng)站的轉(zhuǎn)換。
①確保在手機(jī)網(wǎng)站或者PC端網(wǎng)站各個(gè)頁面上有相應(yīng)的導(dǎo)航或者提示鏈接,讓用戶可以在手機(jī)版和PC版進(jìn)行切換,也便于搜索引擎更好的收錄。
②百度官方曾聲明,對于移動(dòng)站點(diǎn),當(dāng)baiduspider ua或者其它無法確定來源的ua訪問時(shí),建議默認(rèn)情況下直接返回html5 或xhtml 類型的移動(dòng)頁面,不要重定向到PC頁面。
8、其它優(yōu)化事項(xiàng)。
其它一些優(yōu)化要點(diǎn)與傳統(tǒng)PC端網(wǎng)站優(yōu)化一樣。如網(wǎng)站結(jié)構(gòu)要用合理的樹形結(jié)構(gòu),最好采用樹形和扁平相結(jié)合;清晰的面包屑導(dǎo)航,方便搜索引擎爬行抓取和用戶體驗(yàn);title寫法要盡量包含關(guān)鍵字,首頁、頻道頁、內(nèi)容頁寫法要有所側(cè)重。