高校門戶網(wǎng)站視覺設(shè)計(jì)趨勢(shì)研究

胡燕

摘 要：高校的門戶網(wǎng)站是高校信息化建設(shè)的重要窗口，展示的是高校的精神面貌，與社會(huì)生活交換著重要的信息，也以此接受公眾的監(jiān)督。文章以高校門戶網(wǎng)站的視覺設(shè)計(jì)為研究對(duì)象，針對(duì)當(dāng)前高校門戶網(wǎng)站的設(shè)計(jì)現(xiàn)狀，預(yù)測(cè)未來(lái)的設(shè)計(jì)趨勢(shì)，從而實(shí)現(xiàn)高校形象建設(shè)、教學(xué)教育貫穿一體、優(yōu)化發(fā)展的目標(biāo)。

關(guān)鍵詞：高校門戶網(wǎng)站;視覺設(shè)計(jì);信息化建設(shè)

門戶網(wǎng)站從廣義上講，是一個(gè)應(yīng)用框架，將各類數(shù)據(jù)資源匯聚到互聯(lián)網(wǎng)管理平臺(tái)上，用統(tǒng)一化的用戶界面為用戶提供信息，滿足用戶的瀏覽需求。高校門戶網(wǎng)站是門戶網(wǎng)站中的一類，是指高校內(nèi)部各類網(wǎng)站、數(shù)據(jù)信息、應(yīng)用系統(tǒng)的總和，是高校內(nèi)部的資訊與外部互聯(lián)網(wǎng)實(shí)現(xiàn)資源交互共享的終端。它不以盈利為目的，沒有龐雜無(wú)當(dāng)?shù)男畔?，其界面設(shè)計(jì)都非常直觀，秉承的是“以教育為本”的原則，實(shí)現(xiàn)的是向用戶提供并傳遞準(zhǔn)確信息的目的。但是網(wǎng)絡(luò)媒介的飛速發(fā)展，讓高校的門戶網(wǎng)站不僅成為展示高校形象的窗口，更成為文化內(nèi)涵與大學(xué)精神的輸出陣地。

一、內(nèi)容與形式必須具備秩序感

高校的門戶網(wǎng)站設(shè)計(jì)，它的內(nèi)容主要是圍繞著學(xué)校相關(guān)的欄目開展的，基本上就是學(xué)校概況、辦學(xué)理念、院系設(shè)置、學(xué)科設(shè)置、校風(fēng)校貌等欄目，從欄目的設(shè)置上，基本可以判定學(xué)校的性質(zhì)與特色。因此，在整合內(nèi)容的時(shí)候，一定要突出教育網(wǎng)站的性質(zhì)，通過(guò)有序的排列，讓瀏覽的用戶一目了然。另外，門戶網(wǎng)站一定要有校名與?；眨@是學(xué)校所有文化的統(tǒng)一標(biāo)志，能夠讓人們對(duì)學(xué)校的基本教育精神和理念有所了解，也有助于學(xué)生、教師等經(jīng)常使用網(wǎng)站的人加深對(duì)本校的認(rèn)識(shí)。

網(wǎng)頁(yè)的內(nèi)容與形式是一個(gè)整體，當(dāng)把大量的信息放到網(wǎng)頁(yè)上時(shí)，需要考慮的是對(duì)這些內(nèi)容如何進(jìn)行編排。不僅是組塊信息需要編排，與之相應(yīng)的細(xì)節(jié)也需要編排。這就需要設(shè)計(jì)師從頭至尾地梳理思維，思考如何將內(nèi)容與形式結(jié)合起來(lái)，讓用戶在頁(yè)面盡可能多地得到有效信息的同時(shí)，又能身心愉悅。這是需要從審美層面入手的，在門戶網(wǎng)站的設(shè)計(jì)中，將各種元素按照統(tǒng)一與變化、條理與反復(fù)、均衡與對(duì)比等原則整合在一起，完成對(duì)網(wǎng)頁(yè)中的文字、圖像的設(shè)計(jì)。

二、突出主題要素

每一個(gè)網(wǎng)頁(yè)都應(yīng)該有明確的主題，然后按照人們的視覺規(guī)律進(jìn)行編排，將其中的信息準(zhǔn)確地傳達(dá)給瀏覽者，使人們能夠從信息群中快速地提取出自己需要的信息，或者是形成視覺焦點(diǎn)。這是吸引網(wǎng)站瀏覽者最重要的元素，明確的主題會(huì)引導(dǎo)人們的視線，這是網(wǎng)站信息排列的初衷，也是視覺設(shè)計(jì)的初衷。為了突出主題，網(wǎng)站一般會(huì)采用結(jié)構(gòu)變化的方法。如把需要傳達(dá)的主題做實(shí)做大，和主題無(wú)關(guān)的則可以虛化或是占據(jù)比較小的網(wǎng)頁(yè)面積，強(qiáng)化視覺力度永遠(yuǎn)是最傳統(tǒng)卻最管用的突出主題的方法。

