網頁設計不僅僅是整個頁面風格的把控,還包含設計細節的設計。所以現在的網頁設計師除了把網頁做的大氣漂亮,還越來越注重的是多用户的感受,很多時候多用户的使用感覺都會是網頁設計中重要評價來源之一。成功的網頁需要巧妙的平衡,一個細節微小得地方都會給整體帶來一定的影響,所以有的時候 UI 的設計在網頁中也是具有一定的重要性。那我們來説一下 UI 應該如何設計?應注意的問題在哪裏呢?

説到這裏就先進行一下掃盲工作啊,説一下 “UI” 的本義是多用户介面,是英文 User 和 interface 的縮寫。從字面上看是多用户與介面兩個組成部分,但實際上還包括多用户與介面之間的互動關係。具體還包括:可用性分析、 GUI(Graphic User Interface 即圖形多用户介面設計)、多用户測試等。好的 UI 設計需要讓軟件變得有個性有品味,讓軟件的操作變得舒適、簡單、自由,充分體現軟件的定位和特點。

整個頁面的基調顏色要一致,不同的模組除非有很大意義的差別,顏色應該一致。從欣賞的角度,圖片應該是儘可能的統一風格,素描樣式和點陣樣式共存總不是太好的事情。

模組的邊框,標題,按鈕 (如果有的話),“更多”“詳細” 功能,這些元素的顏色、大小尺寸、位置、對齊方式、字型、字號、行距等都要一致。很多時候會用圖示來描述功能,漂亮的帶點陰影和倒影的圖示是非常搶眼的,使用圖示的話要注意風格、透視角度、解析度、辨識度的一致性。有沒有不必要的彈出視窗。 (從 netscape 開始這個設計真的很糟糕,ie 也完全繼承了,解決的辦法是用 js 方式來呈現彈出視窗。)

可以點選的文字、按鈕、圖片,滑鼠應該呈現出統一的可點選樣式,區別於不可點選區域。可以點選的圖片知名用不同的樣式顯示,比如滑鼠滑過時候的輝亮效果。因為網頁會大量的使用圖片做修飾效果,區分可以點選和不可以點選的圖片是值得去做的很多時候會忽略這個問題,在我們做 demo 的這個專案中有很多的文字描述,各有其用,統一描述的方式,統一人稱,統一語氣,都是給多用户帶來良好體驗的途徑。呈現的日期格式的統一,比如都用長日期格式 “2007-2-1” 或者都用短日期格式 “07-3-1”,樣式不同的日期呈現方式還不如不呈現。