點(diǎn)的視覺(jué)構(gòu)成
　　在網(wǎng)頁(yè)中，一個(gè)單獨(dú)而細(xì)小的形象可以稱(chēng)之為點(diǎn)。點(diǎn)是相比較而言的，比如一個(gè)漢字是由很多筆劃組成的，但是在整個(gè)頁(yè)面中，他可以稱(chēng)為一個(gè)點(diǎn)。點(diǎn)也可以是一個(gè)網(wǎng)頁(yè)中相對(duì)微小單純的視覺(jué)形象，如一個(gè)按鈕（BUTTON），一個(gè)LOGO等等。

　　需要說(shuō)明的是，并不是只有圓的形才叫一個(gè)點(diǎn)，方形，三角，自由形都可以作為視覺(jué)上的點(diǎn)，點(diǎn)是相對(duì)線和面而存在的視覺(jué)元素。

　　點(diǎn)是構(gòu)成網(wǎng)頁(yè)的最基本單位，在網(wǎng)頁(yè)設(shè)計(jì)中，經(jīng)常需要我們主觀的加些點(diǎn)，如在新聞的標(biāo)題后加個(gè)NEW，在每小行文字的前面加個(gè)方或者圓的點(diǎn)。

　　點(diǎn)在頁(yè)面中起到活潑生動(dòng)的作用，使用得當(dāng)，甚至可以是畫(huà)龍點(diǎn)睛的。

　　一個(gè)網(wǎng)頁(yè)往往需要有數(shù)量不等，形狀各異的點(diǎn)來(lái)構(gòu)成。點(diǎn)的形狀、方向、大小、位置、聚集，發(fā)散，能夠給人帶來(lái)不同的心理感受。

　　下面我們就具體的頁(yè)面，談?wù)匋c(diǎn)的運(yùn)用和表現(xiàn)。

在這個(gè)頁(yè)面中，只有唯一的一個(gè)點(diǎn)，四周是大量的空白，于是它馬上成為吸引視線，引發(fā)興趣的視覺(jué)中心。而這個(gè)視覺(jué)中心就應(yīng)該是你想表達(dá)的主題，效果是最直接明確的。

　　在你實(shí)際瀏覽這個(gè)頁(yè)面的時(shí)候，這個(gè)處于三維空間點(diǎn)（花生）旁邊環(huán)繞著一段電腦聯(lián)線。三維技術(shù)的運(yùn)用，更突出了這個(gè)視覺(jué)中心，讓你迫不及待的點(diǎn)擊進(jìn)入下一級(jí)頁(yè)面。

 此主題相關(guān)圖片如下：

這是同一網(wǎng)站二級(jí)頁(yè)面中的一個(gè)，我們可以將每一組形看做是一個(gè)點(diǎn)，如NEWS可以稱(chēng)做點(diǎn)，右下角還有四個(gè)點(diǎn)。所有的點(diǎn)互相呼應(yīng)，組成不穩(wěn)定的三角構(gòu)圖。在這個(gè)頁(yè)面中，重復(fù)出現(xiàn)了用三維動(dòng)態(tài)技術(shù)表現(xiàn)，最吸引視線的首頁(yè)的點(diǎn)（花生）。

　　同一視覺(jué)形象（點(diǎn)）的不斷重復(fù)出現(xiàn)，能夠增加瀏覽者的印象。

 此主題相關(guān)圖片如下：

在這個(gè)頁(yè)面的下部，點(diǎn)的水平排列，形成平穩(wěn)，安詳?shù)木€的感覺(jué)。
　　三種形狀相似的點(diǎn)隨著點(diǎn)擊產(chǎn)生的顏色變化，同時(shí)在頁(yè)面中心位置出現(xiàn)不同的產(chǎn)品圖片，給大家一種跳躍，動(dòng)蕩，歡快的感受。

　　在頁(yè)面中四處飄蕩的點(diǎn)（TOP10的圖標(biāo)）和由左至右移動(dòng)的文字（也是由點(diǎn)組成），加強(qiáng)了頁(yè)面的活躍氣氛。

