04 10 月 什麼是網頁美學設計,網頁視覺設計含蓋了哪些設計要點?
網頁設計流程包含了設計思考的 Empathy(同理心)> Define(需求定義)> Ideate(創意動腦)> Prototype(製作原型)> Test(實際測試)> Assess(評估)…等步驟。其中Prototype(製作原型)即將導入網頁設計美學、視覺設計階段,這階段含蓋了色彩計畫、圖文排版、欄位段落間距的佈局與其他視覺元素來創造引人入勝且沉靜式的用戶體驗。以下是視覺設計的網頁設計推薦要點介紹:
- 全站一致CSS:網站配置好 Header,Body & Footer,在所有頁面上保持一致的CSS視覺風格制定。可以讓用戶遠離陌生並建立信賴度。CSS視覺風格制定包括顏色(Color)、字體(Font)和元素(Visual Element)樣式的一致使用。
- 色彩計畫:色彩的選擇與配搭淺在影響用戶體驗情緒、品牌偏好與友善體驗。貼心個性化的色彩計畫可以帶入眼球聚焦並創造情感氛圍。
- 網頁設計字型:字型的選用可以影響閱讀的順暢與愉悅感並且展現品牌特色。字型的一致性可以深入人心讓品牌形象優化,字型個性化也在各式的形象設計扮演重要角色。
- 網頁設計排版:視覺元素的排列引導使用者瀏覽內容。良好的佈局可確保資訊井井有條且易於導航。網頁設計適度留白於創造平衡與提升閱讀舒適性,掌握圖地關係,留白讓版面有次序也讓視覺聚焦在圖文主題中。
- 插圖照片精選:質感的照片、插圖和小圖示可以增強故事描述並引起觀看注意。插圖照片視覺效果必須反映品牌形象。
- 響應式RWD網頁設計:視覺設計必須回應出不同的裝置和螢幕尺寸。這可確保跨桌上型電腦、平板和手機的無縫使用體驗。
- UX/UI使用者體驗設計:按鈕、表單和網頁選單應具有視覺吸引力且方便好用,同時保持整體美觀。