國內傳統文化藝術網站視覺設計研究

陳美臻 趙婉兵 艾子玲

摘 ?要：為了順應時代發展趨勢，不少地方的相關文化部門和民間傳統文化藝術組織都在互聯網上搭建了自己的線上交流平臺，以推進自身發展、提升國內外關注度、獲得更多合作機會，更好地進行文化傳播和推廣。但是目前國內傳統文化藝術網站的外觀設計質量參差不齊，有些網站無法給用戶帶來良好的文化體驗，甚至觀感粗糙簡陋，這都對傳統文化的發展帶來了一定程度的消極影響。在5G萬物互聯背景下搭建傳統文化藝術交流平臺，我們在設計中應以明確主題、營造氛圍、版式精美、操作便捷為主要設計方向。利用信息可視化和舒適美觀的版式設計讓用戶更直觀地感受傳統文化藝術的魅力，融合傳統文化藝術與科技，將其深厚的文化積淀發揚光大，對傳統文化藝術發展起到積極的推動作用。

關鍵詞：傳統文化;民間藝術;視覺設計;網頁設計

基金項目：本文系湖南省研究生科研創新項目“文化扶貧視角下瀕危非遺竹籃泥塑藝術創新設計推廣研究”（CX20201036）研究成果。

一、引言

我國悠久的歷史與豐富的人文環境催生了很多優秀的傳統文化和傳統藝術，早期受地域環境和傳播水平的限制，發展略緩慢。隨著電子信息技術的提升，網頁以其不受地域限制、面向全社會公開的特性，使其成為最廣泛的文化傳播方式。且隨著時代的發展，5G技術將帶來網頁的功能革新和體驗革新，利用網頁在智能終端的應用，將達到速度更快、信息種類更多、傳播更廣的效果。因此，不少民間傳統文化藝術組織在互聯網上自發地搭建了相關的線上交流平臺，以推進自身發展，獲得國內外更多的關注及合作機會，更好地進行文化傳播和推廣。

從國內目前已上線的多個傳統文化藝術網站的設計來看，部分網站界面缺乏藝術美感，這在一定程度上拉低了用戶對國內傳統文化藝術的認可與喜愛度，網頁文化氛圍和文化情感傳遞的缺失也是國內傳統文化網站瀏覽量普遍較低的原因之一。筆者認為，在傳統文化藝術網站設計中，若想通過網頁的形式傳達出傳統文化藝術的外在表現和內在意蘊，應按照網站目標用戶需求進行設計分析，確立網站主題后再選擇合適的文化藝術符號鑲嵌其中。并將網站功能與內容、色彩、版式進行有機整合，以彰顯優秀傳統文化藝術的文化與美學理念，結合時代潮流，增添相應的互動及視聽設計提升用戶體驗。作為傳統文化藝術的線上互聯窗口向大眾展示著互聯新時代、新平臺上的中華傳統文化藝術新發展。

二、國內傳統文化藝術網站視覺設計分析

（一）選取樣本

我國目前在互聯網上線的傳統文化藝術網站眾多，根據網站主要內容大致可以分為三類：國學書畫類、非物質文化遺產類、民俗民藝類。在這三類傳統文化藝術網站中，我們各分別選取了8個比較典型的網站進行采樣分析，選取的網站樣本如圖1所示。

（二）優秀設計案例分析

在對三類傳統文化藝術網站進行采樣分析后發現，部分網站視覺設計非常出色，在新穎的數字技術下將傳統文化藝術的意蘊表達得淋漓盡致，在簡約美觀的同時展現出特有的國潮感。而這類網站一般都是大型傳統文化藝術組織的門戶網站。如中國非物質文化遺產數字博物館是由中華人民共和國文化和旅游部主管，中國藝術研究院·中國非物質文化遺產保護中心主辦，是國家向世界展示中國非物質文化遺產的“窗口”，因而無論是在設計還是功能上都代表著目前國內非物質文化遺產網站最高的制作水平。在民間藝術組織自發建立的傳統文化藝術網站中，中國傳統文化網以其主頁設計排版的美觀，從而在采樣分析中脫穎而出。

