探究網頁界面設計與平面設計之間的區別

王萬瓊

摘 要：隨著信息技術的不斷發展，網頁界面設計需要更多地互聯網人才，這就使得大部分的平面設計人員轉向學習網頁界面設計，但是網頁界面設計與平面設計之間也有所不同，本文重點分析其差異。

關鍵詞：網頁界面設計；平面設計；區別

0 前言

一般會對網頁界面設計與平面設計是不是同一個概念感到迷惑，但其實是有區別的，但是區別包括有哪些，沒有系統的總結，現為更加深入的研究其差異，幫助新手更好的理解有關網頁界面設計與平面設計的知識，現就要兩者的差異開展討論。

從設計層面分析，網頁界面設計與平面設計均屬于設計范圍，但同時他們也有所差異，從其發起時間分析，網頁設計具有一定的功能性質，并將功能性作為最主要的指導原則，以字符組成的界面達到傳達基本信息的作用，需要經過較長時間的人機交流。隨著信息技術的不斷發展，網頁界面設計是將藝術與技術進行融合的活動，包括有網頁視覺設計還有交互設計兩種。而平面設計的過程中，主要是設計者通過具體的視覺符號，將之轉變為具有概念性的代表?，F就從其視覺傳達設計方面開展討論，分析網頁界面設計與平面設計之的差異。

1 網頁界面設計與平面設計之間的區別分析

分析兩者間的差異，重點分析其視覺傳達設計方面的區別，其中包括有色彩模式、板式設計、字體應用還有圖形的使用、瀏覽方式及信息傳播?，F將幾點展開分析，討論網頁界面設計與平面設計之間的區別，如下所示。

1.1 色彩模式差異分析

色彩模式方面的差異，網頁界面設計與平面設計，兩者采用的色彩模式使完全沒不一樣的，平面設計重視后期的印刷工作，主要是為了能達到理想效果，少不了這一流程，一般是將CMYK色彩模式應用于平面設計中。但是網頁界面設計主要是將顯現方式作為依據，一般將RGB作為其色彩模式。平面設計針對色彩利用這一塊重點突出視覺的沖擊力還有對視覺流的指引，關于這一點和網頁設計上面的BANNER設計是有類似之處的。網頁設計，特別是產品類設計，重點要突出信息之間的鏈接，如果色彩過于注重，容易出現視覺疲勞，這就是在色彩模式應用的區別。

1.2 板式設計差異分析

首先，網頁界面板式設計中，針對其比例關系的要求一般是：頁面中所規定的空間長寬比、實體內容和空白的面積比例還有網頁被分割時的比例、圖文間的關系、各造型元素間的比例等。其次，且平面設計的節奏以及韻律主要是通國音樂啟發，富有節奏感，一般強調“節拍”，如果是韻律比較多側重點又在于“變化”方面，通常，如果說韻律感不足，一般指的是缺少變化；而描述其過于呆板，意在說明節奏感不足，變化沒有條理。

1.3 字體應用方面的差異分析

在整個設計過程中，平面設計采用的字體更為自由，并且不需要擔憂后期的處理工作，全部的文字與圖形的輸出是同時印刷的，但是網頁設計就需要從整體分析，一般其文字的使用范圍也會比較小，主要是因為要減少在輸出作品的時候對服務器的壓力，有html的特性，使用的字體是由設計者在操作時進行設置的，隨著技術日益發展，現要將此差異拉近，現可以使用html5中國API運用個性化的字體設計，這樣就不會將個性化的字體的輸出為圖形，在不會給后端帶來太大壓力的狀態下，一般是可以用戶具有可以享受到很好的視覺效果，得到較為滿意的成品。[1]

1.4 圖形的使用差異分析

分析兩者圖形的使用差異，網頁設計功能沒有平面設計的齊全，表現的形式也少一點，尤其是針對產品方面的設計，進行模塊化的設計思路起到關鍵作用，將之放在視覺表現方面也有同樣的意義。網頁界面設計有關圖形的表現主要是重點處理后期工作，平面設計中將會利用到的尺寸單位，比如常見的英寸、厘米還有毫米等，但是網頁一般采用的是像素作為單位。[2]

