論高校網(wǎng)頁中的視覺流與信息流

摘 要：本文分析高校網(wǎng)站首頁的現(xiàn)狀，結(jié)合視覺流與信息流相關(guān)理論，總結(jié)出瀏覽者在瀏覽網(wǎng)頁時的視覺順序原則。這些理論挖掘出原始視覺流受到信息流的影響，進而轉(zhuǎn)化成新的視覺流與信息流相交融的產(chǎn)物，兩者不斷統(tǒng)一分裂，在這個過程中追求網(wǎng)頁板式中形式與內(nèi)容的平衡。并通過視覺流程的基本規(guī)律對高校網(wǎng)站首頁設(shè)計進行分析，提供深遠(yuǎn)的參考意義價值。

關(guān)鍵詞：高校網(wǎng)頁設(shè)計;信息流;視覺流;視覺動點;視覺流成;形式與內(nèi)容

原始視覺流來源于人們最初認(rèn)識事物的思維模式，這種最初的視覺流影響了信息流的產(chǎn)生。深入探索高校網(wǎng)站首頁板式，可以發(fā)現(xiàn)網(wǎng)頁設(shè)計中視覺流與信息流交互的規(guī)律。

1 高校網(wǎng)頁設(shè)計現(xiàn)狀分析

網(wǎng)頁版式設(shè)計在高校網(wǎng)站中起著至關(guān)重要的作用，排除商業(yè)目的、使用限制等因素，學(xué)校網(wǎng)站設(shè)計相對體現(xiàn)設(shè)計的純粹感?？v觀我國高校網(wǎng)頁設(shè)計，普遍處于發(fā)展中，由于設(shè)計水平參差不齊、使用功能繁復(fù)以及服務(wù)器限制等，我國高校網(wǎng)站版面布局存在眾多問題。

現(xiàn)階段國內(nèi)學(xué)術(shù)網(wǎng)站單一且復(fù)雜，在這種大環(huán)境下的版面排版過于傳統(tǒng)，形式感弱，在學(xué)生與教師瀏覽的過程中網(wǎng)頁缺乏吸引力，互動感弱。高校網(wǎng)站建設(shè)是建設(shè)校園文化的重要途徑，大多數(shù)高校網(wǎng)站往往以具體信息發(fā)布為重點，追求單一的內(nèi)容，同時由于信息流過于分散，所以學(xué)生與老師的使用感欠佳。相比之下，國外高校網(wǎng)站會大量使用圖片以及運用視頻，設(shè)計感強并且更加人性化。

隨著信息化社會的不斷發(fā)展，形式與內(nèi)容結(jié)合的比例是今天高校網(wǎng)站設(shè)計的關(guān)鍵點。國內(nèi)高校網(wǎng)站的設(shè)計缺乏整體觀念，使用功能有很多重復(fù)的地方，以導(dǎo)航欄為例，從功能檢索角度講，當(dāng)學(xué)生與老師以及教務(wù)工作者在瀏覽網(wǎng)頁時，并不能快速找到自己需要的地方，很大程度上是由于導(dǎo)航欄設(shè)計不明確，沒有充分發(fā)揮出實際作用，不符合實際操作。國外高校網(wǎng)站的導(dǎo)航欄的交互性大多符合人機工程學(xué)原理，無論從視覺上還是設(shè)計上都經(jīng)過一定的研究，無固定單一的模式，而國內(nèi)則普遍在上方。國內(nèi)高校網(wǎng)站中應(yīng)重點表現(xiàn)人文系統(tǒng)，宣傳校園文化。但國內(nèi)高校網(wǎng)站更新緩慢，欠缺管理，往往忽略了這一方面，僅僅作為信息展示的作用，缺少對自主空間的設(shè)計。

2 視覺流的普遍規(guī)律

“視覺”眼睛的形式與“看”能力有關(guān)，主要是指人在一定時期內(nèi)對視覺對象的性質(zhì)、特征、形式的理解和把握。人類視覺是一種不斷探索的活動。

研究分析了人的視覺運動過程，提出了合理的順序、快捷的方式和有效的感知方式。我們生活的時代是一個“視覺時代”。