1.中國非物質文化遺產數字博物館（http：//www.ihchina.cn/）

以中國非物質文化遺產數字博物館為例，一個完整的非物質文化遺產網站界面設計必須滿足“功能”“形象”“用戶體驗”三個基本要素，只有將實用、美觀、友好和諧統一起來，才能做好非物質文化遺產網站的設計。在網站設計的同時也要盡量兼顧非物質文化遺產網站的特殊性[1]。中國非物質文化遺產數字博物館網站的設計簡潔大方又耐人尋味，在色彩上使用了純度和明度不高，但是具有民族特色的搭配。因為“非物質文化遺產”多來自不同民族的特色文化，響應了網站主題，又對其中深色系和淺色系做了區分，用深色部分為基底襯托出淺色部分，醒目且協調。

網頁上放置了大量與非物質文化遺產相關的圖片和部分經過后期處理的相關活動照片。因活動照片主體為人物且多為現場抓拍，在沒有特定著裝的情況下很容易與精心設計的網頁整體產生違和感。針對此問題，設計者很聰明地在照片周圍添加了帶有傳統文化藝術符號特征的紋樣與背景，以表達活動內容與非物質文化遺產主題的關聯性，增強頁面整體融合感。

網頁版式上有虛有實，其中的留白藝術使圖片和文字之間有了交流和呼應，營造出較強的空間感，賦予用戶無限的創意和想象力，增強網頁版面的韻律和呼吸感、可辨認性與可讀性，能快速有效地幫助用戶瀏覽，最終保持各元素之間的相對平衡[2]。依據內容的不同劃分了不同的板塊，字體的大小與密集度適合讀者閱讀，可使其瀏覽過程輕松且簡單明了，并配合內容的文本增添了適量的圖片作為點綴，降低了單一文字排版帶來的視覺壓迫感，增強了頁面的豐富性，給用戶非常舒適的觀感。

網站內容上全部都是與“中國非物質文化遺產”相關的內容，針對性強且內容全面，基本涵蓋了全部種類的國內非遺文化相關知識。目標用戶覆蓋范圍廣泛，設置了非遺保護機構查詢、非遺保護政策查詢、非遺保護資訊、在列非遺清單、非遺文化資源、學術研究、非遺百科欄七大欄目，極大程度地滿足了不同用戶了解及研究我國非遺文化的不同需求，起到了很好的資源整合作用。

2.傳統文化網（http：//www.zhwh365.com）

以傳統文化網為例（中國傳統文化促進會主辦），主頁設計視覺排版十分美觀，進入網站后一眼便可看到精心制作的banner輪播圖。設計者在banner設計顏色上以干凈的淺灰色為底色，與網頁整體的白色總背景進行區分。帶有光影漸變的朱紅色人物背景與墨黑色書法的搭配襯托出海報上的戲曲人物，傳遞出濃郁的中國傳統文化氣息。躍出紅色背景邊框的人物輪廓和書法字樣增添了活潑靈動的感覺，大氣而時尚的文化自信感撲面而來。

網頁版式上依舊是有虛有實，圖片與文字的結合減少了用戶面對大量文字尋找信息的枯燥感，疏密合宜的排版讓頁面看起來整齊有序，不會因為信息過于密集而使頁面顯得雜亂無章。

網站內容全部是與“傳統文化”主題相關的信息，并將其按照朝代、民族、地域、文化、雜家分類整理，給用戶提供了多重可選擇信息篩查方式，幫助用戶迅速滿足信息查詢需求。

（三）發現問題

在對三類傳統文化藝術網站進行采樣分析后筆者發現，諸多網站因疏于設計管理，且部分網站所有者為民間組織，人力物力投入不足，導致其無法緊跟現代網頁設計的腳步，視覺效果體驗差，功能性與美觀性不統一，無法滿足用戶當下對傳統文化藝術網站設計視覺效果的要求，尤其是在用戶瀏覽了大量時尚美觀的網頁后再瀏覽這類網站會感覺其審美性較差。在將不同傳統文化藝術網站在設計中表現出的問題歸類統計后，得出以下6個共同的問題：

1.顏色搭配不突出、不協調

