圖形藝術在網頁設計中的應用

【摘要】網頁設計藝術是綜合計算機圖形藝術和網絡技術的一門邊緣學科。本文探討了將圖形藝術和網頁設計相結合，設計出個性化的網頁設計圖形藝術的界面，以取得更好的信息效果。

【關鍵詞】網頁設計圖形藝術界面設計

在現代社會，網絡虛擬世界已經無處不在。對于傳統的計算機圖形藝術設計師們來說，不得不面臨一個新的、前景無限的設計領域——計算機網頁設計圖形藝術。這就給網頁制作公司和個人帶來了許多商機，也給每一個想成為計算機網頁設計圖形藝術家的人展現了一個廣闊的舞臺，使其成為具有最大訴求效果的構成技術。網頁設計圖形藝術不但擁有傳統媒體的優點。同時又使傳播變得更為直接、省力和有效，它是伴隨著計算機互聯網絡的產生而形成的視聽設計的新課題，是網頁設計者以所處時代所能獲取的技術和藝術經驗為基礎，依照設計目的和要求自覺地對網頁的構成元素進行藝術規劃的創造性思維活動，必然要成為計算機圖形藝術的重要組成部分，并隨著網絡技術的發展而發展。然而，在網頁設計圖形藝術這個領域里，沒有網頁設計技術的產生和迅猛發展，根本無從談起“網頁設計圖形藝術”，技術為設計建造了表現的基石，設計根據其需要又不斷地向技術提出新的要求，從而促進了技術的進步。而真正有魅力的富于表現性的網頁設計是計算機網頁設計圖形藝術家們的思想、素養、對設計的理解及其表現技術的綜合性的體現。因此，作為計算機圖形藝術設計師必須接受這種設計與技術的綜合表現形式，要以掌握網頁設計圖形藝術與多媒體技術、計算機程序設計為前提，更有效地發揮網頁設計圖形藝術的表現性和可操作性，完成新概念的構想而努力。

從圖形藝術到網頁設計藝術的變革

面對新時代的到來，人們無不感到社會經濟和文化所經歷著的快速而深刻的變化。使得我們原有的價值觀念、思維方式、知識結構和思想空間都面臨著各種各樣的挑戰。目前，網絡已經越來越多地進入了計算機圖形藝術領域，我們沒有任何理由忽視網頁藝術設計的存在。網絡對計算機圖形藝術行業造成的威脅與機遇并存，而且這種趨勢越來越顯著。對傳統的計算機圖形藝術設計師們而言，網絡意味著機遇。對傳統的印刷業而言，網絡則具有信息資源無限、圖文互動、高速高效的特點。是印刷媒體面臨的最大威脅。越來越多的項目要借助于新的媒介來完成，只是利用印刷完成最后一道工序。人們看到，新的商務模式迫在眉睫，與客戶實行電子交易將成為“日常”交流服務，傳統的圖形藝術逐步走向網頁設計藝術……。

網絡產生的這些變化不僅逐步加劇。而且孕育了自身對技術的狂熱。這些不僅影響著網頁設計藝術的創造過程，還波及到創造出的作品，以及交流的進行過程，當然，還會決定什么樣的工作將繼續留給傳統的計算機圖形藝術設計師們來完成。由于傳統意義上的計算機圖形處理技藝并沒有消失，人們會將更多的注意力集中到如何整合各種不同的媒體，設計師們也要具有設計交叉應用的綜合能力，才能適應不斷變化的時代。創造工作將會在互聯網的基礎上草建。網絡創造人員不僅包括網頁設計師和程序開發員、還有制作者以及那些在網絡各個環節上的專家。網絡將會為許多設計者提供全方位的服務，包括一些源于計算機圖形藝術的傳統工作由于計算機本身及其網絡相關技術的特點和條件，使其對于網頁設計是限制的。