　　在同一個(gè)空間里面體現(xiàn)了兩種不同情緒的動(dòng)態(tài)的對(duì)比，這也是網(wǎng)頁(yè)相對(duì)傳統(tǒng)平面媒體的極大優(yōu)勢(shì)。

　　做為呼應(yīng)，設(shè)計(jì)師特意在頁(yè)面的中上部，采用了很多較小的點(diǎn)做底紋，起到了豐富頁(yè)面層次的作用。

　　頁(yè)面上下兩段橫向的色條，強(qiáng)調(diào)了水平線的穩(wěn)定情緒，將頁(yè)面統(tǒng)一起來(lái)。

 此主題相關(guān)圖片如下：

在這個(gè)二級(jí)頁(yè)面中，右邊垂直排列的圓點(diǎn)（由1到10），起到了引導(dǎo)視線和強(qiáng)調(diào)次序的作用。
　　點(diǎn)的等距垂直排列，在視覺(jué)上形成虛擬的豎線。加上段落文字的共同邊距，在視覺(jué)上形成豎線，起到分割頁(yè)面的作用。

 此主題相關(guān)圖片如下：

在這個(gè)頁(yè)面中，點(diǎn)的大小，位置，顏色，聚散的不同變化和組合，產(chǎn)生了輕松，活潑，流動(dòng)，抒情，愉快的氣氛。

　　通過(guò)優(yōu)美的弧線的引導(dǎo)，人們的視線最終將集中在"wasabi:sneaker"這幾個(gè)由點(diǎn)組成的文字上。自然，這也是設(shè)計(jì)師所要突出訴求的主題之一。

 此主題相關(guān)圖片如下：

在二級(jí)頁(yè)面中，設(shè)計(jì)師采用了流行的FLASH技術(shù)，紅點(diǎn)在頁(yè)面上歡快的運(yùn)動(dòng)，同時(shí)進(jìn)行顏色的漸變；綠色的點(diǎn)加上點(diǎn)綴其中的深色小點(diǎn)，豐富了色彩和層次。整個(gè)網(wǎng)頁(yè)的流動(dòng)著歡快和輕松。

　　在頁(yè)面下部，設(shè)計(jì)師并列運(yùn)用高低顏色不同的點(diǎn)，若隱若現(xiàn)，突出了頁(yè)面以點(diǎn)造型的設(shè)計(jì)語(yǔ)言。

　　注意在兩個(gè)頁(yè)面中都出現(xiàn)了三個(gè)斜向排列的帶有漸變色的點(diǎn)。它為頁(yè)面增加了動(dòng)勢(shì)和前后的空間層次，實(shí)屬不容忽視的精彩之處！

線的視覺(jué)構(gòu)成 

　　點(diǎn)的延伸形成線。 

　　線在頁(yè)面中的作用在于表示方向、位置、長(zhǎng)短、寬度、形狀、質(zhì)量和情緒。 

　　線是分割頁(yè)面的主要元素之一，是決定頁(yè)面現(xiàn)象的基本要素。 

　　總的來(lái)說(shuō)，線分為直線和曲線兩種。這是線的總體形狀。同時(shí)線還具有本體形狀，兩端的形狀。 

　　線的總體形狀有垂直、水平、傾斜、幾何曲線，自由線這幾種可能。 

　　線是具有情感的。比如水平線給人開(kāi)闊，安寧，平靜的感覺(jué)；斜線具有動(dòng)力，不安，速度和現(xiàn)代意識(shí)；垂直線具有莊嚴(yán)，挺拔，力量，向上的感覺(jué)；曲線給人柔軟流暢的女性特征；自由曲線是最好的情感抒發(fā)手段。 

　　線的放射，粗細(xì)，漸變可以體現(xiàn)三維空間的感覺(jué)。 

　　將不同的線運(yùn)用到頁(yè)面設(shè)計(jì)中，會(huì)獲得不同的效果。知道什么時(shí)候應(yīng)該運(yùn)用什么樣的線條，可以充分的表達(dá)你所要體現(xiàn)的東西。 

