平面視覺元素在網(wǎng)頁設(shè)計中的應(yīng)用

向芊西

摘 要： 隨著時代的不斷發(fā)展，以往的平面設(shè)計已經(jīng)向網(wǎng)絡(luò)方面發(fā)展延伸，在很大程度上突破了印刷技術(shù)的限制。就現(xiàn)階段而言，一些企業(yè)在網(wǎng)頁設(shè)計上存在一些不足，主要體現(xiàn)在對平面視覺元素的應(yīng)用上。本文對平面視覺元素的應(yīng)用進(jìn)行探究，分析其在網(wǎng)頁設(shè)計中的應(yīng)用問題，并給出相關(guān)的解決建議。

關(guān)鍵詞： 平面視覺元素 網(wǎng)頁設(shè)計 色彩

一、網(wǎng)頁設(shè)計中的平面視覺元素

一般來說，以往的平面設(shè)計在視覺元素的應(yīng)用上受到印刷技術(shù)的限制，隨著網(wǎng)絡(luò)技術(shù)的不斷發(fā)展，平面設(shè)計逐漸延伸到網(wǎng)絡(luò)，在這一背景下的平面設(shè)計具備效率高、圖文互動強(qiáng)、信息資源豐富的優(yōu)點(diǎn)，賦予原有的平面視覺元素在網(wǎng)頁設(shè)計中的應(yīng)用新的意義。目前，構(gòu)成網(wǎng)頁設(shè)計的圖形視覺元素主要包括文本元素、圖形元素和色彩元素。

（一）文字元素

在網(wǎng)頁設(shè)計中，文字元素起著至關(guān)重要的作用，它是向?yàn)g覽者傳遞網(wǎng)頁信息的重要載體，其地位是不可撼動的。一般來說，文本在很大程度上決定了整個網(wǎng)站的效果。在網(wǎng)頁設(shè)計中，文字的易讀性和辨識性是非常重要的。因此，設(shè)計師在使用手機(jī)文本時要謹(jǐn)慎。同時，在網(wǎng)頁設(shè)計中，設(shè)計者必須牢固設(shè)置主體文本，處理相關(guān)細(xì)節(jié)，安排文本與圖形的交集。在當(dāng)前的網(wǎng)頁設(shè)計階段，文字變得越來越圖形化。換句話說，文本作為一種圖形元素體現(xiàn)出來，增強(qiáng)了審美效果，對原有功能起到了強(qiáng)化作用。

（二）圖形元素

從客觀角度來說，網(wǎng)頁的整體美感在很大程度上取決于圖形元素的應(yīng)用，因?yàn)楹臀淖衷叵啾?，其具有較強(qiáng)的藝術(shù)美感和視覺沖擊力。除此之外，它在傳遞信息方面也比文字元素要直接得多。然而，為了充分發(fā)揮圖形元素的作用，我們需要注意其色彩搭配和版面的布局，需要適應(yīng)人們的審美心理，達(dá)到在短時間給人留下深刻印象的目的。一般來說，網(wǎng)頁設(shè)計中的圖像具備導(dǎo)向和鏈接的功能。根據(jù)相關(guān)心理學(xué)研究，在瀏覽網(wǎng)頁時，眼睛會先垂直落在屏幕的中心，然后看四邊。

設(shè)計師在進(jìn)行網(wǎng)頁設(shè)計的時候，往往會將重要的信息安排在注視點(diǎn)高的區(qū)域，并且在這種情況下，會根據(jù)視覺流程合理安排圖片的適度位置。我們在瀏覽圖片的時候會首先通過網(wǎng)絡(luò)下載，也就是說，網(wǎng)頁中的圖片受寬帶的限制，在進(jìn)行網(wǎng)頁設(shè)計時設(shè)計者會盡可能地減少圖形文件量，不過文件量越低，圖片的分辨率就越低，受眾的體驗(yàn)比較差。針對這種情況，設(shè)計者需要從實(shí)際情況出發(fā)，選擇最佳的圖形文件量。

（三）色彩元素

