5大移動網頁設計之最佳實踐
5大移動網頁設計之最佳實踐-移動閱讀二維碼

5大移動網頁設計之最佳實踐

移動設備的興起正在給互聯網帶來一場新的革命,雖然說移動網頁設計原則不會有多大變化,但是卻有著明顯的區別。

至少有一點是截然不同的,目前移動設備的網絡速度可比不上寬帶,另外移動網頁呈現方式也是多樣的,有觸摸屏,有上網本,這些小屏幕卻貌似巨人!

可能有些人會認為移動化其實根本沒必要,但是幾乎所有人都得承認這是一個不可避免的趨勢。

如果你正在研究移動網頁設計(或者正在將一個網站搬到移動設備上),這篇文章或許可以幫助你了解到目前移動設計的發展趨勢。

呈現方式

在設計對移動設備友好的網站時,首先要考慮的元素之一就是呈現方式或者用戶體驗方式。

呈現方式的多樣化

理想的情況就是你現在的網站適用于所有類型的移動設備。也許你的網站可以適用于iPhone等擁有內置瀏覽器的移動設備,不過卻在其他的移動設備上,情況未必如此好,而跨設備移動設計卻又難以獲得成功。

如果你認為開發出在IE/Firefox/Chrome/Safari等瀏覽器的網站很艱難,其實可以不妨試試開發專門針對iPhone/BlackBerrys/Palm Pres/Androids/Motorola/Nokia的網站,不過你很快就會發現這些硬件設備真是太多了。

在桌面網絡設計中,你只有一種語言:HTML,但是在移動網絡上,可能是WML,平臺也可能是蘋果的iOS,或者是Android。

雖然WML曾一直限制著我們的設計創意,但是如今我們所擁有的方式變得更加靈活了!

NO1:采用支持移動設備的網頁設計

在移動網頁設計上,一個簡單的處理方法就是對現存的桌面網頁代碼和設計進行調整,以適用于移動設備,還有就是從草圖做起,一步步的設計。例如,通過CSS3,你可以根據用戶的移動設備來調整網頁布局等等。

但你想想看,問題在于并不是所有移動設備都支持CSS3,所以你得求助于服務器設備偵查或者JavaScript(例如調整DOM來改變頁面布局)。不過問題又來了,有些設備又不支持這些技術!

依據窗口來決定布局大小,或許只需幾行CSS3。

NO2:將移動用戶轉向手機版網站

移動設計呈現的另一種方式就是專門針對手持設備而優化的布局,你可以利用Mobify等網絡服務來做到這點。

與第一種方法相比(采用支持移動設備的網頁設計),這種呈現格式更加優秀,因為體驗設計是專門針對移動用戶的,不考慮桌面用戶。

這種情況下,你的流量取決于用戶的瀏覽器代理。例如,如果一個移動設備用戶訪問你的網站(yousitename.com),然后他們會比自動轉向至mobile.yoursitename.com或者m.yoursitesname.com等之類的。

獨立的手機網站會獲得那些喜歡更快的速度的用戶所帶來的流量。

NO3:用戶引導要點

無論你使用何種方式,下面兩點是很重要的:

訪問者知道你的手機版網站是可以登錄的。

訪問者可以選擇是登陸手機版網站還是普通版網站(譯者:就是PC版網站)。

雖然強行為用戶轉向或者改變布局聽起來似乎是個好主意,但是結果往往會令人沮喪,所以最好還是讓用戶可以選擇。

簡單的技巧就是有這兩個版本的網站的鏈接。例如,Six Revisions,你會發現在該網站的地段會有手機版網站的鏈接(m.sixrevisions.com),這樣無論是手機用戶還是電腦用戶都有了選擇。

頁碼: 1 2 3 4 下一頁

本文鏈接:http://www.casaleticia.com/5-mobile-web-design-practices.html
本文標簽: , , , , , ,