　　總之，線條是網(wǎng)頁(yè)設(shè)計(jì)師必須熟練運(yùn)用的最得力的表現(xiàn)工具。我們應(yīng)該對(duì)他有一定的了解。下面我們用一些精彩實(shí)例來(lái)做具體的分析說(shuō)明。

在這個(gè)頁(yè)面中，水平線的重復(fù)排列形成一種強(qiáng)烈的形式感和視覺(jué)沖擊力，能夠在第一眼就產(chǎn)生興趣，達(dá)到了吸引訪問(wèn)者注意力的目的。 

　　自由曲線的運(yùn)用，打破了水平線組成的莊嚴(yán)和單調(diào)，給網(wǎng)頁(yè)增加了豐富、流暢、活潑的氣氛。 

　　水平線和自由曲線的組合運(yùn)用，形成新穎的形式和不同情感的對(duì)比，從而將視覺(jué)中心有力的襯托出來(lái)。 

　　值得提出的是，頁(yè)面中點(diǎn)（按鈕）的運(yùn)用，使頁(yè)面的形象更加活潑，豐滿。

 此主題相關(guān)圖片如下：

線還具有兩端形狀。線的兩端形狀可以任意形的，它決定了線的本體形狀。 

　　在這個(gè)頁(yè)面中，設(shè)計(jì)師運(yùn)用了具有書(shū)法味道的線條，粗糙的邊緣形成特殊的肌理，表現(xiàn)了強(qiáng)烈的個(gè)性特征和藝術(shù)效果。 

　　邊緣圓滑的曲線條（字母）在粗糙背景的襯托下，顯得很特殊并引人注目。在這里，字母也可以看做是構(gòu)成頁(yè)面的線條的一種。 

　　底紋采用了不規(guī)則，方向不一的虛線條，在豐富肌理的同時(shí)，和粗線、曲線（字母）形成對(duì)比，產(chǎn)生了縱深空間的感覺(jué)。 

　　曲線（字母）的大小對(duì)比也可以豐富空間層次。 

　　近實(shí)遠(yuǎn)虛的繪畫(huà)原理，在這里得到了最充分地體現(xiàn)

 此主題相關(guān)圖片如下：

將曲線（字母）隨意的重疊，變形，占踞了頁(yè)面左上角的很的一部分空間。配合夢(mèng)幻般的背景，體現(xiàn)了設(shè)計(jì)師虛無(wú)迷茫，雜亂無(wú)章的思緒。 

　　自由曲線是表現(xiàn)情感的最佳造型手段。

 此主題相關(guān)圖片如下：

線條除了體現(xiàn)情感外，還能夠利用粗細(xì)、虛實(shí)（例二談過(guò)），漸變，放射產(chǎn)生深度空間和廣度空間。 

　　上面的頁(yè)面中，圍繞同心的放射圓，在粗細(xì)和虛實(shí)上形成深度空間。設(shè)計(jì)師巧妙的將3D造型的LOGO放在圓心上，非常引人注目。 
頁(yè)面左邊，長(zhǎng)短不一的線段在視覺(jué)中形成虛實(shí)的變化，強(qiáng)調(diào)了頁(yè)面空間的構(gòu)成。

此主題相關(guān)圖片如下：

離心放射的線條，具有力量和挺拔的感覺(jué)。類(lèi)似于太陽(yáng)的光芒，使版面的視線更加開(kāi)闊。 

　　他同時(shí)具有吸引瀏覽者視線的作用，和同心放射有異曲同工之妙。

此主題相關(guān)圖片如下：

線條還具有分割版面的作用。 
　　在上頁(yè)中，水平線將頁(yè)面分割成上下兩部分。 

　　在頁(yè)面上部，曲線的勾勒配合色彩漸變，創(chuàng)造出不同的形體（產(chǎn)品），并通過(guò)右上角的線（產(chǎn)品輪廓）聯(lián)系起來(lái)，并將視線引導(dǎo)到網(wǎng)站的LOGO上面。 

