- 相關(guān)推薦
手機網(wǎng)頁設(shè)計技巧
導(dǎo)語:如果你希望你的網(wǎng)頁更好地適配移動設(shè)備,那么你必須解決網(wǎng)頁在所有移動設(shè)備上的兼容性問題。下面是一些改進方法,歡迎參考!
1. 把搜索欄放在醒目的位置
如果搜索是你網(wǎng)頁里的一個主要的功能,那么就把它放在網(wǎng)頁的主要位置,因為這是讓有明確目的的用戶找到他們想要東西的最快途徑。用戶在查找特定消息時,通常會選擇搜索。
所以,搜索欄應(yīng)該是放在手機用戶一下子就能看到的地方。你可以把你的網(wǎng)頁搜索欄放置在接近主頁頂部的位置,并附上搜索說明文字。
2. 設(shè)計好你的網(wǎng)頁,不要讓用戶通過捏拉來縮放網(wǎng)頁
通過捏拉網(wǎng)頁來查看文本或照片時,常常會使用戶感到心累。如果用戶不得不通過捏拉來查看網(wǎng)頁,很可能會錯過一些重要的細節(jié)信息。因此,你設(shè)計的網(wǎng)頁應(yīng)該是不需要調(diào)整大小才能使用的。
Asos 使用了合適的照片尺寸,但字體卻不夠大。在小而亮的屏幕中看這些小字體實在是會令用戶頭疼:
3. 只使用高質(zhì)量的網(wǎng)頁素材
由于沒有實體商品,所以你的照片、視頻跟其他內(nèi)容就是你呈現(xiàn)給用戶的商品。因此,它們必須是高質(zhì)量的,這樣才能在用戶瀏覽網(wǎng)頁時,吸引他們的眼球,使其點擊網(wǎng)頁查看更多信息。
4. 設(shè)計手指友好操作的圖標(biāo)
如果你在設(shè)計一個手指操作友好的界面,那么你網(wǎng)頁按鈕的大小是要按恰當(dāng)?shù)某叽缭O(shè)計的。
據(jù) MIT 觸擊實驗室研究結(jié)果顯示,人們手指指頭的平均大小在 10~14mm 之間,指尖的大小在 8~10mm 之間,所以 10mm X 10mm 大小的圖標(biāo)是最佳的最小尺寸圖標(biāo)。
還有重要的一點是,你要考慮可點擊元素間的相對距離。如果按鈕間靠得太近,手機用戶可能會不時按錯按鈕。
為了處理這些錯誤并防止用戶誤操作,你必須確保按鈕有恰當(dāng)?shù)某叽绾涂臻g位置,這樣才更好地適合手機用戶操作。下圖是手機網(wǎng)頁中,按鈕間最佳的最小距離。
5. 讓用戶探索完你的產(chǎn)品后,再讓他們登入賬戶
如果在用戶沒有看到你的網(wǎng)頁內(nèi)容前,就要求他們登錄或注冊的話,會有非常高的交互成本,并且也違反了互惠原則。過早地要求用戶注冊,可以導(dǎo)致超過 85% 的用戶流失。
Netflix 提供了一個月的免費使用,但用戶只有登錄賬戶才能瀏覽網(wǎng)頁內(nèi)容。
用戶在登入個人信息前,通常會先瀏覽網(wǎng)站的內(nèi)容,看看這個網(wǎng)站是干什么的(用戶對于陌生的網(wǎng)站更會如此)。為了給用戶提供一個無障礙瀏覽的體驗,移動網(wǎng)頁應(yīng)該這樣設(shè)計:
不登錄狀態(tài)下,可瀏覽網(wǎng)頁信息
不登錄狀態(tài)下,可購買商品。
【手機網(wǎng)頁設(shè)計技巧】相關(guān)文章:
網(wǎng)頁設(shè)計技巧06-02
網(wǎng)頁設(shè)計技巧精選09-05
網(wǎng)頁設(shè)計的技巧經(jīng)驗09-08
CSS網(wǎng)頁設(shè)計技巧08-14
網(wǎng)頁設(shè)計常用的技巧07-09
網(wǎng)頁設(shè)計技巧大全08-05
網(wǎng)頁設(shè)計常用photoshop技巧06-25
網(wǎng)頁排版設(shè)計的技巧10-27