視覺空間元素在網(wǎng)頁設(shè)計中的應(yīng)用研究

李泗蘭 郭雅

摘要：隨著互聯(lián)網(wǎng)的發(fā)展，越來越多企業(yè)意識到通過互聯(lián)網(wǎng)發(fā)布企業(yè)網(wǎng)站可以大范圍、低成本地宣傳企業(yè)、提升產(chǎn)品知名度、與客戶進(jìn)行線上互動，及時解決客戶問題，提高企業(yè)利潤等。目前很多網(wǎng)頁設(shè)計師只注重功能和實(shí)用性，忽視了網(wǎng)站的藝術(shù)性設(shè)計，往往給人一種枯燥乏味的感覺，缺乏吸引力，沒有關(guān)注到瀏覽者的心理感受，從而使其功能大打折扣，而網(wǎng)頁要給訪問者留下深刻的印象，使網(wǎng)站信息易于被用戶接收傳播，應(yīng)該做到美觀與實(shí)用相結(jié)合，使網(wǎng)頁構(gòu)成合理有趣、色彩豐富，能在感官上迎合瀏覽者的心理，吸引其注意力，并帶來愉悅感受。因此，掌握好視覺空間元素在網(wǎng)頁設(shè)計中的應(yīng)用是十分有必要的。

關(guān)鍵詞：視覺空間元素;網(wǎng)頁設(shè)計;點(diǎn)、線、面

中圖分類號：G399 文獻(xiàn)標(biāo)識碼：A

文章編號：1009-3044（2019）29-0212-03

高等職業(yè)院校是以提高人才培養(yǎng)質(zhì)量、服務(wù)產(chǎn)業(yè)轉(zhuǎn)型升級和創(chuàng)新驅(qū)動發(fā)展培養(yǎng)造就大批高素質(zhì)技術(shù)技能型人才為目的。因此，提高學(xué)生專業(yè)技能在高職院校的整體教學(xué)中占據(jù)重要地位。

目前，很多高校計算機(jī)專業(yè)都有開設(shè)《網(wǎng)頁設(shè)計》這門課程，它是一門實(shí)踐性很強(qiáng)的學(xué)科。作為非藝術(shù)專業(yè)的學(xué)生，由于沒有系統(tǒng)的學(xué)習(xí)平面構(gòu)成課程，以致在網(wǎng)頁設(shè)計過程中普遍存在對視覺空間元素的使用不恰當(dāng)、色彩搭配不協(xié)調(diào)、布局不合理、專業(yè)技能和創(chuàng)新能力有待提高等相關(guān)問題。

1視覺空間元素

在網(wǎng)頁的藝術(shù)設(shè)計里，網(wǎng)頁中的文本、圖形、圖像、音頻、視頻、動畫等，均作為視覺形式的語言，它們在網(wǎng)頁設(shè)計師的眼中都是最基本的視覺空間元素一點(diǎn)、線、面。網(wǎng)頁設(shè)計的過程就是在特定的空間中設(shè)計和布局好這些點(diǎn)、線、面以及留白，使其準(zhǔn)確傳達(dá)出特定的信息，給人以藝術(shù)美的享受。20世紀(jì)初，俄國畫家現(xiàn)代抽象繪畫創(chuàng)始人瓦西里·康定斯基最先提出僅僅利用點(diǎn)、面、線、色等純形式的因素，傳達(dá)精神和情感的內(nèi)涵，能帶給人美妙的光彩。網(wǎng)頁設(shè)計師從不同的角度觀察優(yōu)秀網(wǎng)站網(wǎng)頁中的點(diǎn)、線、面的構(gòu)成及變化規(guī)律，就可以發(fā)現(xiàn)，不同主題的網(wǎng)站，其點(diǎn)、線、面視覺元素的距離、位置、面積和視覺流程等均運(yùn)用了平面構(gòu)成規(guī)律，充分展現(xiàn)出視覺元素的魅力。

因此，在不同主題網(wǎng)站的設(shè)計里，網(wǎng)頁設(shè)計師有必要對點(diǎn)、線、面視覺元素的設(shè)計應(yīng)用進(jìn)行系統(tǒng)的了解，深人細(xì)致的研究。

1.1網(wǎng)頁的基礎(chǔ)元素一點(diǎn)

