萬盛學電腦網

 萬盛學電腦網 >> 網頁制作 >> 交互設計 >> 網頁布局的步驟

網頁布局的步驟

  一、一般步驟

  1.構思

  根據網站的內容整體風格,設計版面布局。你可以參考其他優秀的網站,調用自己的各種知識儲備,特別是藝術方面的,在大腦中不斷地醞釀、碰撞,往往不經意間就有閃光的思想出現。這時你就要抓緊時間把它變成文字的東西,用筆在紙上粗略地勾畫出布局的輪廓,不要講究細節,只要有一個輪廓就行。當然你也可能有多種想法,盡量都把它們畫出來,然後再比較,采用一種比較滿意的方案。

  2.初步填充內容

  這一步就要把一些主要的內容放到網頁中,例如網站的標志、廣告條、菜單、導航條、計數器等,要注意重點突出,把網站標志、廣告條、菜單放在最突出、最醒目的位置,然後再考慮其它元素的放置。

  3.細化

  在將各主要元素確定好之後,下面就可以考慮文字、圖像、表格等頁面元素的排版布局了。在這一步,你可以利用網頁編輯工具把草案做成一個簡略的網頁,當然對每一種元素所占的比例也要有一個詳細的數字,以便以後修改。

  經過以上幾步,相信你的網頁布局已經初具規模了,讓別人看一下,給你提些建議,再不斷修改,一個很有特色的網頁就要浮出水面了。

  二、網頁排版布局的原則

  上面我們簡要介紹了設計網頁布局的步驟,事實上,在構思和設計的過程中,你還必須要掌握以下幾項原則:

  1.平衡性

  一個好的網頁布局應該給人一種安定、平穩的感覺,它不僅表現在文字、圖像等要素的空間占用上分布均勻,而且還有色彩的平衡,要給人一種協調的感覺。

  2.對稱性

  對稱是一種美,我們生活中有許多事物都是對稱的。但過度的對稱就會給人一種呆板、死氣沉沉的感覺,因此要適當地打破對稱,制造一點變化。

  3.對比性

  讓不同的形態、色彩等元素相互對比,來形成鮮明的視覺效果。例如黑白對比,圓形與方形對比等,它們往往能夠創造出富有變化的效果。

  4.疏密度

  網頁要做到疏密有度,即平常所說的"密不透風,疏可跑馬"。不要整個網頁一種樣式,要適當進行留白,運用空格,改變行間距、字間距等制造一些變化的效果。

  5.比例

  比例適當,這在布局當中非常重要,雖然不一定都要做到黃金分割,但比例一定要協調。

copyright © 萬盛學電腦網 all rights reserved