　　在頁(yè)面下部，線條分割造成大小方向不一的，帶有圓角的形，作為網(wǎng)站的功能按鈕區(qū)。通過(guò)柔軟并稍微向右上傾斜的波浪線連成一個(gè)整體。同樣將視線引導(dǎo)到LOGO附近。

 此主題相關(guān)圖片如下：

在這個(gè)頁(yè)面中，優(yōu)美的曲線將頁(yè)面清晰的分割為功能和內(nèi)容兩個(gè)區(qū)域。 

　　同時(shí)，富有變化的，柔軟流暢的曲線，配合時(shí)尚的色彩，將這個(gè)女性用品網(wǎng)站淋漓盡致的表達(dá)出來(lái)。

此主題相關(guān)圖片如下：

這是上面的系列站點(diǎn)，在這里，向上，挺拔的直線分割了整個(gè)頁(yè)面。直線和中灰色彩的運(yùn)用，突出了網(wǎng)站的男性定位。

此主題相關(guān)圖片如下：

面的視覺(jué)構(gòu)成 

線的推移形成面。面是無(wú)數(shù)點(diǎn)和線的組合。 

　　面具有一定的面積和質(zhì)量，占據(jù)空間的位置更多，因而相比點(diǎn)和線來(lái)說(shuō)視覺(jué)沖擊力更大更強(qiáng)烈。 

　　面的形狀可以大概的分為以下幾種： 

　　幾何型的面：方，圓，三角，多邊型的面在頁(yè)面中經(jīng)常出現(xiàn)。而一段文字也可以看做是一個(gè)方形的面； 

　　有機(jī)切面：可以用弧形相交或者相切得到； 

　　不規(guī)則形的面和意外因素形成的隨意形面。 

　　面具有自己鮮明的個(gè)性和情感特征，在網(wǎng)頁(yè)的版面設(shè)計(jì)上，不同形狀的面之間的相互關(guān)系和整體的和諧需要我們?nèi)ナ炀毎盐铡?nbsp;

　　可以這么說(shuō)，只有合理的安排好面的關(guān)系，才能設(shè)計(jì)出充滿美感，藝術(shù)加實(shí)用的網(wǎng)頁(yè)作品。 下面我們舉幾個(gè)實(shí)例來(lái)具體說(shuō)明： 

方形的面具有沉著，穩(wěn)重，厚實(shí)，堅(jiān)強(qiáng)的男性特征。 

　　IBM的網(wǎng)站使用了大量方形的面，充分表達(dá)了這個(gè)國(guó)際公司深厚的背景和強(qiáng)大實(shí)力。 

　　在方形面的應(yīng)用上，大小有明顯的區(qū)別，重點(diǎn)突出。位置整齊但也有微小的變化，在嚴(yán)肅中透露輕松。 

　　在視覺(jué)中心的位置，放置頁(yè)面最大面積的深灰色的方形，配合線條、文字和色彩，以及頁(yè)面上唯一的，亮麗的自由面（女性頭部）將重點(diǎn)信息完整強(qiáng)烈的表達(dá)出來(lái)。 

　　這個(gè)頁(yè)面可以說(shuō)是商業(yè)站點(diǎn)中的典范之作。

 此主題相關(guān)圖片如下：

同樣是方形面運(yùn)用的典范之作。在這個(gè)頁(yè)面，面的大小和色彩對(duì)比更加強(qiáng)烈。 

　　頁(yè)面中部的幾個(gè)彩色塊也可以看做是點(diǎn)，在豐富了頁(yè)面的色彩，起了點(diǎn)睛的作用。

 此主題相關(guān)圖片如下：

在這個(gè)頁(yè)面中，有機(jī)的接近流線形的面（蘋(píng)果電腦）占據(jù)了頁(yè)面的大部分位置，造成強(qiáng)烈的視覺(jué)沖擊。 

