公司動(dòng)態(tài) · 行業(yè)動(dòng)態(tài) · 技術(shù)交流

技術(shù)交流

網(wǎng)頁(yè)設(shè)計(jì)布局心得-南京網(wǎng)站建設(shè)

發(fā)布時(shí)間:2012-06-01 瀏覽:5252次

網(wǎng)頁(yè)設(shè)計(jì)布局心得-南京網(wǎng)站建設(shè)

      網(wǎng)頁(yè)不僅僅是把相關(guān)的內(nèi)容放到網(wǎng)頁(yè)中就行了,它不要求網(wǎng)頁(yè)設(shè)計(jì)者能夠把這些內(nèi)容合理的安排,給瀏覽者以賞心悅目的感覺,這樣才能達(dá)到內(nèi)容與形式完美的結(jié)合,增強(qiáng)網(wǎng)站的吸引力。因此說,網(wǎng)頁(yè)設(shè)計(jì)不但是一項(xiàng)技術(shù)性的工作,它還是一項(xiàng)藝術(shù)性的工作,要求設(shè)計(jì)者有較高的藝術(shù)修養(yǎng)和審美情趣,這樣才能設(shè)計(jì)出高水平的網(wǎng)頁(yè)來。網(wǎng)頁(yè)的排版布局就是決定你的網(wǎng)站美觀與否的一個(gè)重要方面,通過合理的有創(chuàng)意的布局,你可以把文字、圖像等內(nèi)容完美的展現(xiàn)在瀏覽者的面前,而布局的好壞在很大程度上取決于你的藝術(shù)修養(yǎng)水平和創(chuàng)新能力。然而這并不是說網(wǎng)頁(yè)的布局無章法可循,完全是靈感之作,它也有自己內(nèi)者的規(guī)律和要求,你只要按照這些要求去做,再加上你的奇特創(chuàng)意,一個(gè)吸引人的網(wǎng)頁(yè)布局是會(huì)出現(xiàn)的。

       一、網(wǎng)頁(yè)排版布局的步驟 
       1.構(gòu)思 
       根據(jù)網(wǎng)站的內(nèi)容整體風(fēng)格,設(shè)計(jì)版面布局。你可以參考其他的優(yōu)秀的網(wǎng)站,調(diào)用自己的各種知識(shí)儲(chǔ)備,特別是藝術(shù)方面的,在大腦中不斷地醞釀、碰撞,往往不經(jīng)意就有閃光的思想出現(xiàn)。這時(shí)你就要抓緊時(shí)間把它變成文字的東西,用筆在紙上粗略的勾畫出布局的輪廓,不要講究細(xì)節(jié),只要有一個(gè)輪廓就行。當(dāng)然你也可以有多種想法,盡量都把它們畫出來,然后再比較,采用一種比較滿意的方案。

      2.初步填充內(nèi)容 
        這一步就要把一些主要的內(nèi)容放到網(wǎng)頁(yè)中,例如網(wǎng)站的標(biāo)志、廣告條、菜單、導(dǎo)航條、計(jì)數(shù)器等,要注意重點(diǎn)突出,把網(wǎng)站標(biāo)志、廣告條、菜單放在最突出、最醒目的位置,然后再考慮其它的元素的放置。

       3.細(xì)化 
       在將各主要元素確定之后,下面就可以考慮文字、圖像、表格等頁(yè)面元素的排版布局了。在這一步,你可以用網(wǎng)頁(yè)編輯工具把草案做成一個(gè)簡(jiǎn)略的網(wǎng)頁(yè),當(dāng)然對(duì)每一個(gè)元所占的比例也要有一個(gè)詳細(xì)的數(shù)字,以便以后修改。

       經(jīng)過以上幾步之后,相信你的網(wǎng)頁(yè)布局已經(jīng)初具規(guī)模了,讓別人看一下,給你提些建議,再不斷修改,一個(gè)很有特色的網(wǎng)頁(yè)就要浮出水面了。 
      二、網(wǎng)頁(yè)排版布局的原則
            上面我們簡(jiǎn)要的介紹了設(shè)計(jì)網(wǎng)頁(yè)布局的步驟,事實(shí)上,在構(gòu)思和設(shè)計(jì)的過程中,你還必須要掌握以下的幾項(xiàng)原則: 
       1.平衡性
            一個(gè)好的網(wǎng)頁(yè)布局應(yīng)該給人一種安定、平穩(wěn)的感覺,它不僅表現(xiàn)在文字、圖像等要素的空間占用上分布均勻,而且還有色彩的平衡,要給人一種協(xié)調(diào)的感覺。

        2.對(duì)稱性
            對(duì)稱是一種美,我們生活中有許多事物都是對(duì)稱的,但過度的對(duì)稱就會(huì)給人一種呆板、死氣沉沉的感覺,因此要適當(dāng)?shù)拇蚱茖?duì)稱,制造一點(diǎn)變化。 
        3.對(duì)比性
            讓不同的形態(tài)、色彩等元素相互對(duì)比,來形成鮮明的視覺效果。例如黑白對(duì)比,圓形和方形對(duì)比等,它們往往能夠創(chuàng)造出富有變化的效果。 
        4.疏密度
            網(wǎng)頁(yè)要做到疏密有度,即平常所說的“密不透風(fēng),疏可跑馬”。不要整個(gè)網(wǎng)頁(yè)一種樣式,要適當(dāng)進(jìn)行留白,過用空格,改變行間距、字間距等制造一些變化的效果。

        5.比例
            比例適錄,這在布局中非常重要,雖然不一定都要做到黃金分割,但比例一定要協(xié)調(diào)。 
        三、常見的布局樣式 
        1.T字型
            這種布局最為常見,就是指頁(yè)面最上方是廣告條,頁(yè)面下方左邊是菜單,右面顯示頁(yè)面內(nèi)容,整體上類似英文字母“T”,所以我們稱之為T字型布局。這種布局條理清晰、主次分明,非常適合初學(xué)者學(xué)習(xí),但略有點(diǎn)呆板。

        2.口字型
            這種布局類似一個(gè)方框,上下是廣告條,左面是菜單,右面是友情鏈接,中間是網(wǎng)頁(yè)內(nèi)容,網(wǎng)頁(yè)布局緊湊、信息豐富,但四面封閉,給人一種壓抑的感覺。

         3.對(duì)稱型
            整個(gè)網(wǎng)頁(yè)呈上下或左右對(duì)稱布局,非常醒目,如果兩部分搭配協(xié)調(diào),網(wǎng)頁(yè)的視覺效果非常好,很有沖擊力。 
         4.海報(bào)型
            這種布局就像我們平時(shí)見到的海報(bào)一樣,中間是一幅很醒目、設(shè)計(jì)非常精美的圖片,周圍點(diǎn)綴著一些圖片和文字鏈接。這種設(shè)計(jì)常用直一些時(shí)尚類和公司的首頁(yè),非常吸引人。但大量的運(yùn)用圖片導(dǎo)致網(wǎng)頁(yè)下載速度很慢,而且擔(dān)供的信息量較少。

點(diǎn)