萬盛學電腦網

 萬盛學電腦網 >> 網頁制作 >> 交互設計 >> 網頁設計技巧

網頁設計技巧

  網站的頁面多種多樣,風格各異,網頁的質量直接影響著網站的效果。網頁設計的過程中,需要注意哪些方面的事項,有哪幾方面影響著網頁的設計效果呢?

  一、頁面平鋪

  把頁面平鋪開,主要的物件有:導航欄、LOGO、Banner、按鈕、圖片、文字。

  1.導航欄

  導航欄如果設計得恰到好處,是會給網頁本身增色很多。導航欄有一排、兩排、多排、圖片導航和Frame框架快捷導航等等各種情況的設計。有時候是橫排,有時候則是豎排。另外還有一些動態的導航欄,如很精彩的Flash導航。

  2.LOGO

  LOGO並不是每個網站多要有的,他是網站為了給大家一個比較直觀的信息的表達工具。LOGO的位置通常在頁面的左上角。這個地方最明顯和直觀,可以第一時間給人於默化的效果;網站的LOGO,一般以靜態的居多,也有動態的,但是LOGO的特點都是在表達網站的信息,是一個網站的直接的表現窗口。

  3.BANNER(廣告條)類型

  Banner設計注意點:Banner有動態和靜態兩種。在浏覽網頁的過程中,雖然閃爍的圖案會產生瞬間記憶刺激,引起注意,但這種記憶往往為壓迫性的,久之易產生負面效應,從而模糊記憶。而穩定的畫面不易引發特殊的關注,但如果有良好的界面引導和內容,可產生良性的記憶,持久而牢固。設計要點:Banner的文字不能太多,用一兩句話來表達即可;廣告語要朗朗上口,可以第一時間的讓人捕獲表達的重點;圖形無須太繁雜,文字盡量使用黑體等粗壯的字體,否則在視覺上很容易被網頁其他內容淹沒;圖形盡量選擇顏色數少,能夠說明問題的事物;如果選擇顏色很復雜的物體,要考慮一下在低顏色數情況下,是否會有明顯的色斑;盡量不要使用彩虹色、暈邊等復雜的特技圖形效果,這樣做會大大增加圖形所占據的顏色數,增大體積。

  4.按鈕

  按鈕設計要點:設計按鈕要同頁面的整體協調,不能太搶眼;有的頁面很單調,還要依靠花哨的按鈕來提一下;選用的字體,選用的插圖,或插圖及字體搭配,都要考慮字跡清楚,色彩簡單一些,不要超過四種;很長的按鈕可能就是框架的分界,盡量要纖細一些,否則頁面會顯臃腫。

  5.圖片

  為了美化頁面,圖片是任何一個頁面都要用到的,圖片的運用要合理。圖片運用要點:圖形的主體最好清晰可見;圖形的含義最好簡單明了;圖片內所含文字應該清晰容易辨認;背景與主體明度對比比例應為3∶1到5∶1之間為宜;淡色系列的背景有助於整體和諧;淡色材質背景最佳,能與主題分離之淺色標志或文字背景亦可。

  6.文字

  文字也是設計的。設計要點:每一行文字的長度最好20到30個中文字(40到60個英文字母);行距與字距已由軟件內定。設計時注意段落與段落間空行及首行縮排方式以輔助閱讀;標題以H1到H3字號為佳,內文Font size=3到4級為佳;同版面字型最好在三種以內;文字的顏色最好也是三種以內;文字在顏色上要與背景區別;內文的排列向左對齊並與左邊界保持適當距離。可以用表格填入文字以達此效果;表格或清單內的字運用相同字型與字體大小,以利辨別。

  二、整體規劃

  有共性,才有統一,有細節區別,就有層次;防止設計與實現過程中的偏差;設計的各部分,要配合整體風格;不僅頁面上各項設計要統一,而且網站的各級別頁面也要統一;信息不要太過集中,以免文字編排太緊密;不要有太多分散注意力的點。動態閃爍要適中;頁面留白部分,要根據平面設計原理來設計,注意分欄式結構不宜留白;還要考慮到浏覽器上部占用的屏幕空間,防止圖片截斷等造成視覺效果不好;首頁設計圖片+導航,這是一種比較強的網站表達,可以根據時間的變化更改圖片。

  三、功能易用性

  導航欄應最先調入,以便訪客快速前往所需信息空間;頁面長度要短,使得用戶在信息空間內可迅速移動;導航設計方向要一致。支持導航的層次按鈕應當從上到下或從左到右,但不要兩者都用,不要混用方向。

copyright © 萬盛學電腦網 all rights reserved