　　帶圓狐的稍微向右上方傾斜的有機(jī)三角形，充滿了時(shí)尚和流行的味道，在由多個(gè)透明按鈕組成的水平的面上，大方又帶有動(dòng)感，輕盈又不失穩(wěn)重。

 此主題相關(guān)圖片如下：

圓形的面和自由形的面組成了一個(gè)極不穩(wěn)定的倒三角構(gòu)圖。加上網(wǎng)頁(yè)中動(dòng)態(tài)的高速向外沖的卡通飛車(chē)高手，制造了一個(gè)緊張的環(huán)境，讓觀眾在擔(dān)心之后，自然記住了這個(gè)特殊的視覺(jué)效果。 

　　倒三角形可以給人們活潑，新穎的感覺(jué)。 

　　倒三角面的不穩(wěn)定性，可以制造危險(xiǎn)的氣氛。

 此主題相關(guān)圖片如下：

圓形的面給人以充實(shí)、圓滿、活潑的感覺(jué)，比較適合表現(xiàn)兒童或者女性特征。 

　　這個(gè)頁(yè)面充滿了天真和童趣，緊張之余，我們都希望能夠去這放松放松。 

　　同時(shí)這個(gè)頁(yè)面還采用了很多的動(dòng)態(tài)元素，符合兒童好動(dòng)的心理。

 此主題相關(guān)圖片如下：

耐克的站點(diǎn)大量采用了接近圓形的幾何面，加上灌藍(lán)高手的精彩定格，使整個(gè)站點(diǎn)充滿了跳躍和運(yùn)動(dòng)的感覺(jué)。 

　　在這個(gè)頁(yè)面中，自由形（喬丹）的運(yùn)動(dòng)方向?qū)σ暰€的引導(dǎo)起了很大作用，他將視線牽引到頁(yè)面的右上角。右上角的面所要推薦的產(chǎn)品，應(yīng)該是這個(gè)頁(yè)面的重點(diǎn)中的重點(diǎn)了。 

　　中間位置不同內(nèi)容的幾何面的運(yùn)用，避免了單純采用文字的單調(diào)感。既能夠最直接地反映產(chǎn)品的信息，又在色彩和版面上為整個(gè)站點(diǎn)活躍了氣氛，可謂是一舉多得。

 此主題相關(guān)圖片如下：

面還有正形和負(fù)形兩種表現(xiàn)。 

　　正型可以解釋為以白襯黑。在頁(yè)面的右邊，白底上的四個(gè)人物動(dòng)態(tài)可以稱(chēng)之為正型。正型在頁(yè)面中特性為一個(gè)實(shí)體，具有明確，肯定，向前的感覺(jué)。 

　　負(fù)形可以理解為以黑襯白。在頁(yè)面的左邊圓中，女性的白色衣服和皮膚即為負(fù)形，在重色的背景的襯托下，體現(xiàn)出虛幻，輕松，深遠(yuǎn)的感覺(jué)。 

總結(jié) 

　　自然界的萬(wàn)物形態(tài)構(gòu)成都離不開(kāi)點(diǎn)、線、面。 

　　點(diǎn)、線、面是視覺(jué)構(gòu)成的基本元素，是每個(gè)網(wǎng)頁(yè)設(shè)計(jì)師必須熟練掌握的設(shè)計(jì)語(yǔ)言。 

　　點(diǎn)、線、面具有不同的情感特征，我們要善于采用不同的組合去體現(xiàn)不同的情感訴求。 

　　在網(wǎng)頁(yè)的視覺(jué)構(gòu)成中，點(diǎn)、線、面既是最基本的造型元素，又是最重要的表現(xiàn)手段。 

　　在我們確定網(wǎng)頁(yè)主體形象的位置、動(dòng)態(tài)時(shí)，點(diǎn)線面將是需要最先考慮的因素。只有合理的安排好點(diǎn)線面的互相關(guān)系，才能設(shè)計(jì)出具有最佳視覺(jué)效果的頁(yè)面，充分的表達(dá)出網(wǎng)頁(yè)最終的訴求！