1.網(wǎng)頁的分欄

做網(wǎng)站的版面變化主要通過“欄”的變化來體現(xiàn)。受計算機(jī)顯示屏和網(wǎng)站制作瀏覽習(xí)慣的影響,網(wǎng)站的寬度相對固定,但高度是不定的,因此網(wǎng)站“欄”的設(shè)計主要集中在豎欄的區(qū)分和版式設(shè)計上。

欄的變化有兩種,
一種是橫欄打通.
一種是豎欄打通.

如果是網(wǎng)站的重要內(nèi)容,可以跨越好幾個欄。在網(wǎng)站制作的版面中左上方是最受矚目的地方,其次是右上方,在其次是右下與左下。重要的欄目標(biāo)題盡量放在首屏。

由于計算機(jī)顯示屏的不一致,欄寬有定寬和隨著顯示屏大小相應(yīng)調(diào)節(jié)兩種方式。做網(wǎng)站的版面設(shè)計要注意整體的形式美感。文章的安排要做到:主次、大小、長短、橫豎的搭配。在一個版面中,或以大塊文章為主,配以少量小塊文章,或以小塊文章為主,配以少量大一點(diǎn)面積的文章,如各占二分之一,也會“花”在處理大塊文章時,應(yīng)注意在統(tǒng)一中求變化,避免版面單調(diào)。在處理小面積文章與圖板時,應(yīng)避免版面零亂,可用畫線、分組等方法使版面在變化中求統(tǒng)一,井然有序。

多數(shù)網(wǎng)站采用1一4豎欄的版式。

(1)一欄版式
一欄版式是指網(wǎng)站縱向只有一個豎版的版面結(jié)構(gòu)。這種版式最簡單,用戶視覺流程就是從上到下,但如果頁面首屏要同時傳達(dá)兩相以上內(nèi)容,這種版式就很難實現(xiàn)了。因此,單欄版式較多使用在目的較單一的最終頁面中。

(2)二欄版式
二欄的版式是指網(wǎng)站制作縱向有兩個豎欄的版面結(jié)構(gòu),由于其結(jié)構(gòu)簡單清晰,又能夠解決內(nèi)容并置的問題,受到許多網(wǎng)站的歡迎。

(3)三欄版式
三欄的版式是指網(wǎng)站制作縱向有三個豎欄的版面結(jié)構(gòu),其結(jié)構(gòu)相對復(fù)雜一些,但由于能夠同時呈現(xiàn)較多內(nèi)容,因此是最常用的版式結(jié)構(gòu)。

2版面率

在版面中文字的面積與版面總面積之比,稱為版面率,版面率主要受文字、圖片和留白之間關(guān)系得影響。版面率低給人高雅感,版面率高的新聞性、通俗性強(qiáng)。網(wǎng)絡(luò)有這樣兩點(diǎn)特征:首先上網(wǎng)是付費(fèi)的,其次網(wǎng)頁每屏的顯示范圍受瀏覽器的限制,如果版面率較低的話,頁面會拉得很長,看一點(diǎn)內(nèi)容得換好幾屏,而每屏的內(nèi)容又很少,不方便使用;但是版面率過高又會使得頁面雜亂擁擠,既不好看,也不好用。所以,要根據(jù)網(wǎng)頁的功能、內(nèi)容和性質(zhì)確定適當(dāng)?shù)陌婷媛省?br style="margin: 0px; padding: 0px; list-style: none; color: rgb(128, 128, 128); font-family: 宋體; line-height: 25px; white-space: normal; background-color: rgb(236, 236, 236);"/>
高版面率常用于新聞頁面,信息量大,新聞性強(qiáng)。中版面率常用于娛樂信息站點(diǎn),既有內(nèi)容豐富、信息及時的特點(diǎn),又有輕松休閑的娛樂特點(diǎn)。較低版面率常用于產(chǎn)品宣傳做網(wǎng)站,比如汽車銷售網(wǎng)站,營造了高檔和神秘感,又有必要的內(nèi)容信息。

有時,當(dāng)版面中實行的分量很滿,以至于無法感受到線形存在的時候,卻仍能感受到一種空氣的流動,它們時而舒婉流暢,時而歡快雀躍,或匯攏成靜靜的一片,或分散成涓涓細(xì)流從字里行間穿行而過,這就是版面中的空白。版面中的空白與建筑中的虛空間相似,在一個版面中,不能只看到圖形、文字,而注重空白;就好像不能只看到字體的筆畫,而忽略畫筆之間的空當(dāng)。正是由于空白的襯托才使視覺得以集中,從而提高了圖文的價值。