前言：尋找寫作靈感？中文期刊網用心挑選的視覺傳達在高校網站設計中應用，希望能為您的閱讀和創作帶來靈感，歡迎大家閱讀并分享。
摘要：文章對高校網站建設中視覺傳達設計的概念、功能、意義等進行具體闡釋，分析界面設計中視覺傳達的審美需求、特征及理念。從網站的設計原則、色彩需求特性、文字版式、框架風格等多角度出發，探討高校在網站建設中視覺傳達設計具體應用。運用計算機、設計學、美學等方法，解決技術與藝術的深度融合，給出網站設計方案，滿足用戶視覺體驗、易操作性個性化需求，探索藝術與技術高度結合的網站建設新模式，為網站設計者的實踐提供可行性參考。
關鍵詞：網站；界面設計；視覺傳達；美學元素
網站界面的視覺表現力對用戶有著最直觀的影響，也是網站建設成功的關鍵，用戶的網站訪問體驗與感受亦是通過網站的視覺設計效果進一步表達出來。在網站建設過程中除了展示、易用、傳達信息基本功能外，更要舒適的界面的視覺設計來增加用戶的關注度，提升用戶吸引力，實現高校教育教學信息與視覺元素的協調性、系統性、整體性的有效整合。
1視覺傳達
視覺傳達設計主要利用視覺符號來進行傳達信息，注重審美效果的設計元素以視覺的形式表達出來，網站設計師通過視覺設計傳達思想，從而引發人的心理效應，用戶通過視覺對設計產生積極反應和印象，繼而更有指向性的來獲取信息[1]。視覺傳達設計在藝術性氣息較濃厚的網站應用中，要有明確自身定位和內容，深化富有學院特色、個性的美學特質。網站建設內容要明確，定位做到精細化。在設計過程中要始終做到把人的價值放到首位，藝術性網站瀏覽者用戶，大多是具有知識或藝術背景的高校教師和學生，對藝術和美感有著非常高的喜愛和要求，講究網站設計中細節，注重內容表達及色彩展示。
2網站界面設計的方法與原則
網站是依據特定的規則，運用Unity3D、HTML、Dreamweaver、Flash、Photoshop等網頁制作工具來創作出展現特定內容的網頁集合。網頁界面是人機交互操作，易操作、美觀、體驗感較強的人機界面更加吸引用戶的瀏覽訪問，增強用戶的體驗沉浸感。界面設計（UserInterface）人與系統通過此界面媒介，用戶獲得信息，系統接收、處理、相應信息，充分實現彼此信息的互動[2]。
2.1界面設計方法
展現視覺傳達設計在網站界面設計中的引導性特征，讓視覺元素在界面中合理安排，遵循視覺心理與生理流程特點，有效引導用戶愉快、便捷、清晰流暢接受網頁傳達內容信息。做到技術與藝術的完美結合，以設計意圖為主線引導用戶行為，更加有效的來促進信息的表達，提升頁面視覺傳達設計的引導力。把握視覺傳達設計交互在網頁中的應用，可包含教育、教學、科研、資源等內容，在交互性設計環節要注重用戶參與感的滿足，通過交互給予用戶適當的行為或者過程控制權，使其更深入的理解、體驗，提升用戶興趣，同時也不斷豐富網站自身內容的建設。運用視覺傳達設計視覺符號及其系統構成的視覺語言在具有視覺沖擊力的交互設計中充分的傳遞、表達信息，大大降低信息的復雜度、認知負荷，方便用戶解析、接受并開啟交互，增加信息獲取的動態性、趣味性。注重視覺傳達設計親和性在網頁中的運用，如文字、色彩、圖形、動畫、3D等融合、轉換提供了更加直接、感性、更具親和力的信息內容表達。視覺傳達設計技術及AR技術的的發展和應用，更加逼真、個性化、親和力的場景應用開始出現，視覺沖擊力和認知力效果增加了用戶知識學習、信息獲取過程中的身臨其境的親和效應。
2.2界面設計原則
高校教育教學、科學研究網站的設計和建設要遵循技術性、教育性、科學性等原則，還應具有個性化、特色化的設計原則，教育網站的設計傳達設計是技術與藝術的融合，內容與形式的統一。布局要合理，網頁布局是對頁面設計元素和內容的合理規劃與安排，設計師利用技術兼用藝術巧妙利用結構和布局原理，遵循視覺及心理規律，將各設計元素有機聯系起來，設計過程中可通過文字編排、色彩搭配凸顯重點內容，一般重要頻道一般置放與左上方區域，力求做到布局主題突出、視覺清晰、內容簡潔、整體協調。色彩搭配合理，做到用色準確。顏色和色調是視覺基本組成元素，色彩的設計應根據內容表現需求和用戶色彩心理特點，要想充分表達整體站點，需色彩的綜合運用，色彩表現要均衡，從整個站點的高度出發，不能偏重于一個點，否則就會造成視覺色彩失重，如大色與小色，純度與明度的合理設計。頁面主色彩色調的設計與選擇要考慮整體設計風格，主題的體現等，單色調、調和調及對比調應根據內容的表現需要來進行選擇和搭配，已達到對比你、襯托、層次、協調等效果。簡潔清晰原則應貫穿整個網站設計的過程當中，如果網頁圖形太大或者色彩過重過多，都會影響到給視覺帶來的美感，同時亦會影響到瀏覽的體驗，簡潔的信息及色彩表現，會帶來較好的用戶體驗。保持節奏的清晰，因為節奏是UI設計中重要美學元素組成，色調、質感、線型框等要素在布局設計中都可以形成較強的節奏，將美學元素進行適當的重疊、移位即可產生所需節奏，保持適當的節奏設計，才能達到最佳信息傳遞及視覺表達的效果。協調統一原則，確定網站功能服務主體，色彩、節奏、布局頁面等設計要素要服務于主體，各視覺要素統一起來，相互搭配協調，由表達主體進行統一。
3視覺傳達在高校網站建設中的應用
3.1版式布局在高校網站設計中的視覺傳達
版式布局根據網站建設內容的需要將文字、圖形、色彩等諸要素相結合進行過程編排，通過節奏、比例、色彩、虛實等美學規律進行頁面的設計與制作，把設計方案與思想以造型要素及形式原理的形式進行表現，營造視覺的審美信息空間。版式布局的設計是創意網站設計過程，應充分體現學校特色理念，遵循形式美學的要求，一般可采用對稱、非對稱、對比、比例等布局設計風格，注意視覺造型各元素之間的運用、組合配置，如大小、間隔、位置、節奏與美感等。利用表格和框架技術對頁面進行分割，根據人的視覺模式識別特點構建簡潔的視覺流程，注意視覺元素大小、輕重比例關系，保持頁面整體布局平衡協調。視覺心理學認為版式布局傳遞的信息內容與設計中、使用者心理處于同步狀態下，會產生一種認知理解和美感效果。在版式布局設計時應尊重用戶信息獲取閱讀的個性、習慣，巧妙運用元素的主從關系、層次和實際流程等形式手法，富于創造、想象力的版式布局設計，以合理的順序、有效的感知方式，激發瀏覽訪問者的注意與興趣，獲取用戶的最佳體驗印象，產生良好的心理效應，更好的傳播信息，從而實現傳達與溝通的目標。在版式布局設計中巧用留白設計，適當的留白設計會使網頁布局顯得松弛有度，表現出活力，給人帶來充分的想象空間。以大連海洋大學藝術與傳媒學院為例，如圖1所示，網頁中緊湊的文字編排，適當的留白設計，簡潔的設計，形成疏密有度的對比，給人以清新舒爽的體驗感受。網站版式布局設計，我們采用橫、縱互相結合的布局結構，以橫向布局為主，頁面比例均衡，統一協調，適當留白具體實踐應用。靈活運用視覺元素大小、形狀、疏密色彩來調節對稱軸線的分量，造成視覺的堆成，給人以平衡感，把握整體布局統一，追求局部的個性變化，給人整齊簡潔、和諧之美及良好的穩定感。
3.2文字在高校網站設計中的視覺傳達
文字元素是信息傳遞的重要載體，在網頁設計時文字的字體、大小、顏色及其排列方式要與整體頁面表現視覺元素相統一，一般情況下，在單頁面中出現的字體最多不要超過四種類型，否則會給瀏覽者帶來視覺疲勞，難以凸顯視覺重點，有種凌亂的感覺。如果想要一個風格獨特，印象深刻的網站，設計者需要對文字進行創意的構筑，每一處的彎曲、筆畫和角度都要巧妙的運用于字體。從整體界面風格、版式布局等開展文字的創意設計與運用，最大化表現文字獨特的色彩、別開生面的字體類型，給瀏覽者帶來視覺的沖擊。負空間的營造遵循瀏覽者的視覺心理習慣，所謂負空間具體表現為字間距、行間距、段落之間的間距[3]，瀏覽者習慣于某種閱讀方向和順序的習慣，如自上而下或從左至右。字距、行距主意恰當的比例關系設置，可以適當加寬行距，形成較為明顯的距離空白，增加瀏覽者的舒適度，段距一般可以采用增加空白來提升裝飾效果。應用CSS技術來對字體屬性控制，CSS指令控制文字字型樣式及段落外觀等方式，樣式表模板如圖2所示。圖2樣式表控制模板
3.3圖形在高校網站設計中的視覺傳達
圖形語言作為一種藝術形式，能夠創造新形象，傳達新意念，拓展瀏覽者的思維，實現信息傳遞的有效性[4]。在圖形設計中強調點、線、面的結合，在應用時一般采用jpg、jpeg、gif、png等瀏覽器支持度較高的壓縮圖形格式，其中jpeg的壓縮效果相對較好，適合大、中型圖形，在網絡上傳或傳輸時速度快、時間短。在選用圖形時，圖形的位置、大小、組合形式、展示方式等在整體的頁面設計編排中給予重點的考慮，保證頁面整體的美觀、實用。圖形的設計、選用要充分反映網站的主題與內涵，突出重點，避免大量采用抽象圖形代替文字的插圖或插畫，亦不可在頁面中插入圖形過多。合理運用不同造型手法，照片、插畫、漫畫等多種形式選擇，達到圖文并茂、風格協調的美學效果。圖形展示頻道設計緊密結合學院辦學動畫傳媒、視覺傳達專業特色，采用膠片作為圖框，設計作品從右至左動態滾動展示，圖形的嵌入不僅增添了頁面的趣味性和藝術性，同時有利于信息的傳達以及瀏覽者對網站內容的理解，增加信息獲取、記憶效果。
3.4色彩在高校網站設計中的視覺傳達
色彩作為一種視覺元素，富有表情，視覺作用先于形象，使瀏覽者產生不同的聯想和情感[5]。網頁設計時要選擇與網站特點、理念相一致的色彩，可根據不同的主題確定合適的色彩，力求體現出網站特色，亦可根據不同的信息表達內容，來運用不同的色彩進行表現信息的生動性和豐富性。學院網站整體設計以海洋文化元素確定主題色為“藍色”基調，同時考慮藝術的多元化特征，融合多種色彩進行視覺表達，藍色表達出來的海洋的博大、深邃、永恒、理性，橙色象征開放與隨和，黃色象征光明、智慧之光，粉色代表青春、優雅高貴的風度，紅色代表激情、熱烈、溫暖。通過色彩的飽和度、透明度、漸進變化的設計，使頁面和諧統一、特色鮮明、重點突出、對比強烈，產生了強烈的藝術效果。
4結語
在高校網站建設中視覺傳達設計具有較強的綜合性、整體性，設計時應關注風格的整體統一，多視覺元素運用相結合，在突出個性、特色的同時需要站點或站群的協調性。對總體框架版式布局的規劃、層次的編排、色彩的應用、文字及圖形的處理等都要充分的規劃、統籌，做到局部服從整體，視覺元素之間緊密恰當的聯系，不僅為了滿足用戶的信息需求，更要創造一種愉悅的視覺美學意境。
參考文獻：
[1]劉丹.視覺元素在網頁設計中的運用[J].合肥工業大學學報,2012,(2).
[2]RobertHoekman,Jr.JaredSpool.網站設計解構有效的交互設計框架和模式[M].北京:人民郵電出版社,2010.
[3]伊達千代.文字設計的原理.[M].悅之文化譯,北京:中信出版社,2011.
[4]喬柳.網頁界面設計中的信息圖形化研究[D].上海:上海交通大學,2010.
[5]叢琳.網頁配色構圖細節設計[M].北京:人民郵電出版社,2010.
作者:紀策 程羅德 丁立華 張仕春 單位:大連海洋大學
