培養(yǎng)與提高學(xué)生網(wǎng)站設(shè)計(jì)的藝術(shù)表現(xiàn)能力

[摘要]隨著當(dāng)前社會(huì)經(jīng)濟(jì)高速發(fā)展，計(jì)算機(jī)技術(shù)水平已非常成熟，人們已開始從對(duì)網(wǎng)站的瀏覽逐漸轉(zhuǎn)向?qū)W(wǎng)站的美觀程度和藝術(shù)化表現(xiàn)效果的追求。因此，如果能在培養(yǎng)學(xué)生計(jì)算機(jī)應(yīng)用開發(fā)技術(shù)的基礎(chǔ)上融入一些相關(guān)的藝術(shù)欣賞力和效果表現(xiàn)力等方面的知識(shí)，才能讓學(xué)生成為一個(gè)技術(shù)與界面美觀并重的網(wǎng)頁設(shè)計(jì)的綜合優(yōu)秀人才。

[關(guān)鍵詞]網(wǎng)頁：界面；藝術(shù)；美化

隨著互聯(lián)網(wǎng)的發(fā)展，周邊的附屬品也同時(shí)在飛速的發(fā)展。而最明顯的就是互聯(lián)網(wǎng)最常用的網(wǎng)絡(luò)媒介“網(wǎng)頁”。網(wǎng)頁設(shè)計(jì)也開始慢慢上升到一個(gè)舉足輕重的位置，一個(gè)好的網(wǎng)頁界面設(shè)計(jì)小則可以讓人賞心悅目，大則可以稱之為藝術(shù)的結(jié)晶。越來越多的設(shè)計(jì)師也開始投入到追求網(wǎng)頁界面形式美的行列中來，它可以讓設(shè)計(jì)師們的界面美觀度達(dá)到極致的升華，也可以讓界面變得暗淡和乏味。

在網(wǎng)頁出現(xiàn)的早期，和設(shè)計(jì)發(fā)展的早期階段一樣，網(wǎng)頁設(shè)計(jì)是以功能性為第一指導(dǎo)原則，以技術(shù)因素為主要考慮對(duì)象，以完成或?qū)崿F(xiàn)必要的功能為目標(biāo)。以字符組成的界面可以起到基本的信息傳達(dá)作用，同時(shí)技術(shù)要求相對(duì)較低，易于實(shí)現(xiàn)，并且有較好的穩(wěn)定性，故而這種形式的界面在很長(zhǎng)一段時(shí)間內(nèi)是人機(jī)交流的主要形式。而現(xiàn)在，網(wǎng)頁設(shè)計(jì)并非是純粹的技術(shù)型工作，而是融合了IT技術(shù)與美術(shù)設(shè)計(jì)兩個(gè)方面。因此，對(duì)從業(yè)人員來說，僅掌握IT技術(shù)是不夠的，還需要有一定的美術(shù)功底與審美能力。

作為一名網(wǎng)頁設(shè)計(jì)師，首先要具備審美能力，而網(wǎng)頁設(shè)計(jì)就相當(dāng)于平面設(shè)計(jì)，網(wǎng)頁設(shè)計(jì)師可以將平面設(shè)計(jì)中的審美觀點(diǎn)套用到這上面來，所以平面設(shè)計(jì)的審美觀點(diǎn)在網(wǎng)頁設(shè)計(jì)上非常實(shí)用。如對(duì)比、均衡、重復(fù)、比例、近似、漸變以及節(jié)奏美、韻律美，這些都能在網(wǎng)頁上顯示出來。當(dāng)然并不是頁面做得好看，具有美感的網(wǎng)頁就一定讓人感興趣，好的網(wǎng)頁也要建立在有好的內(nèi)容的基礎(chǔ)上，假如沒有內(nèi)容，也是不能吸引人的。

據(jù)調(diào)研，在國外現(xiàn)已有專門的網(wǎng)站藝術(shù)設(shè)計(jì)師，而中國目前行業(yè)中的界面設(shè)計(jì)師多數(shù)由計(jì)算機(jī)類或美工類相關(guān)專業(yè)人員通過工作環(huán)境后期學(xué)習(xí)，轉(zhuǎn)行而來的，缺少基礎(chǔ)、專業(yè)、系統(tǒng)的培訓(xùn)。若能結(jié)合國內(nèi)現(xiàn)狀加緊網(wǎng)站技術(shù)開發(fā)人員的藝術(shù)設(shè)計(jì)能力的提高，那么在工作能便能更高的與客戶進(jìn)行溝通，開發(fā)客戶滿意的界面方案。這樣可以使公司的開發(fā)過程更加順利，也減少了學(xué)生本身在公司的適應(yīng)期，公司對(duì)這類型人才培養(yǎng)會(huì)非常滿意，必然會(huì)成為IT行業(yè)軟件開發(fā)中的特色緊缺人才。