在網(wǎng)頁設(shè)計過程中，色彩的匹配會直接影響網(wǎng)站的整體風(fēng)格。色彩是設(shè)計中最重要的因素之一，它以文字和圖形為基礎(chǔ)，主要通過視覺沖擊作用于觀眾的心理。具體來說，就是通過不同色彩給人們帶來不同的心理暗示，比如黑色是沉穩(wěn)、黃色是溫暖、紅色是官方，等等。除此之外，色彩的飽和度、明度及色調(diào)也會影響網(wǎng)頁的視覺效果。同時，需要強(qiáng)調(diào)的是，網(wǎng)頁設(shè)計師在運(yùn)用色彩元素的時候，必須保證其符合國際色彩標(biāo)準(zhǔn)，因?yàn)榛ヂ?lián)網(wǎng)是建立在同一平臺上的，盡量使用網(wǎng)頁安全的顏色，禁止無節(jié)制地使用大量顏色。再者，設(shè)計師還需要從網(wǎng)頁的實(shí)際情況出發(fā)，對色調(diào)和輔助色進(jìn)行調(diào)整，保證整體的美觀度和舒適感，同時符合網(wǎng)頁內(nèi)容的主題。

二、平面視覺元素在網(wǎng)頁設(shè)計中的應(yīng)用問題

（一）網(wǎng)頁版式設(shè)計應(yīng)用上的問題

就現(xiàn)階段來看，我國一些企業(yè)在網(wǎng)站設(shè)計上，過于追求商業(yè)價值，這就使得網(wǎng)頁板式設(shè)計在應(yīng)用平面視覺元素上缺乏藝術(shù)性和合理性。除此之外，一些企業(yè)在做網(wǎng)頁的過程中，要求設(shè)計師不斷豐富頁面內(nèi)容，進(jìn)一步導(dǎo)致簡單羅列網(wǎng)頁版塊的現(xiàn)象出現(xiàn)，影響網(wǎng)站信息質(zhì)量，還會給人一種信息冗雜的感覺。

（二）文字視覺元素應(yīng)用上的問題

從客觀角度來看，中國的字體結(jié)構(gòu)比較復(fù)雜，在中國的網(wǎng)站設(shè)計中對中文字體格式的發(fā)展等方面存在一定的限制。在這種情況下，一些網(wǎng)站在設(shè)計過程中會追求文字的視覺效果，如現(xiàn)有的單詞下劃線的鏈接，這不是大問題，但是設(shè)計師往往忽略字體間距，進(jìn)一步使頁面發(fā)生擁堵，很容易引起客人的反感。此外，國內(nèi)一些網(wǎng)站在設(shè)計過程中缺乏對頁面整潔和模塊區(qū)域的考慮，出現(xiàn)加大字體等錯誤的文字用法。

（三）網(wǎng)頁圖片設(shè)計方面存在的問題

網(wǎng)頁平面設(shè)計不合理主要表現(xiàn)在兩個方面：一方面，圖像大小問題，一些設(shè)計師在文本格式的應(yīng)用程序中，沒有更大的圖片，導(dǎo)致整個頁面的效果缺乏細(xì)節(jié)、豐滿，或只是沒有更大的圖片，進(jìn)一步紊亂，難以突出關(guān)鍵信息。另一方面，圖像的位置、面積、數(shù)量和分辨率將直接影響觀眾的視覺感知或信息的缺乏。因此，布局設(shè)計不當(dāng)容易導(dǎo)致視覺信息的錯誤引導(dǎo)。

（四）網(wǎng)頁色彩布置上存在的問題

在網(wǎng)頁設(shè)計中，常常會出現(xiàn)色彩布置的問題，比如整體色彩不協(xié)調(diào)、內(nèi)在美感不明顯，等等。除此之外，還存在色彩的視覺效果沖擊干擾人們?yōu)g覽頁面的情況，舉個例子來說，當(dāng)網(wǎng)頁使用帶有豐富色彩的圖片作為背景的時候，就會對人們的視覺產(chǎn)生沖擊，進(jìn)一步引起他們的閱讀疲勞。還有網(wǎng)站整體色彩和信息不搭配，比如慶祝新年的時候，有的網(wǎng)站仍然將藍(lán)色、黑色等作為主題顏色，不符合內(nèi)容信息所體現(xiàn)的情緒。

三、網(wǎng)頁設(shè)計中的平面視覺元素應(yīng)用要求

（一）網(wǎng)頁版式設(shè)計方面