為了突出主題要素，可以在不影響整體效果的情況下，把一些多余的元素去掉，或是在能夠達(dá)到同樣效果的設(shè)計(jì)方案中，選擇相對(duì)簡(jiǎn)單的設(shè)計(jì)，總體來(lái)說(shuō)，就是越簡(jiǎn)單的方案主題越突出。除此以外，還要對(duì)一些細(xì)節(jié)進(jìn)行“雕琢”。很多國(guó)外的大學(xué)在門戶網(wǎng)站的設(shè)計(jì)上都可以達(dá)到“像素級(jí)的完美”，即使設(shè)計(jì)的邊框等不被瀏覽者注意的細(xì)節(jié)都能達(dá)到近乎真實(shí)的效果，從而在審美氛圍的營(yíng)造、門戶網(wǎng)站的品位等方面上一個(gè)臺(tái)階。

三、審美與實(shí)用兼而有之

高等院校的門戶網(wǎng)站在設(shè)計(jì)時(shí)，必須同時(shí)滿足教師與學(xué)生的審美需求。網(wǎng)頁(yè)追求簡(jiǎn)單與大方，最能滿足大部分人的審美，還可以營(yíng)造出濃厚的學(xué)術(shù)氛圍，讓嚴(yán)謹(jǐn)認(rèn)真的治學(xué)態(tài)度自然而然地表現(xiàn)出來(lái)。就使用體驗(yàn)來(lái)看，清晰美觀且滿足了大部分人審美需求的頁(yè)面，會(huì)給人們帶來(lái)愉悅、舒適的瀏覽體驗(yàn)，讓人們接受信息更加容易。在審美上，不要追求過(guò)于花哨的內(nèi)容，雖然每個(gè)人的審美是有差異的，但是自然樸素總是更容易被人們所接受。

除了審美上的共性，人們更愿意追求功能的實(shí)用性。國(guó)內(nèi)目前有很多高校的網(wǎng)站設(shè)計(jì)都不完善，有些鏈接點(diǎn)進(jìn)去沒有對(duì)應(yīng)的內(nèi)容，人們使用起來(lái)很不方便，尤其是在招生信息的鏈接上，人們?cè)陂T戶網(wǎng)站獲得的信息還沒有通過(guò)搜索引擎得到的信息多。設(shè)計(jì)者要對(duì)每一個(gè)網(wǎng)頁(yè)鏈接的功能做出統(tǒng)籌布局，讓人們點(diǎn)進(jìn)去后有收獲，畢竟所有的視覺設(shè)計(jì)都是為了內(nèi)容而服務(wù)的。在兼顧美感和功能的過(guò)程中，設(shè)計(jì)師不要慣用一種設(shè)計(jì)方法。例如當(dāng)前使用的web2.0的確被人們普遍接受，但是一味模仿也并非良策。為高等院校進(jìn)行的視覺設(shè)計(jì)，一定要擔(dān)負(fù)起引領(lǐng)和提升社會(huì)審美的責(zé)任，慣用web2.0，會(huì)讓人們陷入到一種陳舊的審美中。如果是有自覺審美的人群，則會(huì)厭煩這種設(shè)計(jì)，這與高校門戶網(wǎng)站的視覺設(shè)計(jì)初衷是相悖的。由此可見，高等院校的門戶網(wǎng)站在進(jìn)行視覺設(shè)計(jì)時(shí)，必須自覺地承擔(dān)社會(huì)功能。

四、方便快捷也要善于“留白”

所謂的方便快捷包含了兩個(gè)部分，第一個(gè)部分是網(wǎng)頁(yè)上的按鈕設(shè)計(jì)應(yīng)該明確醒目，能夠讓瀏覽者直接看到。那些花哨、夸張的設(shè)計(jì)，看上去非常個(gè)性，但是并不適用，讓人眼花繚亂，也不符合高校的學(xué)術(shù)氣質(zhì)。第二個(gè)部分是門戶網(wǎng)站整體的結(jié)構(gòu)設(shè)計(jì)。正如上文所說(shuō)的，在內(nèi)容和形式上需要有秩序感。例如：明確每一個(gè)內(nèi)容的安排是不是按照一定的順序進(jìn)行的;明確從首頁(yè)開始，是不是體現(xiàn)出欄目明確化、設(shè)計(jì)合理化、層級(jí)結(jié)構(gòu)簡(jiǎn)單化、信息明確具體化的特點(diǎn)。在設(shè)計(jì)領(lǐng)域有一句名言：“別讓我思考?！边@句話一語(yǔ)道破當(dāng)下人們使用互聯(lián)網(wǎng)的心態(tài)。有人精確地計(jì)算過(guò)人們?yōu)g覽網(wǎng)頁(yè)的時(shí)間，平均一個(gè)網(wǎng)頁(yè)的有效停留時(shí)間只有3秒鐘，人們會(huì)快速瀏覽并判斷是否有自己需要的信息。如果在這3秒鐘里，人們還要費(fèi)力地尋找按鍵、檢索內(nèi)容，那顯然是不現(xiàn)實(shí)的，那樣的設(shè)計(jì)只會(huì)讓人們更快地放棄這個(gè)網(wǎng)頁(yè)甚至是這個(gè)網(wǎng)站。還有，在網(wǎng)頁(yè)上適當(dāng)“留白”，也能夠給人們留下較好的觀看體驗(yàn)。這種“留白”和上文所批評(píng)的沒有內(nèi)容并不沖突。這里所指的“留白”是為人們留下一些空間，例如將行距、字間距變寬，字體適當(dāng)放大等，促進(jìn)瀏覽的合理化，是來(lái)自視覺的體驗(yàn)，而非我們認(rèn)為的內(nèi)容上的簡(jiǎn)化。

