手機不同于電腦,其屏幕小又是觸摸方式,不管是在網頁瀏覽還是用戶體驗上,與電腦網頁相比,存在一定的缺點。這些缺點也是導致企業進行手機網站建設的阻礙因素。雖然這些缺點是因為手機本身的特點所致,我們無法改變,但是我們可以改變設計,讓其符合手機自身的特點,不僅能夠增強手機網站的美觀效果,還能提高用戶的整體體驗。
下面,我們將手機網頁設計效果體現的方法給大家介紹一下:
一、導航的設計重點
1、只在首頁的部份加入搜尋的功能;
2、建立導航功能鍵,其中以「回到首頁」、「回到上一頁」這兩個最為重要;
3、最后,「回到上一頁」的按鍵除了首頁以外,其余的頁面都需要放置。
二、企業名稱的設置
手機網頁的頂部沒有標題欄或地址欄,相應地,也就沒有網站標題和圖標。所以企贏001認為你的設計應該讓用戶知道,他們現在所瀏覽的網站名稱,這對塑造品牌也很重要。
三、使用視覺元素來完善文本元素
1、標題同時使用文字和圖標。
2、使用圖形元素日期代替文字日期。
3、使用小信息圖標來加強解釋的部分。
4、除了字體的大小變化,使用不同的文章/標題顏色。
5、使用不同的淺背景色來區別不同的內容。
6、使用高亮來強調重要部分。
7、使用padding和negative space來突出文本或區分文本。
8、使用不同的“視圖”,將內容分解成較小的部分。
四、使用視覺反饋機制來與用戶交流
1、用色彩來突出已選擇的區域。
2、當用戶切換時使用淡入淡出動畫。
3、使用邊框顏色和漸變來表示按鈕觸摸狀態。
4、使用不同的按鈕或文本顏色來顯示狀態的變化。
5、當選擇下拉菜單時,使用正在轉向/已經轉向箭頭。
6、在視圖之間使用滑動或漸變動畫以顯示區域的改變。
五、減少文字輸入部份設計
1、允許移動上網使用者儲存輸入的帳號密碼資訊。
2、輸入的區塊盡量加以放大。
3、允許移動上網使用者,輸入簡易的密碼,例如PIN數字密碼。
六、內容呈現方式
從用戶角度來說,他們希望閱讀所有的內容,所以我們進行內容呈現,只是用隔斷、重組或其他視覺方案來讓這些內容更容易訪問。
七、利用手機的天生優勢
手機有著許多傳統電腦所沒有的優勢,其中最大的優勢就是「移動力」,因此手機版網頁應該要特別發揮這些特性,讓手機網頁具有一般網頁更多的優勢。舉例來說:
1、移動定位:大部分的智能設備都有GPS或是定位的機制,可以讓客戶主動找到您的位置。
2、移動聯系:如果客戶使用的是移動電話,可以立即發話;如果是平板電腦,也可以使用短信或是E-mail的方式傳遞信息給客戶。
3、鄰近地點:如果您的事業有很多據點,請告訴您的客戶,在他附近有哪一些地點是便于他能夠抵達的。