移動網頁設計原則

　　導語：如果你希望你的網頁更好地適配移動設備，那么你必須解決網頁在所有移動設備上的兼容性問題。以下是改進措施，你可以參照著來確保你的網頁能適配移動設備，并給用戶帶來愉悅的體驗。

　　1. 讓你的整個網頁都適合在移動端上瀏覽

　　相比在移動端上直接操作桌面版網頁，經過適配的移動網頁會大大方便用戶的操作使用。舉個例子，下圖是手機端 Domino 披薩官網的兩個版本，一個是桌面版網頁，另一個是已適配手機端的網頁。

　　桌面版網頁手機的小屏幕里顯得窄而小，并且很難操作。經過對比，手機版的網頁主要由方便操作的大按鈕組成，顯得簡潔。

　　如果你的網頁適配了手機，你的網頁在手機上將會更加地易用。以下是網頁適配手機的 3 個小技巧。

　　只允許垂直滾動。不應該通過水平滑動頁面來查看主要內容。你要確保你的網頁使用了相對應的寬度與位置值，圖片縮放后也能正常顯示。你還要把網頁的主目錄放在顯目位置并剔除那些會干擾用戶操作的元素。

　　限制橫欄按鈕的數量——最好是僅有一列的頁面布局。

　　不要將桌面版的網頁與手機版的`網頁互混。因為這樣的網頁會比桌面版的更加難用。

　　2. 將主操作按鈕設計得更友好

　　手機用戶很容易忽視手機界面上的元素，所以主操作按鈕要放在顯要位置。手機頁面的主操作按鈕(Calls-To-Action Buttons)可能會跟桌面版的有所不同，所以你要從在用戶的角度考慮，來決定你要把主操作按鈕放在什么位置。

　　主操作按鈕要容易點擊，且在頁面中不要被其他的元素干擾。

　　3. 菜單欄要簡短而中肯

　　桌面版網頁里有豐富的菜單欄可能會很方便用戶使用，但手機用戶不會有耐心滑動長長的選項欄，找他們想要的東西。

　　你需要考慮如何盡可能地減少菜單欄選項。例如，只留下主要產品的目錄。根據「拇指原則」，盡量不要使用超過 7 條不同分類的條目。

　　簡短且區分明顯的目錄更方便用戶操作

　　還有，你的分類列表應該是符合你用戶的需求的：

　　它應該是根據用戶的使用頻率與給用戶帶來的價值來排列。

　　它不應該使用晦澀難懂的措辭。菜單欄的設定需要具備商業素養，不然你會混淆菜單欄的類別。如使用文縐縐、比喻性的措辭可能會迷惑用戶，致使更多用戶離開。

【移動網頁設計原則】相關文章：

網頁設計的原則09-04

移動端網頁設計技巧10-05

移動端網頁設計方法09-19

網頁設計黃金配色原則10-02

簡潔的網頁設計原則10-26

移動端網頁設計尺寸標準10-26

移動端網頁設計的技巧09-19

移動端網頁設計的技巧指導10-04

移動端網頁界面設計技巧10-02

• 上一篇：移動員工工作總結范文 移動員工個人工作心得簡短
• 下一篇：返回列表