五、網(wǎng)頁(yè)“副空間”的作用會(huì)越來(lái)越大

“副空間”實(shí)際上是一個(gè)建筑學(xué)領(lǐng)域的名詞，也被稱為過(guò)渡空間或是灰色空間。與建筑學(xué)中所說(shuō)的“副空間”一致，在網(wǎng)站設(shè)計(jì)上，那些介于利用和未被利用之間的空間，都被歸入“副空間”。它與“留白”有一些異曲同工之處，不過(guò)“副空間”更重視的是網(wǎng)頁(yè)之間的銜接。一些高校在網(wǎng)站設(shè)計(jì)上非常容易進(jìn)入的一個(gè)極端是，一個(gè)內(nèi)容展示完畢后，馬上展示另一個(gè)內(nèi)容，密度之大讓瀏覽者很容易混淆信息，產(chǎn)生厭煩感。如果能在銜接部分加入一些創(chuàng)新的元素，則會(huì)給人不一樣的視覺感受。例如哈佛大學(xué)、麻省理工學(xué)院的網(wǎng)頁(yè)上都有一些藝術(shù)作品的展示，這些藝術(shù)作品源于生活但是高于生活，把人們印象中大學(xué)嚴(yán)肅的氣氛與高雅的格調(diào)聯(lián)系在了一起，展現(xiàn)出不一樣的風(fēng)格。人們每當(dāng)瀏覽到這些網(wǎng)頁(yè)時(shí)，就會(huì)忍不住“駐足”，甚至是產(chǎn)生共鳴，這才是一個(gè)成功的視覺設(shè)計(jì)。當(dāng)然，各個(gè)學(xué)?？梢砸罁?jù)自己的性質(zhì)和風(fēng)格進(jìn)行設(shè)計(jì)，如，北京航空航天大學(xué)等理工類卓著的院校在對(duì)“副空間”進(jìn)行設(shè)計(jì)時(shí)，更多采用縱向線條，與其本身的氣質(zhì)相協(xié)調(diào)。“副空間”還可以被看作是交互設(shè)計(jì)界面的“中轉(zhuǎn)站”，在人們檢索信息、整合信息的過(guò)程中，“副空間”中的內(nèi)容可以放松心情，這也不失為高校向社會(huì)傳遞精神面貌、引導(dǎo)社會(huì)文化的一個(gè)有效的途徑?？傮w來(lái)說(shuō)，“副空間”越以人為本，就會(huì)越多地吸引到人們的關(guān)注，傳播有效的信息。

六、結(jié)語(yǔ)

在高科技迅猛發(fā)展的時(shí)代，中國(guó)高校門戶網(wǎng)站的設(shè)計(jì)更像是一個(gè)襁褓中的嬰兒，沒有可以照搬的模式，一切元素都處于待開發(fā)階段。但是設(shè)計(jì)本身并沒有形式上的規(guī)定和標(biāo)準(zhǔn)上的限制，這就為高校門戶網(wǎng)站的設(shè)計(jì)優(yōu)化提供了巨大的空間。設(shè)計(jì)師從內(nèi)容、形式、色彩、功能等各種元素著手進(jìn)行界面的設(shè)計(jì)，擁有更大的發(fā)展空間。注重從傳統(tǒng)的藝術(shù)思想理論和形式法則中汲取營(yíng)養(yǎng)，善于思考與設(shè)計(jì)，讓網(wǎng)站的界面銜接得更加精彩、更加出色、更加人性化，必然是設(shè)計(jì)發(fā)展的基礎(chǔ)，為更多的藝術(shù)設(shè)計(jì)實(shí)踐活動(dòng)提供著扎實(shí)的基礎(chǔ)與養(yǎng)分。

參考文獻(xiàn)：

[1]閔偉，丁耀.高校門戶網(wǎng)站人性化設(shè)計(jì)的調(diào)查研究：以閩江學(xué)院為例[J].赤峰學(xué)院學(xué)報(bào)（自然科學(xué)版），2015（9）：22-24.

[2]劉松，藍(lán)鷹.高校門戶網(wǎng)站的頁(yè)面導(dǎo)航布局設(shè)計(jì)研究[J].智能計(jì)算機(jī)與應(yīng)用，2017（5）：117-118，122.

[3]唐甜，尚子田.高校門戶網(wǎng)站界面交互設(shè)計(jì)研究[J].中國(guó)民族博覽，2018（2）：102-103.

[4]晁永剛，劉明國(guó)，葛曉昱，等.關(guān)于高校網(wǎng)站的設(shè)計(jì)思考[J].大眾文藝，2016（9）：83.

作者單位：

湖北科技學(xué)院藝術(shù)與設(shè)計(jì)學(xué)院