手機(jī)網(wǎng)站建設(shè)逐步普及,手機(jī)網(wǎng)站所占比重逐年上升。因此在
網(wǎng)站建設(shè)時(shí),手機(jī)網(wǎng)站的布局成了一個(gè)重頭戲。下面我們說說
手機(jī)網(wǎng)站建設(shè)注意細(xì)節(jié)攻略.
布局
我們一起來看看不同元素在布局中的使用情況:
(1) 標(biāo)志
標(biāo)志是布局的核心之一。標(biāo)志要盡可能做到引人注目,但與此同時(shí),應(yīng)注意它的尺寸,并確保它的大小不會超過2KBs。因?yàn)?,移動網(wǎng)絡(luò)載入圖片通常要花很長時(shí)間,你也不想因?yàn)閭€(gè)體差異而使得自己的網(wǎng)站載入不完全。
(2) 網(wǎng)站導(dǎo)航
導(dǎo)航是設(shè)計(jì)中最重要的事之一。不管怎樣,你都需要導(dǎo)航欄來鏈接到網(wǎng)站的各個(gè)位置,它的位置通常在網(wǎng)站頂部。你也明白,大多數(shù)移動設(shè)備根本不便于使用QWERTY實(shí)體或虛擬鍵盤。因此,為網(wǎng)站創(chuàng)建導(dǎo)航是移動網(wǎng)站界面友好的一個(gè)關(guān)鍵環(huán)節(jié)。
(3)內(nèi)容
內(nèi)容在移動網(wǎng)站中占據(jù)著核心位置。人們用移動設(shè)備訪問網(wǎng)站,最主要的目的就是為了獲取內(nèi)容信息。所以要確保你的移動網(wǎng)站的內(nèi)容不會有任何改變,否則,你最終可能將面對用戶流失。
人們使用移動設(shè)備時(shí),通常處于移動狀態(tài),所以他們沒有太多時(shí)間來瀏覽網(wǎng)站內(nèi)容。為此,你應(yīng)該采取縮減內(nèi)容的措施,并選取內(nèi)容中有價(jià)值的部分,與此同時(shí),你要將完整內(nèi)容的鏈接提供給用戶。如果你的個(gè)人博客處于活躍狀態(tài),你可以忽略這個(gè)問題,因?yàn)?,你不會每天都去對每篇博文的?nèi)容進(jìn)行縮減。
我們都明白圖片在內(nèi)容中的重要性。但是移動網(wǎng)站不宜使用過多圖片,因?yàn)?,大部分手機(jī)載入這些圖片要花很長時(shí)間,所以盡可能地少用,如若上下文中涉及到相關(guān)圖片時(shí),圖片則不可少。
如果你希望在移動網(wǎng)站上添加圖片,最好使用占用
空間小的.JPEG,.GIF,.PNG等圖片格式。為了避免用戶對圖片進(jìn)行縮放,一定要對圖片進(jìn)行壓縮?,F(xiàn)在幾乎所有的設(shè)備都能顯示圖片,但是,有些用戶可能在瀏覽時(shí)會關(guān)閉圖片顯示。因此,推薦大家用ALT替換文本顯示圖片信息。一些讀者或訪問者會放大圖片,為了避免這種情況,圖片的尺寸必須固定。
(4)頁腳:
老話說得好:“看男人不能只看它的衣服,要看它的鞋”。許多網(wǎng)站的頁腳做得非常爛。我經(jīng)常逛博客和營銷網(wǎng)站,看到頁腳放慢了雜亂的超鏈接,我跟大多數(shù)人對此都非常厭惡,再加之,移動網(wǎng)站的屏幕尺寸小,這就可能造成客戶或讀者流失。所以,制作吸引人的頁腳非常有必要。
所以,如果你希望你的應(yīng)用程序/網(wǎng)站的移動界面大獲全勝,你就應(yīng)該把重心放在布局上面,做到零錯(cuò)誤,因?yàn)橛靡苿釉O(shè)備進(jìn)行網(wǎng)頁瀏覽將會是未來發(fā)展的大趨勢。
代碼設(shè)計(jì)
很多開發(fā)新人在寫移動界面代碼時(shí)一直很猶豫,下面的建議有助于你打消這些考疑慮:
(1)有效代碼
使用合適的代碼,確保其100%有效,因?yàn)榇蟛糠忠苿訛g覽器達(dá)不到電腦端的瀏覽器性能。
(2)流動布局:
在所有移動瀏覽器上查看布局效果,這往往是不現(xiàn)實(shí)的,因?yàn)橛脕頌g覽網(wǎng)頁的移動設(shè)備太多,逐一去追蹤效果讓人很頭疼。流動布局可以很好解決或避開這個(gè)問題,它可以根據(jù)屏幕尺寸自動調(diào)整。
(3) 具體的樣式表
你可隨時(shí)使用各種移動設(shè)備找出更好的用戶體驗(yàn)。比如,使用手持設(shè)備瀏覽你的網(wǎng)站的用戶。
(4)拒絕使用花哨的腳本
你的移動網(wǎng)站想要成功,不要使用Javascript腳本,F(xiàn)lash動畫或其它任何花哨的腳本語言。因?yàn)榇蠖鄶?shù)移動設(shè)備無法解析這些腳本語言,最終,要么設(shè)備死機(jī),要么出亂子。
如果你非用不可的話,那么就應(yīng)該給出友情提示,告知用戶他們的移動設(shè)備正在載入和啟用這些腳本。如果出了差錯(cuò),也錯(cuò)不在你,因?yàn)槟闶孪纫呀?jīng)提醒了他們。
(5)小心插入廣告
這一點(diǎn)應(yīng)該引起大家的重視,不要讓你的移動網(wǎng)頁鋪天蓋地都是廣告,PC端的網(wǎng)站同樣也應(yīng)該注意這個(gè)問題。
俗話說得好:“一顆耗子屎攪壞一鍋湯”。這對許多網(wǎng)站而言,倒是大實(shí)話。因?yàn)樵S多網(wǎng)站都是廣告滿天飛,他們根本不關(guān)心用戶體驗(yàn),一個(gè)個(gè)都唯利是圖。因?yàn)橐苿釉O(shè)備的CPM(每千人瀏覽頁面的費(fèi)用)很高。
所以我建議,不要讓網(wǎng)站淹沒在廣告里,尤其不要插入那些五顏六色的廣告。
(6)自動識別移動瀏覽器
為了成功打響你的招牌,你應(yīng)該在服務(wù)器端納入“移動瀏覽器偵測和重定向”服務(wù)的腳本(比如說PHP)。你可能用得著User Agent偵測服務(wù),服務(wù)器會根據(jù)當(dāng)前瀏覽器所描述的信息來判定它應(yīng)該訪問移動還網(wǎng)頁還是原網(wǎng)頁。你可以用User Agent 偵測替代前面提到的“PHP移動瀏覽器偵測”。再介紹另一例實(shí)現(xiàn)辦法,通過實(shí)時(shí)的JavaScript腳本語言,請求存儲了設(shè)備相關(guān)信息的DeviceAltlas或WURFL數(shù)據(jù)庫,進(jìn)行瀏覽器判定。
(7)可開發(fā)專門的客戶端程序
如果你的用戶群體數(shù)量非常高,可以為此開發(fā)一款針對多種移動界面的應(yīng)用程序。Facebook、Gmail、Twitter、Yahoo以及許多大公司都有自己的客戶端應(yīng)用程序,這也是他們?nèi)绱顺晒Φ脑颉H绻阌辛俗约旱目蛻舳顺绦?,就不必再?dān)心那些花哨的腳本語言了,因?yàn)槟憧梢园凑兆约旱姆绞教嵘绦蛐阅堋?
分享文章:手機(jī)網(wǎng)站建設(shè)注意細(xì)節(jié)攻略
鏈接分享:http://www.rwnh.cn/news/33655.html
網(wǎng)站建設(shè)、網(wǎng)絡(luò)推廣公司-創(chuàng)新互聯(lián),是專注品牌與效果的網(wǎng)站制作,網(wǎng)絡(luò)營銷seo公司;服務(wù)項(xiàng)目有網(wǎng)站建設(shè)、手機(jī)網(wǎng)站建設(shè)等
廣告
聲明:本網(wǎng)站發(fā)布的內(nèi)容(圖片、視頻和文字)以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主,如果涉及侵權(quán)請盡快告知,我們將會在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場,如需處理請聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載,或轉(zhuǎn)載時(shí)需注明來源:
創(chuàng)新互聯(lián)