在平面構(gòu)成中，點(diǎn)作為最基礎(chǔ)的構(gòu)成元素存在。點(diǎn)的構(gòu)成存在兩種形式，一是不規(guī)則的自由排列，一是按一定規(guī)律的秩序進(jìn)行排列，無論采取哪種排列方式都需按照形式美的法則來進(jìn)行。在實(shí)際的網(wǎng)頁設(shè)計中，點(diǎn)是相對而言的，頁面中任何相對小面積的元素都可以視為是一個點(diǎn)。例如在靜態(tài)空間中，一張小圖片、一個文字、一個小圖標(biāo)，都可被視為一個點(diǎn);在動態(tài)空間中，一個音頻、視頻、動畫，都可被視為一個點(diǎn);在互動空間中，一個菜單、按鈕、頁面、超鏈接文本，甚至一個網(wǎng)站，都可被視為一個點(diǎn)。如圖1所示。

1.2網(wǎng)頁的互動元素一線

線是點(diǎn)的移動軌跡。點(diǎn)的大小決定了線的寬度。點(diǎn)移動的速度和方向決定著線的形態(tài)。線有兩個作用，一是用于塑造形象，二是用于分割頁面空間布局，線是頁面布局的決定元素，使畫面承載的信息規(guī)范、整齊、有條理，使瀏覽者清晰、明確地領(lǐng)會到網(wǎng)頁設(shè)計師所要表達(dá)的信息。在互動空間中導(dǎo)航欄的設(shè)計上，按照導(dǎo)航欄內(nèi)容的主次和內(nèi)在關(guān)聯(lián)性進(jìn)行分類，根據(jù)不同瀏覽者進(jìn)行需求互動點(diǎn)擊，形成不同的虛擬線型網(wǎng)絡(luò)。如圖2所示。

根據(jù)性質(zhì)分，線有直線和曲線兩種，不同的線條給人不同的視覺感受。在網(wǎng)頁中，線有真實(shí)線和虛擬線之分，不同的線型帶給人不同的感受。水平線。給人靜止、安定、舒展、延伸的感受，容易讓人聯(lián)想到海平面;垂直線，給人以嚴(yán)肅、挺拔、上升、下降等感受;斜線，給人以速度、動感和活力的感受;曲線，給人以柔軟和節(jié)奏美、優(yōu)雅和理性的現(xiàn)代美;自由曲線則給人以一種富有變化的輕松自然美。如圖3所示。

1.3網(wǎng)頁中的視覺韻律一面

在設(shè)計視覺效果中，面是點(diǎn)的擴(kuò)大與集合，線的寬度增加與集中、平移、翻轉(zhuǎn)均可產(chǎn)生面的感覺。相對于點(diǎn)和線來說，面占據(jù)空間多，視覺沖擊力強(qiáng)。面可分為真實(shí)空間面和虛擬空間面兩類。面的量感和體積感特征在網(wǎng)頁中起到穩(wěn)定作用，如圖4所示。此外，面可以用多種方法來表現(xiàn)二維空間中的立體形態(tài)，使之產(chǎn)生三維空間感，如圖5所示。

2視覺空間元素在網(wǎng)頁設(shè)計中的綜合應(yīng)用

作為一名優(yōu)秀的網(wǎng)頁設(shè)計師，首先要有一定的審美能力，即具有一定的鑒別和領(lǐng)會事物或藝術(shù)品的美的能力;其次要具有一定的創(chuàng)意，創(chuàng)意是一個網(wǎng)頁設(shè)計師的靈魂。網(wǎng)頁設(shè)計師根據(jù)平時所積累的各種各樣的生活素材在瞬間得到完美結(jié)合，所形成的一種美的創(chuàng)新，它是靈感與意境的結(jié)合，是完美與創(chuàng)新的化身。圖6、圖7、圖8、圖9為點(diǎn)、線、面在網(wǎng)頁中的綜合應(yīng)用實(shí)例。

3結(jié)束語

通過對視覺空間元素點(diǎn)、線、面知識的學(xué)習(xí)與掌握，一定程度上提高了學(xué)生對網(wǎng)頁元素的排版布局、色彩搭配能力，以及創(chuàng)新創(chuàng)意能力;同時，提高了學(xué)生對藝術(shù)的審美能力，從而設(shè)計出的作品具有美感、新穎、貼切企業(yè)和瀏覽者的需求，為將來成為一名優(yōu)秀的網(wǎng)頁設(shè)計師打下夯實(shí)的基礎(chǔ)。