一、讓學(xué)生了解優(yōu)秀網(wǎng)頁界面設(shè)計(jì)的幾大要素

1、網(wǎng)站的整體風(fēng)格

網(wǎng)站不僅具有良好的閱讀功能，還需要頁面整潔、美觀，最好能有獨(dú)特的吸引視覺的效果。如果沒有獨(dú)特的個(gè)性化視覺設(shè)計(jì)，一個(gè)網(wǎng)站即使在其他方面都考慮周全，也只會(huì)平庸而乏味，缺少良好的欣賞功能。

風(fēng)格是獨(dú)特的，是網(wǎng)站互相區(qū)別的地方，風(fēng)格是有人性的，通過網(wǎng)站的外表、內(nèi)容、文字、交流可以概括出一個(gè)站點(diǎn)的個(gè)性、情緒。或是溫文儒雅，或是嚴(yán)肅莊重，或是執(zhí)著熱情，或是活潑易變，或是放任不羈。

2、色彩

界面設(shè)計(jì)的顏色運(yùn)用，不僅可以給用戶一個(gè)對(duì)網(wǎng)頁的大致感受，然而對(duì)顏色謹(jǐn)慎的細(xì)節(jié)把握可以讓用戶感到顏色帶來的舒適，從而根據(jù)顏色的巧妙配合給用戶帶來不同的視覺和心理體驗(yàn)。

在顏色的搭配細(xì)節(jié)中，色相起到一個(gè)重要的環(huán)節(jié)，色相搭配主要有以下部分細(xì)節(jié)用于網(wǎng)頁界面設(shè)計(jì)中：

第一，單色搭配。一種色相由暗、中、明三種色調(diào)組成，這就是單色。單色搭配上并沒有形成顏色的層次，但形成了明暗的層次。這種顏色搭配產(chǎn)生了一種令人悅目、低對(duì)比度的和諧美感。

第二，類比色搭配。相鄰的顏色稱為類比色，類比色都擁有共同的顏色。整個(gè)頁面如果使用了類比的紅色和黃色進(jìn)行搭配，給人大氣、有力量的印象。

第三，補(bǔ)色搭配。在色相環(huán)上直線相對(duì)的兩種顏色稱為補(bǔ)色，如：橙色和藍(lán)色。補(bǔ)色形成強(qiáng)烈的對(duì)比效果，傳達(dá)出活力、能量、興奮等意義。

第四，分離補(bǔ)色搭配。如果我們同時(shí)用補(bǔ)色及類比色的方法來確定的顏色關(guān)系，就稱為分離補(bǔ)色。這種顏色搭配既具有類比色的低對(duì)比度的美感，又具有補(bǔ)色的力量感。形成了一種既和諧又有重點(diǎn)的顏色關(guān)系。

第五，原色搭配。三原色的搭配，紅黃搭配是最受歡迎的一種搭配方法。但是紅藍(lán)搭配只有當(dāng)兩者的區(qū)域是分離時(shí)，才會(huì)顯得吸引人，如果是緊鄰在一起，則會(huì)產(chǎn)生沖突感。

第六，二次色搭配。二次色之間都擁有一種共同的顏色所以它們輕易能夠形成協(xié)調(diào)的搭配。如果三種二次色同時(shí)使用，則顯得很舒適、吸引，并具有豐富的色調(diào)。它們同時(shí)具有的顏色深度及廣度，這一點(diǎn)在其它顏色關(guān)系上很難找到。

第七，全色相搭配。從色相環(huán)上取出所有的色相，開放、熱鬧、像節(jié)日一樣的配色就產(chǎn)生了，全色相給人帶來可以隨時(shí)參與進(jìn)去的氣氛，這恰好是適合節(jié)日氣氛的色相。

3、布局

美工設(shè)計(jì)師除了對(duì)色彩要有好的感覺外，對(duì)布局也要有很好的把握，組合的好壞直接影響作品的效果。網(wǎng)頁設(shè)計(jì)中，設(shè)計(jì)者要注意到網(wǎng)頁排版的“最佳視域”這一細(xì)節(jié)會(huì)引導(dǎo)用戶去觀看整個(gè)頁面，并且能夠創(chuàng)造出一種別稱之為“Diagonal Balance(對(duì)角線平衡)”的和諧狀態(tài)。人們?cè)跒g覽頁面或布局的時(shí)候，視線往往趨向于從左上角移動(dòng)到右下角，因?yàn)槿藗兺ǔ６际菑淖笾劣摇纳贤碌亻喿x，久而久之視線自然會(huì)沿著這一路徑移動(dòng)。

