在網頁設計時，不同的版式就會有不同的視覺效果，根據(jù)視覺效果不同可以總結出以下版式構成的類型：水平分割、垂直分割、水平-垂直交叉分割、中軸型、傾斜型、曲線型、重心型、反復型、散點型等。其中，水平分割、垂直分割、水平-垂直交叉分割常用到水平線、垂直線、矩形等，這些形式在網頁制作時容易實現(xiàn)，且頁面能容納較多的信息含量，因而是網頁設計中使用相當廣泛的構成類型。

水平分割

頁面中的水平分割與排列，強調了水平線的作用，使頁面具有安定、平靜的感覺，觀眾的視線在左右移動中捕捉視覺信息，符合人們的視覺習慣。

1.水平均勻分割水平均勻分割將頁面分割成上下相等的兩部分。如圖1所示，上半部用作視覺表現(xiàn)，引發(fā)情感，下半部用來解釋說明，上半部多為主體形象。

2.水平不均勻分割水平不均勻分割是將頁面分割成上下不相等的兩部分。一般來說，如果在上半部安置標題或導航，則面積較小；如果在上半部安置圖片或主體形象，則面積適當加大，如圖2所示。

3. 水平多次分割水平多次分割是頁面沿水平分割成大小不等的幾個部分。如圖3所示，橫向排列的圖片和標題文字，強調了水平分割的層次和精確感。多層分割有助于不同信息的歸類。

4. 水平變化分割水平變化分別是在水平分割的基礎上進行變化。如圖4所示，水平分割與斜線相結合，打破了頁面的安定，產生動感。

垂直分割

頁面中的垂直分割與排列，則強調垂直線的作用，具有堅硬、理智、冷靜和秩序的感覺。

1.垂直均勻分割垂直均勻分割是把頁面分割為左右相等的兩部分。在視覺習慣上，當左右兩部分形成強弱對比時，會造成視覺心理的不平衡。這時，可將分割線作部分或全部的弱化處理，或在分割處加入其他元素，使左右部分的過渡自然而和諧。如圖所示，左右兩部分在色彩上的對比由于視覺中心的圖文而減弱，左上角的標志減輕左半部的重量感，使頁面更為融合。

2.垂直不均勻分割垂直不均勻分割是把頁面分割為左右不相等的兩部分。左邊的視覺注意度較高，因而放置標志、導航信息、主體形象等，如圖6所示。如果將主體形象放在左右分割處，則會減弱左右部分的對比，加強它們的聯(lián)系，成為該頁面的視覺中心。

3. 垂直多次分割垂直多次分割是頁面沿垂直方向分割成大小不等的幾部分。在圖7中，頁面具有很強的層次性，左邊為主欄目導航，右邊為次級欄目導航，中間為相應的內容，中間和右邊由色彩統(tǒng)一，而左邊用形態(tài)的滲入來加強它與中間部分的銜接。

4. 垂直變化分割垂直變化分割是將垂直分割進行特異性處理，容易取得耳目一新的效果。如圖11.21所示，將垂直分割應用于網頁設計，在分割處粘貼一個典型提示圖案，分割手法靈活多變，在網站建設時營造出和諧統(tǒng)一的美感。