版式設計在網(wǎng)頁設計的應用
前言：想要寫出一篇引人入勝的文章？我們特意為您整理了版式設計在網(wǎng)頁設計的應用范文，希望能給你帶來靈感和參考，敬請閱讀。
摘要:信息技術的發(fā)展為現(xiàn)代社會帶來新的發(fā)展機遇。作為人們分享信息、獲得資源的主要途徑，網(wǎng)站逐漸受到人們的重視。美觀獨特的網(wǎng)頁可以吸引瀏覽者的注意力，讓其印象深刻。通過深入研究如何在網(wǎng)頁設計中合理運用版式設計，分析網(wǎng)頁版式設計的特點、網(wǎng)頁版式設計的原則及版式設計在網(wǎng)頁設計中的作用等相關問題。
關鍵詞:版式設計;網(wǎng)頁設計;視覺傳達
一、網(wǎng)頁設計與版式設計
(一)網(wǎng)頁設計
網(wǎng)頁設計是在互聯(lián)網(wǎng)及數(shù)字技術發(fā)展中產生的一種新藝術形式。它是以互聯(lián)網(wǎng)為載體，以網(wǎng)絡技術和數(shù)字技術為基礎，依照設計目的，遵循藝術設計規(guī)律，實現(xiàn)設計目的與功能，強調藝術與科學密切結合的一種藝術創(chuàng)造化視覺傳達活動［1］。在網(wǎng)站運營中，精美的網(wǎng)頁設計是提升網(wǎng)站知名度、增加瀏覽用戶以及推銷自身的重要載體。它是網(wǎng)絡視覺藝術的主要表現(xiàn)形式，也是當代設計藝術的重要組成部分。
(二)版式設計
今天的人類生活到處都離不開版式設計，無論書刊、報紙、網(wǎng)頁設計，還是巨大的建筑或公共環(huán)境，都是版式設計的典型代表?？梢哉f版式設計是現(xiàn)代設計藝術的重要組成部分，是視覺傳達的重要手段［2］。版式設計是藝術專業(yè)的必修課，適用于包裝設計、書籍設計、網(wǎng)頁設計等專業(yè)課。將版式設計與網(wǎng)頁設計有機結合在一起，恰當?shù)剡\用版式設計法則將各元素組織起來，可以使網(wǎng)頁中的各種視覺元素進行科學合理的排列與組合，兼具思維邏輯性與藝術性。通過不同的版式編排，網(wǎng)站會呈現(xiàn)各自的特色，給瀏覽者以賞心悅目的視覺享受，從而使瀏覽者印象深刻，對網(wǎng)站起到良好的宣傳作用。
(三)網(wǎng)頁設計中的版面視覺特點
網(wǎng)頁是瀏覽者通過電腦、手機等電子設備進行信息瀏覽的一種載體，在版式、文字、圖形、色彩的運用上與傳統(tǒng)紙質媒體版式存在明顯區(qū)別。網(wǎng)頁上還包含超鏈接、按鈕等組件，因此在設計過程中需要結合瀏覽者的閱讀方式進行文字安排，如按照網(wǎng)格線進行縱向文字排列來適應瀏覽者通過按鍵上下滾動頁面進行閱讀的方式。由于網(wǎng)頁具有跳動性，為了緩解瀏覽者的視覺疲勞，要選擇合適的字體及字號，內容要清晰概括，符合網(wǎng)頁設計中版式的視覺特點。
(四)網(wǎng)頁設計中的版式設計原則
1．合理編排和布局
網(wǎng)頁內容通常包含文字、圖片、鏈接、一些流動的窗口及附加廣告等，巨大的信息量經常會讓瀏覽者感到眼花繚亂。這就需要設計者進行合理的安排和布局，使頁面上所有內容能組成一個有機的整體，讓瀏覽者能夠進行合理閱讀。
2．突出設計主題
許多優(yōu)秀的網(wǎng)頁之所以讓瀏覽者感覺美觀大氣，主要得益于其主題鮮明、版面清晰的版式設計。從頁面結構的分割和造型空間的確立入手安排網(wǎng)頁元素的位置，可以突出版式設計的主題效果，使瀏覽者快速地記住頁面信息。如很多購物APP的首頁上會比較明確告知瀏覽者什么物品屬于什么分類、什么貨物最吸引人等，主次分明的構成可以方便消費者快速選購。
3．符合視覺及心理特點
瀏覽網(wǎng)頁的過程是一個對視覺元素所傳播信息的認知過程，這要求設計者在進行網(wǎng)頁設計時要將人們在視覺、心理和生理方面的特點考慮進去，并以此為依據(jù)確定各種元素間的視覺關系及瀏覽秩序［3］。同時，設計者應根據(jù)這種特點引導瀏覽者的瀏覽順序，達到重點宣傳的目的。設計時需要注意保證信息的有效傳達以及突出主要信息，這樣才能吸引瀏覽者保持興趣進一步瀏覽下去。
4．適應網(wǎng)頁的動態(tài)化特征
網(wǎng)頁由各種版塊構成，雖然網(wǎng)頁內容各異，但都是由一些基本版塊組成，包括Logo、導航條、Banner、內容版塊、版尾等［4］。伴隨數(shù)字媒體技術的發(fā)展，網(wǎng)頁因其動態(tài)化、交互性及參與性的特點吸引越來越多的瀏覽者觀看。這主要就是利用網(wǎng)頁信息的動態(tài)更新和即時交互性，達到引導瀏覽、吸引瀏覽、增強參與性、互動性的目的。網(wǎng)頁信息的每一次更新，都需要設計者根據(jù)網(wǎng)站的主題、作用及各內容版塊，配合網(wǎng)站不同階段的主題［5］，以及用戶反饋信息進行有效及時的更新，更新過程中還需要對設計方案進行調整與修改，以便滿足不同階段人們對網(wǎng)頁的審美需求。
5．色彩運用得當
色彩在任何的設計中都有著舉足輕重的地位，運用色彩的基本原則可以總結為“總體協(xié)調，局部對比”。人們總會被鮮艷的色彩而吸引，在網(wǎng)頁設計中色彩搭配要從整體性出發(fā)，先確定主題色調，再進行上下級頁面以及各欄目的色彩搭配。通過合理變換局部設計色彩與整體版式主色調協(xié)調統(tǒng)一，以及通過不同色調來劃分不同的網(wǎng)頁內容或欄目等，都是網(wǎng)頁設計中運用色彩提升瀏覽者關注度的一種方式。
二、網(wǎng)頁設計中各元素的版式編排關系
(一)視覺要素在網(wǎng)頁中的版式編排關系
網(wǎng)頁作為瀏覽者獲取信息的重要途徑，首先，要讓瀏覽者對觸目所及的信息有全面的了解，節(jié)省思考或查找的時間，也就是要求網(wǎng)頁的版面設計能夠具備主題明確、信息有序、構圖合理等特點，以便瀏覽者迅速掌握相關信息。
1．網(wǎng)頁版式設計中的色彩要素
色彩可以對人們的心理產生相應的影響，比如人們常見的交通信號燈，“紅燈停，綠燈行”已經成為人們的基本認知。在互聯(lián)網(wǎng)中，色彩對人們的心理聯(lián)想作用依然存在，比如，看到明快的黃色會想到食品網(wǎng)站，看到厚重的綠色會想到環(huán)保網(wǎng)站等?；诖?，在網(wǎng)頁的版式設計中可以恰當?shù)匕l(fā)揮背景色、基本色、主色等的心理聯(lián)想作用，配以圖形、文字、動畫等各種網(wǎng)頁元素，統(tǒng)籌兼顧地圍繞網(wǎng)站主題突出效果。從而使網(wǎng)頁展現(xiàn)出或清新、或前衛(wèi)、或古樸、或穩(wěn)重的特點，讓瀏覽者能夠較快地感受到網(wǎng)頁所展現(xiàn)的主題，同時大面積的色彩運用還能夠起到劃分版塊的作用，使網(wǎng)頁上的內容主次分明，主題更加明確。
2．網(wǎng)頁版式設計中的文字要素
網(wǎng)頁中的導航條、Banner、主標題、副標題、文章內容及廣告語等文字元素［6］，是瀏覽者獲得信息的主要來源。因此，在網(wǎng)頁設計中應更注重文字的字體、字號、文字樣式等的編排。通過風格迥異的字體及各級標題字體大小的設置讓網(wǎng)頁內容顯得更有活力，同時通過各級標題內容字體大小的區(qū)別，也可以讓網(wǎng)頁顯得更具有條理性。比如，網(wǎng)頁中廣告部分的內容文字就可以設計成一些藝術字體，使其更加的醒目，也可適當?shù)丶尤胍恍┝Ⅲw、動畫等效果增加關注度;在網(wǎng)頁正文內容的編排上就需要應用易讀、易識別的印刷字體，同時用心規(guī)劃各版塊內容文字的行距、字距等版式關系，使瀏覽者不會因為文字過多而產生厭棄感或閱讀障礙。
3．網(wǎng)頁版式設計中的圖形要素
圖形是人類早期用于交流和記錄的載體，現(xiàn)代社會由于生活節(jié)奏不斷加快，人們更愿意通過圖形來接受和表達信息。純文字語言構成的網(wǎng)頁已經遠遠不能滿足瀏覽者的實際要求，也無法對網(wǎng)站本身做出有效的宣傳及展示作用?？v觀各大網(wǎng)站的網(wǎng)頁都在根據(jù)自身網(wǎng)站的主營特點進行圖形化的處理，比如，資訊類站點考慮到主要功能在于瀏覽信息，所以圖片數(shù)量可以少而精;而企業(yè)宣傳網(wǎng)站就應選擇使用大量變化多樣的圖形，以期對企業(yè)起到較好的宣傳作用;一些主題網(wǎng)站的文字導航條以及各類功能按鈕為了讓瀏覽者更直觀、快速地了解信息內容也都進行了圖形化處理。
(二)網(wǎng)頁版式設計中的編排原理要素
在網(wǎng)頁的版式設計當中，其包含在內的文字、圖形、鏈接、按鈕等都需要進行版式編排。首先，利用視覺的整體性突出網(wǎng)頁設計的中心主體，可以利用一些圖形、線條、字體及顏色進行區(qū)分，中心主體的體現(xiàn)主要來自于版式編排的主次分明、邏輯清晰，比如網(wǎng)頁中主體內容與背景色的關系、內容中主要內容和次要內容的關系等。其次，考慮到瀏覽者視線移動的多變性，可將網(wǎng)頁主要分為“國”字型、T型、標題正文型、左右框架型、封面型、變化型等類型。再通過視覺流程的多樣化運動過程使得網(wǎng)頁版式結構變化更加多樣［7］。再次，要遵循版式設計中視覺的移動規(guī)律、視覺的錯視和視覺生理心理等，提升網(wǎng)頁設計的視覺效果使之能被更多的瀏覽者所喜愛。
(三)網(wǎng)頁版式設計的形式美法則
網(wǎng)頁從根本上來說是由字符、線條、色彩、空白、圖片、符號等元素組合起來的供瀏覽者獲取信息的頁面，即網(wǎng)頁中的視覺元素都是點、線、面、體的構成形態(tài)。其在應用過程中大多是根據(jù)內容的主次關系來有針對性地使用形式美的法則，通過黃金比例分割、對比調和、節(jié)奏與韻律等手法使網(wǎng)頁在視覺上給瀏覽者以整體、秩序、層級清晰的感受。比如，可以利用人們視覺流程中的最佳視域作為中心來凸顯主體要素，構成多視點、多層次的多維立體網(wǎng)頁空間，使網(wǎng)頁的視覺元素與識別符號更整體、更和諧、有效地傳達信息，深化網(wǎng)頁的媒介性和變化性。
三、結語
互聯(lián)網(wǎng)的飛速發(fā)展使人們越來越重視網(wǎng)頁設計的視覺效果，可以說網(wǎng)頁的美觀與否，與其版式設計有著直接的關聯(lián)。因此，在進行網(wǎng)頁設計時，設計者需要遵循版式設計的原則，合理運用版式設計方法，協(xié)同視覺語言、圖形語言及視覺因素原理的應用，設計出更加突出主題、生動有趣、視覺沖擊力強的優(yōu)秀網(wǎng)頁。
【參考文獻】
［1］薛文勇．淺談網(wǎng)頁設計中的版式設計［J］．西部皮革，2017(18):79．
［2］陳江龍．淺談平面設計中版式設計的構成與應用［J］．大眾文藝，2011(2):73．
［3］樊歆．版式設計在網(wǎng)頁藝術設計中的分析［J］．遼寧絲綢，2017(4):40－41．
作者：張帆 單位：哈爾濱職業(yè)技術學院