其實(shí)做好布局設(shè)計(jì)也不是很難，無非就以下幾步：

第一，布局準(zhǔn)備。明確你表達(dá)內(nèi)容的主體部分需要哪些必要的文字和圖片。

第二，布局版式。關(guān)于布局的版式多種多樣，在將重點(diǎn)內(nèi)容放在最顯眼的前提下，可自由選擇版式。對(duì)于網(wǎng)頁來講，根據(jù)大多數(shù)人從上到下、從左到右的瀏覽順序來考慮，應(yīng)該將最主要的內(nèi)容、圖片等放在頁面的左邊和上邊。

第三，精細(xì)布局。整體配色、字體、各模塊的間距、插圖、增減內(nèi)容等各個(gè)方面的推敲。

另外，網(wǎng)頁設(shè)計(jì)時(shí)，也要各種元素(如圖形、文字、空白)都會(huì)有視覺作用。圖片和字體在頁面排版中起到相輔相成的效果，字體可以給圖片提供解說說明，而圖片也給字體提供裝飾、補(bǔ)白的效果。一個(gè)頁面圖片可以占據(jù)頁面很大一部分，相比其他頁面更具有視覺沖擊力。網(wǎng)頁界面設(shè)計(jì)不能只用文字，過長(zhǎng)的文字篇幅會(huì)使網(wǎng)頁顯得單調(diào)。在網(wǎng)頁中插入圖片可以令網(wǎng)頁生色不少。但圖片也不能用得太多，簡(jiǎn)單的圖片堆砌，會(huì)讓人覺得累贅，而且影響網(wǎng)頁的下載速度。所以網(wǎng)站中的圖片既要美觀、符合網(wǎng)站的內(nèi)容，又要少而精，放在最需要的地方，起到畫龍點(diǎn)睛的效果，增加網(wǎng)站的吸引力。頁面設(shè)計(jì)中圖片形象的遠(yuǎn)近處理會(huì)產(chǎn)生不同程度的視覺吸引力。根據(jù)頁面的需要我們可以改變圖片的位置、面積、數(shù)量和組合形式來達(dá)到頁面的整體美觀和保持頁面的視覺沖擊。同時(shí)，也決不能低估空白的價(jià)值。如果你的網(wǎng)頁上所顯示的信息非常密集，這樣不但不利于讀者閱讀，甚至?xí)鹱x者反感，破壞該軟件的形象。在網(wǎng)頁設(shè)計(jì)上，適當(dāng)增加一些空白，精煉你的網(wǎng)頁，使得頁面變的簡(jiǎn)潔。

4、細(xì)節(jié)

“細(xì)節(jié)決定成敗”，在設(shè)計(jì)領(lǐng)域了這句話更顯得重要。很多細(xì)節(jié)可能會(huì)被瀏覽者忽略，但對(duì)設(shè)計(jì)師來說絕不可放過，比如背景色、色彩漸變、各組件間間距、標(biāo)題樣式、高亮樣式、字體／大小／顏色、行／段間距、插圖位置／邊緣處理、輸入框?qū)捀撸吙蛏尘吧粹o的位置等等太多了。還是之前的話，只有你看得多了，比較得多了，才能看得出這些細(xì)節(jié)。有人覺得這些細(xì)節(jié)沒有什么大礙，但多個(gè)不良的細(xì)節(jié)組合在一起就會(huì)讓人覺得不舒服。

二、提高學(xué)生提高美術(shù)功底與審美能力

1、參觀畫展

打開欣賞藝術(shù)寶庫的大門，看到東、西方藝術(shù)的博大精深，特別是對(duì)中國古代美術(shù)作品的欣賞，不僅要了解我國古代藝術(shù)的高度成就和特點(diǎn)，而且還要進(jìn)一步激發(fā)民族自豪感和繼承我國傳統(tǒng)藝術(shù)的責(zé)任感。通過大量作品的欣賞，學(xué)會(huì)“古為今用，洋為中用”。

2、走進(jìn)大自然，激發(fā)審美情趣

自然是一個(gè)天然的大課堂，自然界所蘊(yùn)藏的美是無窮的，從植物、花卉、動(dòng)物、人類以及所有的自然形象中，我們都會(huì)發(fā)現(xiàn)許多新奇而又極其美麗的形和色的存在。它不僅讓我們開闊心靈，陶冶美的情操，還增長(zhǎng)科學(xué)知識(shí)，培養(yǎng)探索精神，走進(jìn)大自然，勤于觀察，善于觀察，做生活的有心人，感知、領(lǐng)會(huì)大自然中的一切，在心靈深處去感受美、發(fā)現(xiàn)美、創(chuàng)造美、觀察校園里的花卉，觀察房屋造型，觀察來往車輛、人群等。

