導語：網頁設計中視效藝術要素一文來源于網友上傳，不代表本站觀點，若需要原創文章可咨詢客服老師，歡迎參考。

一、網頁界面設計的特征

網頁界面設計是一將藝術與技術相結合的一門學科，早期人們會有一種誤解，認為網頁設計主要體現在“技術”的應用上，而忽視了“設計”的層面，導致許多網頁布局不合理、頁面平淡無奇、內容雜亂無章等。因此，在充分傳達內容和信息的基礎之上，網頁界面還必須具備一定的藝術特征，這種藝術是基于功能性之上，并且為其服務的。

（一）以功能性為主網頁界面設計和平面設計一樣，必須遵循一定的設計原則，在必須具備平面設計特征的同時，網頁設計還具有其特有的基本特性。網頁界面設計應時刻圍繞“信息傳達”這一主題來進行。因此，它是一種以功能性為主的設計。主要體現在以下兩個方面：1.信息傳達的功能網頁界面設計以信息傳達為主要功能，并且信息必須準確、清晰明了，具有明確的受眾對象和宣傳目標，注重時效性。2.一定的審美功能網頁界面的審美功能具有一定的綜合性。以內容為主，藝術為輔，除了界面布局合理，色彩搭配美觀，有清晰的導航功能，內容吸引人等，還必須考慮到用戶操作的簡易性和信息接受心理等因素。

（二）形象明確，易于接受格羅佩斯在他的《藝術家與技術家在何處相會》一文中提到：“如果物體的形象很適合于它的工作，它的本質就能被人看得清楚明確。”明確地指出了“形象”在信息傳遞和接納過程中所起到的重要作用。人們在接觸外界事物的時候，總是先通過視覺來接受信息，從而觸發一系列的心理活動。例如：看到天空飛翔的小鳥，會聯想到自由，看到長城、故宮，會聯想到中國傳統文化。因此，在設計網頁界面的時候，必須以通俗易懂的形象來傳遞信息，同時，也要考慮到網頁受眾的年齡、職業、文化層次、興趣的差異性，盡可能地使用簡單的宣傳形式來滿足所有層次的受眾。在可口可樂的網頁中，用戶可以從水珠、人物等形象中充分聯想到活力四射、清涼的感覺，形象通俗易懂，傳達的信息易于接受，具有良好的傳達效果。

二、網頁界面設計的視覺構成要素

網頁無論其類型、大小、功能，風格，其具備的基本要素都是一致的，與平面設計相比，除了圖像和文字之外，網頁界面包含更多的要素，如聲音、視頻、動畫等多媒體要素，以及由Javascript、VBscript等動態語言實現的網頁特效和交互功能。

（一）網頁界面中的文字設計文字是網頁界面的主體，也是傳達網頁信息的基本載體，雖然在今天多媒體元素的種類繁多，但文字依然占據它不可取代的地位，因為文字具有存儲空間小、易于下載和顯示的功能。網頁界面中的文字分為兩種：ASC文本和像素文本。網頁中大部分文字都是直接在HTML代碼中編寫，或者在dreamweaver設計窗口中自行輸入，這部分文字主要以ASC碼存儲，占取空間小，易于修改和編輯，在排列文字樣式的時候，一定要結合CSS樣式表來排版，CSS樣式表的強大功能可以同時對文字的字體、字形、大小、顏色、間距、邊距和特殊效果等進行精心的設置，以達到較好的瀏覽效果。但是如果在網頁中使用特殊字體，不同的用戶可能由于未安裝此字體而無法正常顯示，所以，有的時候我們可以把文字在photoshop或者fireworks等圖像圖像處理軟件中保存為jpg或gif格式的圖片切片，再應用到網頁界面中，這樣就可以達到任意想要的藝術效果了。像素文本主要應用于網頁界面中的標題、LOGO、Banner或者廣告的部分。

