因為PC端網頁與移動端網頁的操作及視覺效果均有所不同,所在在網站設計中每種設備登錄網站都應該有著不同的交互規則設定。所有的交互的元素比如按鈕、鏈接、菜單等都應該既可以用鼠標點擊又可以觸摸進行操作。但根據PC端與移動端的區別,還是需要在設計上有所區別。
1、 交互對象的尺寸設計要合理
在網頁設計中,PC端的網頁的交互元素設計需要根據鼠標點擊的精準程度而適配。而在移動端,因為觸摸的特性,需要把網頁的交互元素設計成面積稍大一點的交互元素以方便手指的觸摸,在移動端的交互元素設計中。小按鈕要比大按鈕難點擊得多。經過一些數據表明,手指面的觸摸尺寸大概是在10毫米到14毫米左右,而指尖的觸摸尺寸是在8毫米到10毫米之間。所以在網站設計中,適合移動端交互元素的設計尺寸大概是在10毫米左右。
2、 交互元素的設計要醒目
在許多PC端的網站設計中我們經常可以看到,當鼠標懸停在某個交互元素上方的時候,無論是鼠標還是交互元素都會響應地產生視覺反饋,而在移動端,因為其點擊機制的原因無法形成這種反饋。這也屬于交互元素設計的一種,能夠通過強烈的視覺反饋來是訪問用戶預判整個頁面的元素功能及操作結果。以上就是網站的設計中交互元素的設計相關步驟及技巧。