3、欣賞優(yōu)秀作品

大量欣賞別人的作品，尤其是優(yōu)秀作品，培養(yǎng)藝術(shù)鑒賞能力，這對(duì)于提高設(shè)計(jì)水平是必須的。看的時(shí)候不要走馬觀花，需要結(jié)合專業(yè)知識(shí)邊看邊想，仔細(xì)研究作品中值得學(xué)習(xí)的地方。網(wǎng)絡(luò)上所有優(yōu)秀設(shè)計(jì)資源的網(wǎng)站，這樣可以省下很多時(shí)間和精力去提高學(xué)習(xí)效率。反復(fù)地欣賞優(yōu)秀的作品。溫故而知新，設(shè)計(jì)也是如此。收藏自己認(rèn)為比較好的作品，過段時(shí)間再看看這些作品，往往會(huì)比第一次有更大的收獲。

4、學(xué)習(xí)平面構(gòu)成基礎(chǔ)知識(shí)

平面構(gòu)成結(jié)合網(wǎng)頁講述平面要能讓學(xué)生知道不同的組合方式后形成的不同效果，差異化對(duì)比講述，并讓學(xué)生在網(wǎng)上找利用此理論的案例。色彩構(gòu)成結(jié)合網(wǎng)頁配色原理，命題以不同的環(huán)境，讓學(xué)生給出不同的配色。針對(duì)一些抽象概念，展開聯(lián)想，豐富學(xué)生想象能力和對(duì)物的感性認(rèn)識(shí)。主要是常用的幾種版式，各自的構(gòu)圖，網(wǎng)頁字體大小，排版方式。講述字體的發(fā)展、講述宋體，黑體的結(jié)構(gòu)、在宋體、黑體上進(jìn)行拆字組合，以及在宋體黑體上進(jìn)行二次變形設(shè)計(jì)等。

5、掌握相關(guān)的專業(yè)理論知識(shí)

多看專業(yè)理論知識(shí)以查漏補(bǔ)缺，同時(shí)更需要學(xué)習(xí)各種各樣的知識(shí)。擁有豐富的知識(shí)，你大腦里的“素材”就越多，它們都將可能參與到你的設(shè)計(jì)里，你的設(shè)計(jì)才會(huì)生動(dòng)飽滿，富有思想內(nèi)涵。所以知名的設(shè)計(jì)大師們往往都是全才，他們不僅精通設(shè)計(jì)。更精通其他很多領(lǐng)域。設(shè)計(jì)師需要懂得體會(huì)生活，了解世界。這需要實(shí)際調(diào)查和切身體會(huì)。否則你的設(shè)計(jì)就會(huì)容易脫離生活，失去感染力，因?yàn)樵O(shè)計(jì)源于生活并服務(wù)于生活。同時(shí)設(shè)計(jì)師需要了解世界，以增長(zhǎng)更多的見識(shí)，保持最新的思想觀念。一個(gè)思想落后、孤陋寡聞的設(shè)計(jì)師無論設(shè)計(jì)經(jīng)驗(yàn)有多豐富，他的作品總會(huì)顯得蹩腳和庸俗不堪。

只有懂得欣賞優(yōu)秀網(wǎng)頁設(shè)計(jì)作品的設(shè)計(jì)師才會(huì)提高的更快，因?yàn)閺闹锌梢越梃b到網(wǎng)頁設(shè)計(jì)的精髓。便于轉(zhuǎn)化成為自己的靈感，設(shè)計(jì)源于靈感，靈感源于借鑒。一名出色的網(wǎng)頁設(shè)計(jì)師同時(shí)也應(yīng)該是一名合格的人機(jī)界面設(shè)計(jì)師，因?yàn)闊o論從哪個(gè)意義上來說，網(wǎng)頁設(shè)計(jì)是一種最典型也最流行的人機(jī)交互平臺(tái)，它的載體就是網(wǎng)頁。所以說網(wǎng)頁設(shè)計(jì)也是人機(jī)交互界面設(shè)計(jì)。把握住網(wǎng)頁設(shè)計(jì)好壞的標(biāo)準(zhǔn)，在以后的網(wǎng)頁設(shè)計(jì)中更快更好的設(shè)計(jì)出獨(dú)特的視覺交互作品。

參考文獻(xiàn)：

[1]周陟，網(wǎng)頁設(shè)計(jì)解析，清華大學(xué)出版社，2009

[2]魯?shù)婪颉ぐ⒍骱Ｄ罚囆g(shù)與視知覺(新編)[M]，湖南美術(shù)出版社，2008

[3](韓)崔美善，設(shè)計(jì)師談網(wǎng)頁視覺效果，電子工業(yè)出版社。2006