1.5 瀏覽方式差異分析

網頁界面設計與平面設計的瀏覽方式差異，其中平面設計開展的是漸進形式作作為瀏覽方式，沒有辦法做到瀏覽整個過程，無法實現多樣化串聯，而網頁設計則是向下滑動即可，有一個滾動條功能，下拉即可，其中按鈕之間的鏈接，可以實現多樣化串聯，實現瀏覽。將兩者放置在同一個信息框架狀態下，信息間的連接更為便利，增加用戶間對信息選擇的自由度，但平面設計也不缺乏其優點，舉例相冊，通過對比，一般這一類型的產品使用電腦翻閱，其實將之印刷成為一本實物進行翻閱，這樣給用戶的感覺更加好，實現相冊收藏的意義。網頁設計結果具有不可預測性，主要是受到交互性質的影響，一般網頁設計將技術和藝術相互結合運用，網頁版面與印刷品瀏覽的方式有所差異，不會采取單線性的閱讀內容。比如，還有許多隱藏的信息會被遺漏，指的是及時同一位網頁設計師沒針對不同的用戶也會產生不一樣的機結果，使用超鏈接實現用戶可以在網頁文本中自由的操作，實現圖片之間的跳轉等，同時，還可以對針對某一個網站做插入鏈接，用戶可以進行搜索、討論、留言等操作。[3]將網頁的交互性實現到最大化，有被動交互轉變為主動交互，這一過程中也是網頁設計的以部分，直接影響最終的設計結果。

1.6 信息傳播差異分析

平面設計偏向于傳統信息媒介設計，比如張貼、銷售還有郵寄等形式展開傳播操作，傳播的范圍比較小，但是成本有比較高，將之與網頁界面設計相對比，網頁界面設計具有很強的傳播能力，主要通過第三方媒介進行傳播操作，通常使用電腦屏幕、鼠標、鍵盤等即可完成傳播操作。將之和過去的紙質傳播方式，其主要的表現形式是經過紙張與圖文信息，現忽略其網頁中的互動環節以及 多媒體元素，其實網頁界面呈現在人用戶面前的就是經物化的界面，即是紙張、圖文還有電腦顯示屏三組組成的內容，以數字化形式表達。一般包括有圖文信息、色彩還有版面等，這些元素構成了平面設計中的視覺構成元素，而網頁設計同樣也是將平面設計中包含的基本視覺元素以此傳達信息以及開展審美活動。網頁設計操作中，要將發送者和接受者形成一個連接平臺，以便達到信息、資源共享的目的，如果沒有此操作，兩者這之間就需要設定的一個翻譯或者是解說系統，幫助他們實現溝通，這樣不利于提升工作效率，容易出現失誤。[4]平面設計具有良好的群眾基礎，不管哪個年齡層針對紙質的學習一般具有較好的接受能力，網絡媒介還有部分群眾不熟練運用，同時通過網絡獲取信息也會帶來一定的學習成本，但隨著網絡信息技術的不斷改進，與平面設計在群眾基礎方面的差異會越來越小。同時，平面設計和網頁設計形式有不同的用戶體驗，其中，網頁界面設計重視與用戶之間實現互動。網頁界面設計還可以將絢麗的動畫效果融入設計中，導入視頻，上述功能在平面設計中是無法實現的。

2 結語

網頁設計和平面設計之間的不同，主要是由于信息技術帶來的革新。網頁技術可以將藝術和技術實現完美的融合，平面設計在信息網絡技術發展的背景下也得到有效的發展，并朝著多元化方向發展，繼承傳統平面設計技術同時又可開展革操作。

參考文獻：

[1] 姚國熳，王海潮.網頁界面設計中平面視覺元素的應用探析[J].大觀，2016（9）.

[2] 張彤.網頁界面設計的整體性研究[D].北方工業大學，2011.

[3] 那日圖.中國傳統視覺元素在網頁界面設計中的研究[J].美苑，2011，7（06）：63-65.

[4] 林勐.交易型網頁界面的編排設計研究[D].山東輕工業學院，2012.