設(shè)計師在瀏覽頁面時跟蹤用戶，這叫視覺流。人性化的設(shè)計使人們的視覺流得到發(fā)展。人們的視覺習(xí)慣一般情況下是固定的，大多數(shù)為由上到下，由左到右。因此，在設(shè)計高校網(wǎng)站頁面時，設(shè)計師需要讓瀏覽者在一個方向上看到信息。瀏覽者的視覺被引導(dǎo)、規(guī)律化，這將更快更有效率。

按鈕應(yīng)該放在右邊;左上角優(yōu)先;亮度越高，位置越集中，注意力就越集中;從上到下、從左到右是視覺流的默認(rèn)方向。一個強大的焦點首先會吸引眼球，其次是次要信息。

長此以往，視覺流程中的信息流的前端位置和頂端位置，即第一個會被看到的區(qū)域，相對容易被注意和記住，形成左上角優(yōu)先。當(dāng)人們注意力不集中、沒有足夠的時間去瀏覽網(wǎng)頁時，或者在快速獲取所需信息之后停止瀏覽或連接到其他網(wǎng)頁時，左上角經(jīng)常成為視覺的焦點。這樣的過程被稱作視覺流。

3 高校網(wǎng)頁中視覺流與信息流的關(guān)系

與視覺瀏覽相比，視覺搜索過程是用戶有目的、有意識的活動，常常主動地采取一定的搜索策略，在 網(wǎng)頁上表現(xiàn)為更多地注視周邊區(qū)域的搜索策略。另外，對首次注視點的統(tǒng)計結(jié)果發(fā)現(xiàn)，90%的視覺搜索任務(wù)的首次注視點都發(fā)生在中心區(qū)域，這一結(jié)果表明中心區(qū)域是被試進行視覺搜索時首先注視的位置。根據(jù)視覺搜索中的返回抑制理論，注意返回到先前注意過的空間位置時會變慢或受到抑制。[1]由于網(wǎng)頁中心區(qū)域已經(jīng)被注視過，被試將抑制再次回到中心區(qū)域，更傾向于優(yōu)先選擇四周沒有注視過的區(qū)域，這樣會提高搜索效率，符合認(rèn)知經(jīng)濟原則。視覺瀏覽過程與視覺搜索過程相比，更多地受個人興趣、愛好等的影響。[2]

基于基本要素分析，研究截取了全球設(shè)計類專業(yè)排名前20的學(xué)校以及中國具有代表性的15所院校，主要分布在中國、美國、英國3個國家，以此來進行比較分析，從不同的引導(dǎo)方式建立系譜關(guān)系，表現(xiàn)信息流與視覺流的關(guān)系。

通常中國高校網(wǎng)站比較喜歡文字與圖片同時引導(dǎo)的類型，這種類型結(jié)構(gòu)飽滿，充分利用了網(wǎng)格結(jié)構(gòu)進行排版，圖片與文字相輔相成、互相結(jié)合，但是由于信息量過大，所以信息檢索比較煩瑣，國內(nèi)高校在進行首頁布局的同時過分強調(diào)以內(nèi)容為中心。而美國高校網(wǎng)站首頁瀏覽起來目的明確，功能檢索能力明確，并且美國高校在文字引導(dǎo)方面，在版面設(shè)計中，文字區(qū)域與圖片區(qū)域劃分較明顯，并且在大量圖片的基礎(chǔ)上，會加入視頻來提高互動性，這在電腦端的交互設(shè)計中非常具有靈活性。

以純文字引導(dǎo)的網(wǎng)頁由于其傳統(tǒng)的形式，所以效果相對單一，略顯乏味。相比之下，圖片引導(dǎo)類型簡單高效，可讀性強，并且更加人性化。人是視覺動物，圖形對人的注意力的吸引更具科學(xué)性。而最為繁復(fù)的圖文結(jié)合引導(dǎo)類型，信息量過大顯得毫無重點。

結(jié)合前面幾種分類，同時以圖片在網(wǎng)頁中所占比例為基準(zhǔn)，分析中國、英國與美國高校網(wǎng)站的信息流比重，同時融入學(xué)校類別的概念，從多方面角度分析國家以及學(xué)校性質(zhì)是否會對圖片信息流產(chǎn)生影響，從而導(dǎo)致視覺流發(fā)生變化。