在網(wǎng)頁設(shè)計中，網(wǎng)頁板式的設(shè)計是十分重要的環(huán)節(jié)，如果沒有合理有效的排版，那么平面視覺元素應(yīng)用得再好也無濟(jì)于事，傳遞的信息再有質(zhì)量也難以得到瀏覽者的深入了解。因此，那些過于追求網(wǎng)頁商業(yè)價值的企業(yè)，必須更新觀念，重視網(wǎng)頁的美觀性和各方面元素的合理配置，這樣才能取得良好的實(shí)效。首先，設(shè)計者應(yīng)該從讀者的角度出發(fā)，設(shè)計出方便讀者瀏覽的版面，還要考慮網(wǎng)頁信息的重點(diǎn)，并將其放在合理位置，這樣不僅能夠給讀者好的視覺感受，還能有效傳遞信息。

（二）文字視覺元素應(yīng)用方面

在網(wǎng)頁設(shè)計中，文字元素占據(jù)著十分重要的地位，它是向?yàn)g覽者傳遞網(wǎng)站信息的主要載體，其地位是難以被其他因素所取代的，比如圖片和視頻。因此，文本設(shè)計的質(zhì)量在很大程度上決定了整個網(wǎng)站的視覺效果。在這種情況下，設(shè)計者可以從實(shí)際需求出發(fā)，將表達(dá)內(nèi)心的情感作為根本目的，進(jìn)行適當(dāng)?shù)娜诵曰O(shè)計，鑒于目前Web客戶機(jī)種類較多，漢字字體的局限性、設(shè)計和開發(fā)，在設(shè)計過程中，設(shè)計師或使用默認(rèn)字體，進(jìn)一步提高設(shè)計效率和讀者瀏覽效率。

（三）網(wǎng)頁圖形圖像應(yīng)用方面

隨著互聯(lián)網(wǎng)的發(fā)展，人們更傾向于從圖片中獲取想要的信息，在網(wǎng)頁設(shè)計中，圖像起著十分關(guān)鍵的作用。經(jīng)典的圖形圖像設(shè)計，不僅僅是視覺效果的準(zhǔn)確和豐富，而且是網(wǎng)站主題內(nèi)容的表現(xiàn)。設(shè)計者需要在保證頁面效果的同時，還要讓瀏覽更方便地閱讀。比如在分辨率問題上，設(shè)計者可以將那些沒有特殊要求的圖片定位在多常用的分辨率層面上，以此解決終端顯示器分辨率帶來的局限性問題。

（四）色彩視覺元素應(yīng)用方面

在平面視覺元素中，對瀏覽者視覺影響最大的是色彩元素。在通常情況下，一個優(yōu)秀的網(wǎng)站會在網(wǎng)頁設(shè)計中合理運(yùn)用色彩符號，以此給瀏覽者和諧寬松的視覺效果，激發(fā)他們的閱讀興趣。因此，在進(jìn)行網(wǎng)頁設(shè)計的過程中，設(shè)計師要重視色彩的搭配，提高裝修的價值程度，依據(jù)整體和諧的原則運(yùn)用色彩。

比如在網(wǎng)頁的局部對比方面，設(shè)計師可以采用一些暖色和冷色，這樣能夠有效強(qiáng)化其記憶效果。同時，在主色和輔助色的選擇上，設(shè)計者需要從網(wǎng)頁的內(nèi)容信息出發(fā)，搭配與其體現(xiàn)的情緒相符合的色彩。

四、平面視覺元素在網(wǎng)頁設(shè)計中新的發(fā)展方向

從理論上來說，平面視覺元素在網(wǎng)頁設(shè)計中的應(yīng)用其實(shí)相當(dāng)于對傳統(tǒng)平面設(shè)計的延伸。二者設(shè)計的目的都是一樣的，即傳遞信息和審美。同時，網(wǎng)頁設(shè)計和傳統(tǒng)設(shè)計的視覺構(gòu)成元素也是一樣的，無外乎圖形、文字及色彩這三種。從平面設(shè)計的范疇看，網(wǎng)頁設(shè)計的不同在于它打破了傳統(tǒng)二維靜態(tài)空間的限制，實(shí)現(xiàn)了動態(tài)信息的傳遞，增強(qiáng)了與人們之間的交互性，正因?yàn)槿绱?，才使得網(wǎng)頁設(shè)計成了一個嶄新的且前景廣闊的設(shè)計領(lǐng)域。同時，信息時代的到來為網(wǎng)頁設(shè)計提供了良好的發(fā)展條件。對于人們來說，視覺元素的動態(tài)表達(dá)和交互性在很大程度上滿足了他們的需求，大大提高了他們的瀏覽興趣。另外，若從未來發(fā)展方向看，平面視覺元素在網(wǎng)頁設(shè)計中將朝以下兩方面發(fā)展：