（二）網頁界面中的圖形圖像設計圖形在網頁界面中占據著十分重要的地位。在上網瀏覽時，圖形圖像往往比文字更容易吸引用戶的眼球，因為它可以最直觀、最形象地表達網頁的主題，其給人的視覺印象往往比文字要強烈得多。圖形必須要符合網頁的主題，每張圖片都必須要有其存在的價值，善用圖形，可以生動形象直觀地表達網頁的主題，增強網頁的宣傳力、號召力和感染力，吸引瀏覽者的注意和興趣。網頁中的圖形格式主要有：JPG、GIF和PNG三種。JPG具有壓縮比高、壓縮質量好、色彩連續性強的特點，因此，使用最為廣泛。GIF雖然色彩數目不如JPG，但是可以制作透明背景，以及動態圖像，也被大量應用于網頁界面中。PNG是Fireworks的默認圖像文件格式，集前者的優點于一身，可以對圖像進行全面的優化并且導出任何想要的格式。所以，根據圖形圖像的使用功能，合理地采用這三種格式，是網頁設計人員必須掌握的技能。

（三）網頁界面中的色彩設計1.色彩設計的基本作用色彩對于事物的表現能力有著其它形式無法比擬的超強效果。作為一個網頁設計師，只有掌握色彩的原理，熟知各色彩間的相互關系及各種色彩的生理或心理作用，結合自己所具備的平面構成知識，在網頁設計中準確用色，才能實現傳達特定信息和渲染頁面的效果的目的。色彩在網頁設計中起著重要的作用。首先，彩色網頁較單色網頁更具吸引力；其次，色彩本身具有象征作用，瀏覽者易于產生聯想；第三，彩色網頁具有賞心悅目、裝飾性強等特點。2.網頁界面中色彩搭配的技巧用一種色彩。這里是指先選定一種色彩，然后調亮度、透明度或者飽和度，生成新的色彩，用于網頁。這樣的頁面看起來色彩統一，有層次感。用兩種色彩。先選定一種色彩，然后選擇它的對比色。比如當我們需要突出橙色的主體內容時，使用藍色作為背景是最好的。這樣整個頁面色彩豐富但不花稍。用一個色系。簡單的說就是用一個感覺的色彩，例如淡藍，淡黃，淡綠；或者土黃，土灰，土藍。用黑色和一種彩色。比如大紅的字體配黑色的邊框感覺很“跳”。在網頁配色中，忌諱的是：不要將所有顏色都用到，盡量控制在三種色彩以內。背景和前文的對比盡量要大，（絕對不要用花紋繁復的圖案作背景），以便突出主要文字內容。

（四）網頁界面中的版式設計在進行版式設計時，仍然需要應用到前面提到過的Photoshop或者Fireworks等圖形處理工具，直觀地看到網頁的版面效果，在Photoshop或者Fireworks中畫好網頁布局后，先切片，再導出切片，然后在dreamweaver中使用DIV+CSS集成網頁，這是目前主流的網頁布局方式。根據視覺流程和網頁版式的實例，可以總結出以下版式構成的類型：水平分割、垂直分割、水平—垂直交叉分割、中軸型、傾斜型、曲線型、重心型、反復型、點散型等。通過這些劃分方式，我們可以把一個平淡的界面劃分成若干個視覺區域，增強界面的層次感和空間感。

（五）網頁界面中的多媒體設計1.音頻音頻在網頁界面中主要用于背景音樂、按鈕提示音等。另外，某些以音樂為主的網站還提供在線音樂下載和播放的功能。音樂成為網頁與瀏覽者進行交互的一種重要手段。網頁中的音頻格式主要有：MIDI、WAV、MP3、ra、ram、rpm等，各具特點，應區別對待。2.動畫網頁中的動畫主要分為：FLASH動畫、GIF動畫、交互動畫等。FLASH動畫具有體積小、整體性強的特點，主要用于banner、導航等。GIF動畫可以做成一些小圖標，而交互動畫主要是通過Javascript、VBscript等動態腳本語言結合HTML語言來實現網頁的一些特殊效果，如：鼠標跟隨、幻燈片切換、動態導航等。3.視頻視頻由于其體積大的特點，在網頁中用得相對較少，但它具備其它網頁元素都沒有的特點—信息豐富，傳達便捷，對瀏覽者的文化水平、年齡層次要求也不高，具有較強的吸引力。常用的文件格式有：AVI、RM等。

三、總結

以功能性為第一指導原則，以技術因素為主要考慮對象，以完成或實現必要的功能為目標，在進行網頁界面設計時，遵循這樣一個設計原則，那么，要設計出成功的界面并非難事。對網頁界面設計的基本藝術要素進行系統的研究，是促進網絡發展的重要環節，對提高網頁設計者的制作水平，培養對網頁界面設計的審美能力而言，都具有相當現實的意義。