網頁設計圖形藝術與傳統的計算機圖形藝術設計在視覺傳達方面有極大的相似性，但是在技術實現方面又有著很大的區別。網頁設計藝術是傳統的計算機圖形藝術的視覺傳達效果運用和網絡技術實現的有機結合，我們可以說網頁設計藝術是綜合計算機圖形藝術和網絡技術的一門邊緣學科。

1．藝術效果的傳達

如同傳統的計算機圖形藝術作品一樣，網頁設計藝術也要求具有一定的藝術感染力。一個雜亂無章、表現平庸、毫無美感可言的網頁是不會得到訪問者的青睞的。訪問者也無心思再去點擊頁面的其它鏈接。一旦給了訪問者不好的第一印象，該訪問者能否再次光顧也就很難說了。

傳統的計算機圖形藝術作品講究頁面元素的構成、版式布局、色彩搭配、空間表現等，這些要素對于網頁的藝術設計來說也是適用的。在視覺傳達效果上兩者有著相似之處，頁面各種元素安排的最終結構都要符合受眾的審美心理。如圖2所示，這是一家網站的主頁，盡管其載體不同于傳統的印刷介質，但其藝術效果同樣給人們以強烈的視覺沖擊和藝術美感。

2．介質的差異

傳統的計算機圖形藝術作品大多數是以印刷品的形式出現，而網頁則是通過電腦顯示器出現的。而且在傳輸過程中受到信道帶寬的限制。在這方面兩者存在很大的差異，計算機圖形藝術設計師們都知道，普通印刷是按色素的減法原理進行的，設計作品為CMYK模式：而電腦顯示器的色彩工作原理是以色光加色法原理進行的。即RGB模式。同樣的用色，但在表達效果是有很大區別的。

因受信道帶寬限制，網頁設計藝術中的圖像處理也不同于傳統的計算機圖形藝術。為了加快下載速度，在圖像保持質量的前提下我們盡量縮小字節數量。由于現在從事網頁設計藝術者多數是從計算機圖形藝術的工作中轉變而來的，所以在網頁設計藝術過程中為了追求頁面藝術效果，而將圖像字節數量設置過高，致使網頁下載速度緩慢。從網頁設計藝術的實用角度來講，這是一個失敗的設計。圖像的處理技術是從事網頁設計藝術者所必須掌據的。

在分辨率上，傳統的計算機圖形藝術是以印刷品作為介質的。其精度越高越好，一般情況下，傳統的計算機圖形藝術作品在電腦中設置為360dpi(點／英寸)：而網頁設計藝術中所使用的圖像分辨率則為72dpi。了解其介質差異后，我們在追求藝術效果表達的同時應慎重用色，不能機械地把傳統的計算機圖形藝術中的經驗套用到網頁設計藝術中來。

3．功能的異同

傳統的計算機圖形藝術作品是以向人們傳達某種信息或訴求為目的的，而網頁設計藝術除了擁有計算機圖形藝術作品的功能外，還有重要的導向和鏈接功能，即網頁應該具有很強的可操作性。如頁面中的超鏈，點擊它們則可以進入到其它的頁面或站點。這些超鏈可以是文字，也可以是動態圖片按鈕，它們的位置安排不僅影響到整個頁面的布局，還影響到人們瀏覽是否方便。互聯網的交互功能是最具魅力的，如何在網頁設計藝術的效果表達中將這一獨特功能充分展示出來，且和網頁整體有機結合，也是網頁設計藝術師們的一項重要任務。

合理布局的網頁圖形藝術界面設計

一般來說，電腦顯示器的尺寸有限，通常只有17英寸。布局合理，流暢使視線融會貫通，是網頁設計圖形藝術必不可少的關鍵所在。在瀏覽網頁時，人們的視線通常垂直地落在計算機屏幕的中心，然后再向四周游動。網頁設計藝術師應考慮將重要信息或視覺流程的停留點安排在注目價值高的最佳視域，使得整個網頁的設計主題一目了然。在界面之中，不同的視域，所引起的瀏覽者的注目程度不同，所給予的心理感受也不盡相同。網頁設計藝術師可根據具體元素的傳達需要，依照畫面的重心關系，合理安排各自適當的位置。網頁設計藝術中有效提高視覺傳達的效率需要把握以下幾點：