由此可見，從微觀層面出發(fā)，中國高校網(wǎng)站首頁圖片占比相對比較平均，其中綜合類學(xué)校圖片占比相比藝術(shù)類院校圖片占比較少。美國類高校網(wǎng)站首頁設(shè)計跨度較大，但整體以圖片引導(dǎo)為主，理工類學(xué)校與綜合類學(xué)校圖片占比相對較少，但還是多于英國與中國。這可能是由于其國家文化的開放性，受到民族的包容性影響。英國高校網(wǎng)站首頁設(shè)計整體比較平均。從宏觀方面看，藝術(shù)類院校網(wǎng)站首頁的圖片比例由于受到國家文化或人們傳統(tǒng)的閱讀習(xí)慣的影響，整體水平波動較大，而綜合類學(xué)校受外部因素影響較小，由于內(nèi)容的限制，圖片比例較為平均，無大幅度變化。理工類學(xué)校也是如此。

圖片引導(dǎo)類型中，有色塊引導(dǎo)類型、創(chuàng)意引導(dǎo)類型、視頻引導(dǎo)類型，構(gòu)建系譜關(guān)系。以色塊引導(dǎo)類型為主，會增加版面的視覺活力，同時豐富版面層次感。以創(chuàng)意引導(dǎo)為主類型，產(chǎn)生視覺沖擊，會給人很強烈的視覺印象。而以視頻引導(dǎo)為主類型，形式豐富，互動性強，會增加頁面的趣味性，優(yōu)化用戶體驗感。在文字引導(dǎo)中，字體引導(dǎo)類型可以說是中文排版的獨特優(yōu)勢，利用中國字體的形象，可以打造豐富的版面，并且無形中劃分了區(qū)域。字號引導(dǎo)類型較少，主要用于板塊之間小標(biāo)題，效果統(tǒng)一，省時、高效、直觀。間距類型引導(dǎo)類型中，利用留白的形式感，在字與字的間距中、行與行的間距中劃分板塊，會產(chǎn)生一定的形式感與視覺感，這種類型被大多數(shù)學(xué)校使用。

由此反映出視覺流與信息流的普遍規(guī)律，從整體來說，先圖后文。人是視覺動物，圖片相對而言具有互動性。在圖片的大環(huán)境中，先靜后動，受到動態(tài)圖片的影響，同時受到創(chuàng)意形式的排版與色塊影響，產(chǎn)生視覺優(yōu)先。再者先大后小，圖片信息與文字信息均是如此。最后是先中間后兩邊，這是固有化視覺流的產(chǎn)物。

4 展望高校網(wǎng)頁設(shè)計

高校網(wǎng)頁建設(shè)要學(xué)會打造自己的重點，但是許多學(xué)院的網(wǎng)頁設(shè)計仍然有問題，不僅需要從信息技術(shù)、組織結(jié)構(gòu)、創(chuàng)新思維等方面切入，并且要與時俱進，與使用者產(chǎn)生更多的交流，增加互動性，挖掘?qū)W校本質(zhì)的優(yōu)點來進行高校網(wǎng)頁的設(shè)計。

要找準(zhǔn)高校網(wǎng)站首頁設(shè)計的基本功能和用戶需求，從而確立高校網(wǎng)站首頁設(shè)計的目標(biāo)，在這個過程中要確定主體內(nèi)容。確定每個高校的服務(wù)對象最基本的交流窗口，通過學(xué)校的網(wǎng)站與網(wǎng)頁，學(xué)生可以了解學(xué)校的辦學(xué)理念。

通過研究可以看出，視覺流與信息流在網(wǎng)頁設(shè)計中相互平衡協(xié)調(diào)，互相襯出對方想表達的信息意圖，在兼具形式內(nèi)容的基礎(chǔ)上，發(fā)揮視覺流程的具體作用，對高校網(wǎng)站首頁具有借鑒性，并且具有深遠(yuǎn)的指導(dǎo)作用。

參考文獻：

[1] 趙靜.不同線索范式對憤怒、恐懼面部表情識別的影響[D].曲阜師范大學(xué)碩士論文，2014.

[2] 許娜.網(wǎng)頁視覺搜索與無目的瀏覽的眼動對比研究[D].曲阜師范大學(xué)碩士論文，2014.

作者簡介：牛嘉琪（1995—），女，河南洛陽人，碩士研究生在讀。