顏色是網站內容屬性最直觀的體現。瀏覽者僅需90秒就可以對一個網站做出判斷，而其中 60%～90%取決于色彩[3]。網頁界面視覺設計評價標準不在于色彩數量的多少，而在于色彩能否正確完整地傳達出網頁主體的內涵，是否具有針對性[4]。我們不難發現，網頁設計中色彩的搭配可以直觀地向接受者傳達出一種潛在的意識影響，如科技類網站往往會使用藍色來凸顯科技的理性感;奢侈品牌類網站往往會使用白色、黑色、金色來襯托品牌的檔次感。在傳統文化藝術網站采樣分析中，很多網頁缺乏美感是因為它們雖然大多都選擇使用了類似磚紅、鵝黃等與中國傳統文化藝術相關的色彩。但在顏色搭配上，它們或使用一種顏色做底色貫穿整個網頁，十分單調;或使用不協調的2-3個顏色，無法向用戶展示中華傳統文化藝術的美感。

2.符號性圖形設計過少

網站內應添加符號性的圖形設計，用有傾向性的圖形語言向用戶表達網站屬性。根據界面中應有的信息內容有針對性地進行文化符號形態的選取、提煉和應用，才能讓交互界面產品在保證可用性的前提下有效傳達出其文化內涵[5]。如動漫網站會設計很多漫畫形象安置在頁面和鏈接按鈕中;學習類網站會設計一些書本、課桌、老師形象等圖標圖形。在對傳統文化藝術網站采樣分析中，很多網站缺乏符號性的圖形設計，不論是網頁板塊與板塊之間的銜接穿插，或者是在一些導航性的交互鏈接點的指引符號，都使用了與傳統文化藝術毫無關聯的圖形設計。而沒有在圖標圖形上加以潤色，僅以文字和圖片做修飾的網站只會給用戶留下僵硬死板的印象。

3.網頁排版問題較多

網頁的排版屬于版式設計范疇，將版式設計與網頁設計有機結合在一起，恰當地運用版式設計法則將各元素組織起來，可以使網頁中的各種視覺元素進行科學合理的排列與組合，兼具思維邏輯性與藝術性[6]。其設計的目的在于使數據信息接受者的各種感官都可以體驗到豐富的藝術美感，使其在精神上得到相應的滿足[7]。精美良好的版式設計不但可以提升用戶的閱讀體驗，也是一種更快更好的傳播信息的手段，優秀的網頁版式設計在其內容的分布上和大部分用戶的操作習慣一定是完美結合的，對用戶快速精準找尋所需求的信息有引導作用。版式也是能代表網站內容屬性的外在體現之一，如與政務類網站相比，藝術類網站的排版設計會用大圖、大留白、不對稱等表達活潑個性的網站形象;而政務類網站排版設計就會稍顯緊密規整，以表達其嚴肅的網站形象和嚴謹的工作態度。在對傳統文化藝術網站采樣分析中，發現很多網站頁面排版中文字密度過高、圖片過少、內容過于集中，版面缺乏空間層次和韻律，沒有呼吸感，進而拉低了用戶使用體驗，影響用戶對網站主題和其主辦單位的印象。

4.主頁配圖簡略

主頁是網站的展示頁面，其余頁面都是依賴于主頁輔助其進行內容拓展的功能頁面，主頁的設計決定了用戶對網站的主觀定位，包括對網站的專業性和學術性的主觀認知。傳統文化藝術類網站要想向用戶清晰地表達自己的定位，主頁的配圖十分重要，因為文字遠沒有圖片直觀。在對傳統文化藝術網站采樣分析中，看到部分網站在主頁的配圖十分簡略，多是未經處理的活動照片，雖體現了相關工作人員的辛勤工作，但因活動照片多為人物合影，在后期往往未添加相關傳統文化藝術元素，不能清晰表達“傳統文化藝術”的概念，因而不足以向用戶展示網站在傳統文化藝術領域的專業性和學術性。

5.主頁內容過多，頁面過長

