點的視覺構(gòu)成
在網(wǎng)頁中，一個單獨而細(xì)小的形象可以稱之為點。點是相比較而言的，比如一個漢字是由很多筆劃組成的，但是在整個頁面中，他可以稱為一個點。點也可以是一個網(wǎng)頁中相對微小單純的視覺形象，如一個按鈕（BUTTON），一個LOGO等等。
需要說明的是，并不是只有圓的形才叫一個點，方形，三角，自由形都可以作為視覺上的點，點是相對線和面而存在的視覺元素。
點是構(gòu)成網(wǎng)頁的最基本單位，在網(wǎng)頁設(shè)計中，經(jīng)常需要我們主觀的加些點，如在新聞的標(biāo)題后加個NEW，在每小行文字的前面加個方或者圓的點。
點在頁面中起到活潑生動的作用，使用得當(dāng)，甚至可以是畫龍點睛的。
一個網(wǎng)頁往往需要有數(shù)量不等，形狀各異的點來構(gòu)成。點的形狀、方向、大小、位置、聚集，發(fā)散，能夠給人帶來不同的心理感受。
下面我們就具體的頁面，談?wù)匋c的運用和表現(xiàn)。
在這個頁面中，只有唯一的一個點，四周是大量的空白，于是它馬上成為吸引視線，引發(fā)興趣的視覺中心。而這個視覺中心就應(yīng)該是你想表達(dá)的主題，效果是最直接明確的。
在你實際瀏覽這個頁面的時候，這個處于三維空間點（花生）旁邊環(huán)繞著一段電腦聯(lián)線。三維技術(shù)的運用，更突出了這個視覺中心，讓你迫不及待的點擊進(jìn)入下一級頁面。
此主題相關(guān)圖片如下：
這是同一網(wǎng)站二級頁面中的一個，我們可以將每一組形看做是一個點，如NEWS可以稱做點，右下角還有四個點。所有的點互相呼應(yīng)，組成不穩(wěn)定的三角構(gòu)圖。在這個頁面中，重復(fù)出現(xiàn)了用三維動態(tài)技術(shù)表現(xiàn)，最吸引視線的首頁的點（花生）。
同一視覺形象（點）的不斷重復(fù)出現(xiàn)，能夠增加瀏覽者的印象。
此主題相關(guān)圖片如下：
在這個頁面的下部，點的水平排列，形成平穩(wěn)，安詳?shù)木€的感覺。
三種形狀相似的點隨著點擊產(chǎn)生的顏色變化，同時在頁面中心位置出現(xiàn)不同的產(chǎn)品圖片，給大家一種跳躍，動蕩，歡快的感受。
在頁面中四處飄蕩的點（TOP10的圖標(biāo)）和由左至右移動的文字（也是由點組成），加強(qiáng)了頁面的活躍氣氛。
在同一個空間里面體現(xiàn)了兩種不同情緒的動態(tài)的對比，這也是網(wǎng)頁相對傳統(tǒng)平面媒體的極大優(yōu)勢。
做為呼應(yīng)，設(shè)計師特意在頁面的中上部，采用了很多較小的點做底紋，起到了豐富頁面層次的作用。
頁面上下兩段橫向的色條，強(qiáng)調(diào)了水平線的穩(wěn)定情緒，將頁面統(tǒng)一起來。
此主題相關(guān)圖片如下：
在這個二級頁面中，右邊垂直排列的圓點（由1到10），起到了引導(dǎo)視線和強(qiáng)調(diào)次序的作用。
點的等距垂直排列，在視覺上形成虛擬的豎線。加上段落文字的共同邊距，在視覺上形成豎線，起到分割頁面的作用。
此主題相關(guān)圖片如下：
在這個頁面中，點的大小，位置，顏色，聚散的不同變化和組合，產(chǎn)生了輕松，活潑，流動，抒情，愉快的氣氛。
通過優(yōu)美的弧線的引導(dǎo)，人們的視線最終將集中在"wasabi:sneaker"這幾個由點組成的文字上。自然，這也是設(shè)計師所要突出訴求的主題之一。
此主題相關(guān)圖片如下：
在頁面下部，設(shè)計師并列運用高低顏色不同的點，若隱若現(xiàn)，突出了頁面以點造型的設(shè)計語言。
注意在兩個頁面中都出現(xiàn)了三個斜向排列的帶有漸變色的點。它為頁面增加了動勢和前后的空間層次，實屬不容忽視的精彩之處！
線的視覺構(gòu)成
點的延伸形成線。
線在頁面中的作用在于表示方向、位置、長短、寬度、形狀、質(zhì)量和情緒。
線是分割頁面的主要元素之一，是決定頁面現(xiàn)象的基本要素。
總的來說，線分為直線和曲線兩種。這是線的總體形狀。同時線還具有本體形狀，兩端的形狀。
線的總體形狀有垂直、水平、傾斜、幾何曲線，自由線這幾種可能。
線是具有情感的。比如水平線給人開闊，安寧，平靜的感覺；斜線具有動力，不安，速度和現(xiàn)代意識；垂直線具有莊嚴(yán)，挺拔，力量，向上的感覺；曲線給人柔軟流暢的女性特征；自由曲線是最好的情感抒發(fā)手段。
線的放射，粗細(xì)，漸變可以體現(xiàn)三維空間的感覺。
將不同的線運用到頁面設(shè)計中，會獲得不同的效果。知道什么時候應(yīng)該運用什么樣的線條，可以充分的表達(dá)你所要體現(xiàn)的東西。
總之，線條是網(wǎng)頁設(shè)計師必須熟練運用的最得力的表現(xiàn)工具。我們應(yīng)該對他有一定的了解。下面我們用一些精彩實例來做具體的分析說明。
在這個頁面中，水平線的重復(fù)排列形成一種強(qiáng)烈的形式感和視覺沖擊力，能夠在第一眼就產(chǎn)生興趣，達(dá)到了吸引訪問者注意力的目的。
自由曲線的運用，打破了水平線組成的莊嚴(yán)和單調(diào)，給網(wǎng)頁增加了豐富、流暢、活潑的氣氛。
水平線和自由曲線的組合運用，形成新穎的形式和不同情感的對比，從而將視覺中心有力的襯托出來。
值得提出的是，頁面中點（按鈕）的運用，使頁面的形象更加活潑，豐滿。
此主題相關(guān)圖片如下：
在這個頁面中，設(shè)計師運用了具有書法味道的線條，粗糙的邊緣形成特殊的肌理，表現(xiàn)了強(qiáng)烈的個性特征和藝術(shù)效果。
邊緣圓滑的曲線條（字母）在粗糙背景的襯托下，顯得很特殊并引人注目。在這里，字母也可以看做是構(gòu)成頁面的線條的一種。
底紋采用了不規(guī)則，方向不一的虛線條，在豐富肌理的同時，和粗線、曲線（字母）形成對比，產(chǎn)生了縱深空間的感覺。
曲線（字母）的大小對比也可以豐富空間層次。
近實遠(yuǎn)虛的繪畫原理，在這里得到了最充分地體現(xiàn)
此主題相關(guān)圖片如下：
將曲線（字母）隨意的重疊，變形，占踞了頁面左上角的很的一部分空間。配合夢幻般的背景，體現(xiàn)了設(shè)計師虛無迷茫，雜亂無章的思緒。
自由曲線是表現(xiàn)情感的最佳造型手段。
此主題相關(guān)圖片如下：
線條除了體現(xiàn)情感外，還能夠利用粗細(xì)、虛實（例二談過），漸變，放射產(chǎn)生深度空間和廣度空間。
上面的頁面中，圍繞同心的放射圓，在粗細(xì)和虛實上形成深度空間。設(shè)計師巧妙的將3D造型的LOGO放在圓心上，非常引人注目。
頁面左邊，長短不一的線段在視覺中形成虛實的變化，強(qiáng)調(diào)了頁面空間的構(gòu)成。
離心放射的線條，具有力量和挺拔的感覺。類似于太陽的光芒，使版面的視線更加開闊。
他同時具有吸引瀏覽者視線的作用，和同心放射有異曲同工之妙。
線條還具有分割版面的作用。
在上頁中，水平線將頁面分割成上下兩部分。
在頁面上部，曲線的勾勒配合色彩漸變，創(chuàng)造出不同的形體（產(chǎn)品），并通過右上角的線（產(chǎn)品輪廓）聯(lián)系起來，并將視線引導(dǎo)到網(wǎng)站的LOGO上面。
在頁面下部，線條分割造成大小方向不一的，帶有圓角的形，作為網(wǎng)站的功能按鈕區(qū)。通過柔軟并稍微向右上傾斜的波浪線連成一個整體。同樣將視線引導(dǎo)到LOGO附近。
此主題相關(guān)圖片如下：
在這個頁面中，優(yōu)美的曲線將頁面清晰的分割為功能和內(nèi)容兩個區(qū)域。
同時，富有變化的，柔軟流暢的曲線，配合時尚的色彩，將這個女性用品網(wǎng)站淋漓盡致的表達(dá)出來。
這是上面的系列站點，在這里，向上，挺拔的直線分割了整個頁面。直線和中灰色彩的運用，突出了網(wǎng)站的男性定位。
面的視覺構(gòu)成
線的推移形成面。面是無數(shù)點和線的組合。
面具有一定的面積和質(zhì)量，占據(jù)空間的位置更多，因而相比點和線來說視覺沖擊力更大更強(qiáng)烈。
面的形狀可以大概的分為以下幾種：
幾何型的面：方，圓，三角，多邊型的面在頁面中經(jīng)常出現(xiàn)。而一段文字也可以看做是一個方形的面；
有機(jī)切面：可以用弧形相交或者相切得到；
不規(guī)則形的面和意外因素形成的隨意形面。
面具有自己鮮明的個性和情感特征，在網(wǎng)頁的版面設(shè)計上，不同形狀的面之間的相互關(guān)系和整體的和諧需要我們?nèi)ナ炀毎盐铡?nbsp;
可以這么說，只有合理的安排好面的關(guān)系，才能設(shè)計出充滿美感，藝術(shù)加實用的網(wǎng)頁作品。 下面我們舉幾個實例來具體說明：
方形的面具有沉著，穩(wěn)重，厚實，堅強(qiáng)的男性特征。
IBM的網(wǎng)站使用了大量方形的面，充分表達(dá)了這個國際公司深厚的背景和強(qiáng)大實力。
在方形面的應(yīng)用上，大小有明顯的區(qū)別，重點突出。位置整齊但也有微小的變化，在嚴(yán)肅中透露輕松。
在視覺中心的位置，放置頁面最大面積的深灰色的方形，配合線條、文字和色彩，以及頁面上唯一的，亮麗的自由面（女性頭部）將重點信息完整強(qiáng)烈的表達(dá)出來。
這個頁面可以說是商業(yè)站點中的典范之作。
此主題相關(guān)圖片如下：
同樣是方形面運用的典范之作。在這個頁面，面的大小和色彩對比更加強(qiáng)烈。
頁面中部的幾個彩色塊也可以看做是點，在豐富了頁面的色彩，起了點睛的作用。
此主題相關(guān)圖片如下：
在這個頁面中，有機(jī)的接近流線形的面（蘋果電腦）占據(jù)了頁面的大部分位置，造成強(qiáng)烈的視覺沖擊。
帶圓狐的稍微向右上方傾斜的有機(jī)三角形，充滿了時尚和流行的味道，在由多個透明按鈕組成的水平的面上，大方又帶有動感，輕盈又不失穩(wěn)重。
此主題相關(guān)圖片如下：
圓形的面和自由形的面組成了一個極不穩(wěn)定的倒三角構(gòu)圖。加上網(wǎng)頁中動態(tài)的高速向外沖的卡通飛車高手，制造了一個緊張的環(huán)境，讓觀眾在擔(dān)心之后，自然記住了這個特殊的視覺效果。
倒三角形可以給人們活潑，新穎的感覺。
倒三角面的不穩(wěn)定性，可以制造危險的氣氛。
此主題相關(guān)圖片如下：
圓形的面給人以充實、圓滿、活潑的感覺，比較適合表現(xiàn)兒童或者女性特征。
這個頁面充滿了天真和童趣，緊張之余，我們都希望能夠去這放松放松。
同時這個頁面還采用了很多的動態(tài)元素，符合兒童好動的心理。
此主題相關(guān)圖片如下：
耐克的站點大量采用了接近圓形的幾何面，加上灌藍(lán)高手的精彩定格，使整個站點充滿了跳躍和運動的感覺。
在這個頁面中，自由形（喬丹）的運動方向?qū)σ暰€的引導(dǎo)起了很大作用，他將視線牽引到頁面的右上角。右上角的面所要推薦的產(chǎn)品，應(yīng)該是這個頁面的重點中的重點了。
中間位置不同內(nèi)容的幾何面的運用，避免了單純采用文字的單調(diào)感。既能夠最直接地反映產(chǎn)品的信息，又在色彩和版面上為整個站點活躍了氣氛，可謂是一舉多得。
此主題相關(guān)圖片如下：
面還有正形和負(fù)形兩種表現(xiàn)。
正型可以解釋為以白襯黑。在頁面的右邊，白底上的四個人物動態(tài)可以稱之為正型。正型在頁面中特性為一個實體，具有明確，肯定，向前的感覺。
負(fù)形可以理解為以黑襯白。在頁面的左邊圓中，女性的白色衣服和皮膚即為負(fù)形，在重色的背景的襯托下，體現(xiàn)出虛幻，輕松，深遠(yuǎn)的感覺。
總結(jié)
自然界的萬物形態(tài)構(gòu)成都離不開點、線、面。
點、線、面是視覺構(gòu)成的基本元素，是每個網(wǎng)頁設(shè)計師必須熟練掌握的設(shè)計語言。
點、線、面具有不同的情感特征，我們要善于采用不同的組合去體現(xiàn)不同的情感訴求。
在網(wǎng)頁的視覺構(gòu)成中，點、線、面既是最基本的造型元素，又是最重要的表現(xiàn)手段。
在我們確定網(wǎng)頁主體形象的位置、動態(tài)時，點線面將是需要最先考慮的因素。只有合理的安排好點線面的互相關(guān)系，才能設(shè)計出具有最佳視覺效果的頁面，充分的表達(dá)出網(wǎng)頁最終的訴求！