(1)符合人的視覺習慣

(2)避免產生疲勞感

(3)強化頁面的主從關系

(4)安排合理的視覺流程

(5)注重清晰的導航

另外，網頁設計圖形藝術還具有動態的方面。亦即網頁本身具有不停閃爍的文字、不斷變化的色彩和Flash動畫：此外，網頁之間的鏈接，使得人們具有訪問更深層次頁面的興趣。在進行網頁設計圖形藝術作品的創作中，為了能夠吸引訪問者進一步地觀賞網站，使網站的信息、說明和文件更加清晰、明了地處于視覺可及范圍之內，而不是深藏于某處無法發現，就需要建立導航系統來引導訪問者的視覺流程。網站的導航系統在于如何運用簡短、易于理解的方式來呈現網站的諸多視覺方向。好的網站設計應該讓其導航系統的功能使用起來自然而然、明確清楚、簡便而又新穎別致。通過網站導航系統，可以讓瀏覽者在網絡空間中從站點的某一個地方隨意跳轉到不同層次的其他地方。

個性化的網頁設計----圖形藝術的界面處理

創意新穎、設計精美和布局合理，是計算機網頁設計圖形藝術吸引瀏覽者、增加回頭率的關鍵所在。精彩的網頁能促使瀏覽者增加點擊網頁的沖動和興趣，讓人在瀏覽網頁的整個過程中一直興趣盎然。因此．網頁設計圖形藝術師和開發小組就需要利用一切最先進的技術手段來描畫和裝飾用戶所能看到的頁面，使其變得亮麗迷人、更有吸引力、更具有視覺沖擊感，確保每一網頁均能保持較強的個性化和統一性。要利用諸多視覺造型元素，如色彩、圖形、按鈕、聲音、動畫等。當然，在利用一切設計手段、最先進的軟件和技術手段的同時，也必然要加道什么時候是不需要用它們的，做到運用自如，因為高效率地把有用信息傳輸給受眾才是最主要、最關鍵的。所以，應充分利用軟件工具，配合各種音樂和聲音，使設計制作的網站能為瀏覽者提供一定的交互功能，而不僅僅是死板的信息張貼。要使訪問者看到的是一個豐富多彩、智能互動、舒適流暢、度身定做的精彩網站，從而全面提升企業的整體形象。

技術的分離與藝術的成熟

這似乎是每一門藝術形式的必由之路，因為藝術的產生必然會經歷一個由實用到審美，以勞動為前提的發展過程。如建筑藝術最初是為了滿足人們最基本的生存需求，在幾千年的歷史中審美性和藝術性不斷發展，到今天這個幾乎沒有什么方案不可能實現的時代，對美的追求則成了建筑設計藝術中最重要的方向。

數字化藝術設計也是如此。以網頁中的圖形設計為例，在最初用HTML和Java語言的年代里。網絡圖形的設計幾乎全部是技術人員的工作。然而在滿足了傳遞信息的最基本需求之后，對藝術的要求顯得越來越重要。對美的追求越來越深入。到了今天。Microson Froltpaqe、MacromediaDreamweaver等軟件的出現令數字化藝術設計中的技術與藝術的分離成為可能。而在未來的藝術創作中，技術問題將退至后臺由專門的技術人員完成。展現在觀賞者面前的是藝術家和設計師對每當感受、表現和創造。另一方面，網絡圖形的藝術性也將不斷提升，普及，這則是藝術形式成熟的必然結果，而區別于傳統藝術形式的多媒體性、互動性、延續性和系統性則是這一成長過程中的有力武器。

注：本文中所涉及到的圖表、注解、公式等內容請以PDF格式閱讀原文。