（一）交互元素

由于網(wǎng)絡(luò)技術(shù)的不斷發(fā)展，網(wǎng)頁方面的技術(shù)不斷發(fā)展，由于平面設(shè)計中視覺元素逐漸由原本的二維空間變成多維空間的轉(zhuǎn)變，為了適應(yīng)網(wǎng)頁這一新媒體的逐漸發(fā)展，交互元素應(yīng)運(yùn)而生。就現(xiàn)階段來看，交互技術(shù)呈現(xiàn)出良好且迅速的發(fā)展趨勢，這會在很大程度上增強(qiáng)網(wǎng)頁交互設(shè)計的互動性，也會豐富網(wǎng)頁互動的形式與內(nèi)容，進(jìn)一步激發(fā)人們的瀏覽興趣?？梢哉f，這是網(wǎng)頁交互動畫設(shè)計的一個發(fā)展方向。除此之外，在形式上，有更多的互動種類，比如以聲音和視覺控制的互動形式的，等等，具體來說就是網(wǎng)頁設(shè)計在運(yùn)用平面視覺元素的過程中，將會采用多種形式讓瀏覽者和計算機(jī)交互，并且保證瀏覽方式的個性化，以此滿足不同群體的瀏覽需求，進(jìn)一步為人機(jī)交互帶來更大的便利。此外，在內(nèi)容上，網(wǎng)頁設(shè)計將朝著更豐富、更有個性的方向發(fā)展，通過運(yùn)用平面視覺元素，讓交互的內(nèi)容涉及網(wǎng)絡(luò)的方方面面，促進(jìn)人們和虛擬世界自然互動，給人們帶來輕松、個性的娛樂感受。

（二）動態(tài)因素

在網(wǎng)頁設(shè)計中，動畫、視頻屬于最活躍且最生動的因素，它能夠?qū)⒕W(wǎng)頁的信息直觀傳遞給人們，增加對人們的視覺沖擊，促進(jìn)人與人之間的溝通和互動。除此之外，動畫及視頻元素的運(yùn)用還能夠有效豐富網(wǎng)頁信息內(nèi)容，帶給人們視聽享受。如今，各種媒體媒介層出不窮，對動畫元素的應(yīng)用越來越成熟，從心理上來說，動畫元素適應(yīng)人們的感官體驗(yàn)，且極具親和力，屬于對受眾視覺和心理上的一種調(diào)劑，能進(jìn)一步增強(qiáng)他們的愉悅感，賦予瀏覽者更廣闊的想象空間。總而言之，隨著多媒體技術(shù)的不斷發(fā)展，人們對網(wǎng)頁交互元素、動態(tài)元素有了更深入的認(rèn)識，這要求網(wǎng)頁設(shè)計在未來發(fā)展中朝著多元化方向發(fā)展，即除了傳統(tǒng)三個平面視覺元素之外，加強(qiáng)對交互元素和動態(tài)的元素的成熟運(yùn)用，進(jìn)一步增加瀏覽者的感官體驗(yàn)，有效傳遞網(wǎng)頁信息。

參考文獻(xiàn)：

[1]董海斌.平面視覺元素在網(wǎng)頁設(shè)計中的應(yīng)用研究[D].西安：西安理工大學(xué)，2008.

[2]王聰.平面視覺元素在網(wǎng)頁設(shè)計中的應(yīng)用[J].戲劇之家，2015（16）：212.

[3]張立志.平面視覺元素在網(wǎng)頁設(shè)計中的應(yīng)用分析與探索[J].信息與電腦（理論版），2015（05）：：67，70.

[4]張蕾.淺談平面視覺元素在網(wǎng)頁設(shè)計中的應(yīng)用[J].電腦知識與技術(shù)，2018（21）：256-258.

[5]劉利華.網(wǎng)頁設(shè)計中視覺元素的運(yùn)用研究[D].長沙：湖南師范大學(xué)，2009.