因為網站主頁的內容是對網站的整體介紹，因此我們在制作網頁的時候不僅要考慮怎么將網站最好的一面表達給自己的用戶，還要考慮表達的方式和側重點，不能一鍋端，都放在主頁上，造成雜亂的形象[8]。網站主頁應適度地放置網站主要內容，不宜過長，主頁內容過多會顯得繁瑣，讓用戶無法快捷準確地捕捉到可用信息，浪費了用戶瀏覽頁面的耐心。過長的主頁還會影響二級頁面的設計，二級頁面因為內容的拆分，可表現的部分就會大打折扣，過長過細致的主頁會襯托出二級頁面的簡陋，打破網站整體設計的平衡。在對傳統文化藝術網站采樣分析中，可見部分網站事無巨細地將網站一半的內容都在主頁上展示了出來，不但使展示的內容碎片化，而且因為內容過多導致銜接部分的突兀感強烈。

6.無關內容過多，信息篩選困難

網站的內容與功能應以其主要服務對象的需求為主，訪問我國傳統文化藝術網站的用戶需求應以對傳統文化藝術的求知、交流、合作為主。而在對傳統文化藝術網站采樣分析中，發現部分網站內廣告過多，商業性太強，并在其中加入了諸多與傳統文化藝術主題無關的元素，如便民類生活服務等，這背離了傳統文化藝術的主題，也對用戶的需求信息篩選造成了一定的困難。

三、傳統文化藝術網站設計策略解析

（一）明確主題

一個網站的存在，必然有它所要展示的內容，這些內容并不是東拼西湊、毫無關聯的，而是有著共同核心，這個共同核心就是該網站的主題。網站的視覺設計應圍繞網站的主題展開，確立它所導向的目標用戶。一個網站的視覺設計是為網站主題服務的，其設計的意義是為了更好地展示主題。經過對中國非物質文化遺產數字博物館和傳統文化網兩個設計優秀的傳統文化藝術網站的分析，我們不難發現，其在內容上和視覺上都緊密切合網站主題，便捷有效地向大眾展示著傳統文化藝術的現狀。“突出主題”是網頁藝術設計的根本原則和核心宗旨，設計師無論如何創新頁面色彩、布局、文字等，都必須突出主題，以保障網頁傳播信息的目的[9]。

（二）營造氛圍

傳統文化藝術網站的主題就是傳統文化藝術，我們應利用設計手段營造出傳統文化藝術氛圍，滿足用戶的視覺感受，明確感受到這是一個與傳統文化藝術有關的網站。由于人們在觀看網頁時，常會被其中的民俗文化元素所傳遞的情感吸引，獲得本土文化心靈上的認可[10]。在營造氛圍時，色彩和元素的運用十分關鍵，顏色有固定的象征意義，元素則是網站身份的象征。傳統文化藝術有其悠久的歷史積淀，色彩在明媚中又透露出沉穩和大氣，這類色彩都有其獨特且美輪美奐的名稱，如：胭脂、月白、竹青、黛、秋香、鴉青、檀、綰、黎、酡顏等。合理利用這類色彩進行協調搭配，使顏色有層次感、豐盈感，產生視覺上的沖擊力，進而給用戶帶來民族藝術和傳統文化相糅合的色彩暗示。在對元素的選擇中，傳統文化藝術有其固定的表達元素，如紋樣、壁畫、水墨、戲曲、書法等，選取這類元素配合傳統色彩的組合設計，在用戶瀏覽網站時極易引起其心靈共鳴。

（三）版式精美

版式是網站外在美最重要的體現形式，如果說色彩和元素的搭配是網站外觀設計的“靈魂”，那么版式則是撐起靈魂的“軀殼”。隨著美育的不斷發展，用戶審美能力逐漸提高，國內外網站的外觀設計都在趨于類的同化，這一由繁到簡的過程也代表了設計中的“斷舍離”理念。以原研哉為代表的設計師都主張設計的簡約和現代化，疏密合宜的留白給用戶遐想的空間，文字與大圖的結合也更具表現的張力。在傳統文化藝術網站的設計中，做好對內容的分類，協調板塊與板塊之間的關系，突出重點，合理留白，豐富文字與圖片、視頻的排列方式，避免排版的瑣碎、集中、單一是設計重點。除此之外，還可以配合排版添加合適的動效，增添網頁的趣味性，添加視覺差、響應式、行為召喚等操作設計，使用戶在瀏覽網頁時有代入感，給用戶帶來耳目一新的觀感和沉浸式的交互體驗。綜合來說，由于網站空間的虛擬性，網頁設計中的視覺信息傳達也要善于利用多媒體技術加工網頁的視覺元素，豐富網頁的內容，優化用戶的觀感體驗[11]。

