很多人認為這些適合網(wǎng)頁設(shè)計的原則和指南也同樣適用于移動平臺。畢竟,網(wǎng)頁設(shè)計是從一些基礎(chǔ)的,基于文本的HTML出發(fā),才發(fā)展成為今天的WEB標準的。因此,我們也可以想象依靠這些原則,手機站點的設(shè)計也會和網(wǎng)頁站點的設(shè)計一樣,獲得巨大的成功。
然而,移動站點的設(shè)計仍處于初步階段。Jakob Nielsen在2009年移動可用性調(diào)查時指出,相比與網(wǎng)頁站點80%的成功率,用戶使用移動設(shè)備查看移動站點時平均成功率只有64%, 形式要素的差異對用戶交互成功率的影響是巨大的,因此,在進行移動站點的設(shè)計時要充分考慮移動設(shè)備的形式要素,
隨著手機站點設(shè)計的持續(xù)增長,一些新的原則,以及一些好的設(shè)計實踐將會浮出水面。作為前進的第一步,本人通過分析一些成功的手機站點來研究兩者的不同。在我的研究中,涵蓋了航空,電子商務(wù),社交網(wǎng)站,娛樂等一些較成功的站點,并得出了至少10個區(qū)別。
1. 內(nèi)容優(yōu)先
桌面站點可以有1024*768的分辨率,而智能機僅有320*480分辨率,如何在如此小的分辨率中,在不降低用戶體驗效果前提下進行設(shè)計是很有挑戰(zhàn)性的。桌面站點常常包涵更廣的內(nèi)容,而移動站點僅包涵一些符合使用情境的主要功能和特征,如圖1、圖2所示Orbitz的桌面站點和移動站點。移動站點應(yīng)該通過移動設(shè)備將用戶最需要的內(nèi)容和特征展現(xiàn)給用戶。一些站點內(nèi)容,信息架構(gòu)和屏幕布局都是在深度理解客戶需求的前提下設(shè)計的。
圖 1—Orbitz桌面站點特征
圖 2—Orbitz移動站點特征
2. 垂直瀏覽取代水平瀏覽
如圖三Urban Outfitters站點所示的那樣,在呈現(xiàn)數(shù)據(jù)結(jié)構(gòu)和數(shù)據(jù)內(nèi)容時,水平導(dǎo)航是一種廣泛采用的導(dǎo)航方式。用戶可以從左到右,點擊不同的站點鏈接來瀏覽。Joshua Porter在一篇名為“The Challenge of Moving to Horizontal Navigation“的博客中,討論了在頁面頂端而不是頁面兩側(cè)使用水平導(dǎo)航的好處。至于頂端時,用戶可以更容易聚焦于頁面的內(nèi)容,而在兩側(cè)時,會很容易干擾用戶視線。在我的研究中,90%的移動站點采用垂直導(dǎo)航的方式取代水平導(dǎo)航,包括如下圖所示的Urban Outfitters移動站點。
圖 3—Urban Outfitters桌面站點中的水平導(dǎo)航
圖 4—Urban Outfitters移動站點的垂直導(dǎo)航
3. 導(dǎo)航條,標簽和超文本
如圖5所示,超鏈接是因特網(wǎng)站點的主要組成部分,然而,在移動站點中,我們則很少看到超鏈接。并不是在移動站點中沒有超鏈接,而是被一些導(dǎo)航條,標簽和按鈕等取代了,如圖6所示。用戶使用手指來操作移動設(shè)備是產(chǎn)生垂直導(dǎo)航方式的原因之一。
在電腦上,移動鼠標,點擊超鏈接是很理想的查看信息的方式,但是在移動設(shè)備中,通過手指觸摸屏幕來打開超鏈接就不那么容易了。用戶可以很容易激活一個鏈接,進入一個新頁面,但,這并不是用戶期望的頁面,如果這樣的話,會產(chǎn)生非常差的體驗效果。Fitts定律告訴我們使用指點設(shè)備達到一個目標的時間與設(shè)備當前的位置和目標位置的距離,以及目標的大小有移動的關(guān)系。在一些大的手機站點中,導(dǎo)航條,標簽和按鈕會吸引更多的注意力。
圖 5—Kayak 網(wǎng)頁鏈接
圖 6—Kayak 手機頁,沒有鏈接
4. Text and Graphics文本和圖形
在網(wǎng)頁中,我們經(jīng)常會看到一些促銷,營銷或者導(dǎo)航的圖形信息。如圖7所示的dell站點,設(shè)計者經(jīng)常需要設(shè)計一些促銷或營銷的圖形,如圖8所示、公司LOGO始終保持著導(dǎo)航的目標,通過它,用戶可以進入主頁。而在移動站點設(shè)計中,應(yīng)該減少這些圖形,原因有二:其一,一些移動設(shè)備并不支持和傳統(tǒng)網(wǎng)頁站點一樣顯示方式;其二,移動屏幕較小,顯示內(nèi)容有限,除此之外,過多的顯示內(nèi)容會降低移動設(shè)計的運行速度。
圖 7—Dell首頁,有圖形
圖 8—Dell 移動頁,只有較少的圖形