（四）操作便捷

網站的功能應圍繞其主題，滿足用戶的瀏覽和查詢等需求，不應添加過多繁瑣的操作流程設計，降低用戶的瀏覽效率。在傳統文化網站的操作流程設計上，應對網站內容做好歸類，以不同級別的頁面和不同的板塊形式進行相應的展現，做好Menu、Butten和banner的引導設計，增設關鍵字查詢等查詢框，下拉頁面側邊或頂部菜單固定展示等，便于用戶最快、最準確地找到自己想要的信息。減少無關功能設計，增強網站的專業性和學術性。

四、結語

在互聯網時代發揚優秀傳統文化藝術，利用新平臺推動其創新性發展，既有助于國民樹立文化自信，也是在向中華民族偉大復興邁進。在傳統文化網站的設計中，我們應利用設計給用戶營造出傳統文化藝術的氛圍，向用戶展示傳統文化藝術的美感，傳遞傳統文化藝術的概念，以凸顯在互聯網上搭建傳統文化藝術網站的價值。傳統文化藝術網站不僅是傳統文化藝術在互聯網上的一個展示門戶，更是利用互聯網連接世界的優勢為廣大文化愛好者、研究者、青少年學生等人群創造一個文化藝術學習的途徑。先輩將對生活的熱愛和渴望，對自然的尊重和敬畏揉進文化習俗和藝術作品里，而我們則在互聯網新時代利用網站設計和關聯的硬件設備將傳統文化藝術中的美與思想發揚光大。傳統文化藝術網站設計應基于傳統文化藝術底蘊創作的具有傳統文化藝術美感的現代化設計，應與時俱進，不斷發掘中華優秀傳統文化藝術背后的價值，在5G時代以新技術和新面貌向用戶展現中華傳統文化藝術新風采。

參考文獻：

[1]孫正廣.非物質文化遺產網站設計分析——以萍鄉漁鼓為例[J].萍鄉學院學報，2017（3）：82-84+89.

[2]胡萍，許睿.淺析用戶體驗式網頁布局及應用[J].福建電腦，2018（8）：145-147.

[3]宇澳，劉雅菲，邵妍妍.淺談網頁設計中的色彩心理[J].科技風，2020（6）：119.

[4]王曉俊.基于用戶體驗的網頁界面視覺元素設計研究[J].吉林工程技術師范學院學報，2019（1）：71-73.

[5]曾軍偉，布乃峰.傳統文化符號在網頁界面設計中的應用研究[J].包裝工程，2016（14）：165-168.

[6]張帆.版式設計在網頁設計中的應用[J].哈爾濱職業技術學院學報，2019（6）：129-131.

[7]樊歆.版式設計在網頁藝術設計中的分析[J].遼寧絲綢，2017（4）：40-41+58.

[8]龔項成.淺談網頁設計中視覺文化表現的差異性及設計策略[J].藝術科技，2015（10）：206.

[9]樊歆.網頁藝術設計在審美視角下的研究[J].黑龍江紡織，2017（3）：18-20.

[10]陳紹華.民俗文化在平面設計中的應用研究[J].包裝工程，2017（12）：218-222.

[11]朱婷婷，蔣飛燕.網頁設計的視覺信息傳達分析[J].美術教育研究，2019（9）：103-104+107.

作者簡介：陳美臻，湖南工業大學包裝設計藝術學院MFA藝術設計數字媒體藝術方向碩士研究生。

趙婉兵，湖南工業大學包裝設計藝術學院MFA藝術設計設計策劃方向碩士研究生。

艾子玲，湖南工業大學包裝設計藝術學院MFA藝術設計包裝設計方向碩士研究生。