淺析網(wǎng)頁視覺設(shè)計(jì)中的文字

孫宇嬌

(北京交通大學(xué)建筑與藝術(shù)學(xué)院，北京 100044)

?

淺析網(wǎng)頁視覺設(shè)計(jì)中的文字

孫宇嬌

(北京交通大學(xué)建筑與藝術(shù)學(xué)院，北京 100044)

摘要：從20世紀(jì)90年代至今短短的20多年，中國已經(jīng)成為第二個(gè)互聯(lián)網(wǎng)大國。隨著信息載體的不斷改進(jìn)，如今的網(wǎng)頁便成了重中之重，除了傳統(tǒng)的視覺設(shè)計(jì)特征外，它還具備了許多其他方面的優(yōu)勢(shì)，雖然發(fā)展時(shí)間不長(zhǎng)，但卻為當(dāng)今社會(huì)信息的傳遞提供了一個(gè)至關(guān)重要的途徑。同時(shí)，視覺設(shè)計(jì)是人們生活中不可缺少的部分，文字設(shè)計(jì)是將信息可視化的重要切入點(diǎn)。本文將從網(wǎng)頁視覺設(shè)計(jì)中的文字入手，通過探討當(dāng)今的網(wǎng)頁視覺設(shè)計(jì)，并深入研究網(wǎng)頁中的文字，從而提煉出網(wǎng)頁設(shè)計(jì)中文字設(shè)計(jì)的精華。

關(guān)鍵詞：網(wǎng)頁；視覺設(shè)計(jì)；文字

1引言

美是生活中必不可少的元素，近年來，隨著互聯(lián)網(wǎng)的發(fā)展和審美觀念的提升，網(wǎng)頁設(shè)計(jì)的視覺感也越來越受到人們的重視。但是，目前大多數(shù)網(wǎng)頁的設(shè)計(jì)缺少美感，元素混亂，沒有創(chuàng)意，因此，網(wǎng)頁設(shè)計(jì)師需要從視覺設(shè)計(jì)的實(shí)用審美主義原則出發(fā)，設(shè)計(jì)出主題突出、視覺效果舒適、內(nèi)容傳達(dá)精準(zhǔn)，同時(shí)具有一定藝術(shù)表現(xiàn)力的網(wǎng)頁。

縱觀當(dāng)前的網(wǎng)頁頁面，文字是是頁面中最主要的信息來源，傳達(dá)的信息最讓人一目了然、最容易讓瀏覽者理解和接受。要想讓觀者最大程度地接收到網(wǎng)頁上的信息，頁面中的文字占有的面積要遠(yuǎn)遠(yuǎn)居于首位。網(wǎng)頁中文字的設(shè)計(jì)同樣要符合視覺設(shè)計(jì)的基本原則，但在內(nèi)容設(shè)計(jì)上又有很多不同之處。下面筆者將從網(wǎng)頁中文字的設(shè)計(jì)出發(fā)，做出具體分析。

2文字元素的應(yīng)用

文字源于生活，是人類生產(chǎn)和實(shí)踐的產(chǎn)物，在人類的信息傳達(dá)和交流中，文字是最普遍使用的視覺符號(hào)。[1]對(duì)于網(wǎng)頁設(shè)計(jì)而言，文字對(duì)傳遞信息起到了非常重要的作用，觀者會(huì)通過頁面上的文字來接收網(wǎng)頁表達(dá)的信息。所以，文字所體現(xiàn)的視覺感直接影響著頁面的整體效果。當(dāng)然，要想準(zhǔn)確地傳達(dá)出頁面上的信息，必須要考慮到文字整體編排的效果，讓觀者一目了然，從而提高網(wǎng)頁的訴求力。

3文字編排設(shè)計(jì)方面的問題

網(wǎng)頁設(shè)計(jì)同傳統(tǒng)的平面設(shè)計(jì)有許多相似的地方，但是印刷的產(chǎn)品有固定的規(guī)格，而網(wǎng)頁的尺寸則可以由觀者來控制，因此，網(wǎng)頁與平面書籍之類的排版又有許多不同之處。設(shè)計(jì)師不能做到去精準(zhǔn)地控制網(wǎng)頁里所有元素的具體規(guī)格和位置，這就要求在設(shè)計(jì)時(shí)必須做到明確、精準(zhǔn)，不能影響信息的有效傳遞。

網(wǎng)頁中的文字一般都占有很大的比例，文字設(shè)計(jì)的效果對(duì)整個(gè)網(wǎng)頁的視覺感至關(guān)重要。網(wǎng)頁文字的主要功能是傳遞各種信息，網(wǎng)頁設(shè)計(jì)師的任務(wù)就是在保證信息的傳遞性的同時(shí)最大限度的提升網(wǎng)頁的視覺美感，想要達(dá)到理想的效果,首先則必須考慮文字編輯的整體效果,完成其功能與視覺感的統(tǒng)一。[2]但是，很多設(shè)計(jì)師在設(shè)計(jì)時(shí)忽略了文字的作用，刻意地去關(guān)注版式設(shè)計(jì)，從而導(dǎo)致頁面混亂，讓觀者抓不住頁面所傳達(dá)的主要信息。

設(shè)計(jì)師在設(shè)計(jì)網(wǎng)頁中的文字時(shí)要顧全大局，讓人視覺清晰，分清主次，同時(shí)還需注意的是，要提前分析網(wǎng)頁主題，理解其要傳達(dá)的信息的真正含義，并且仔細(xì)分析，確定文字的整體設(shè)計(jì)風(fēng)格，之后就是文字的字號(hào)、字體、裝飾、顏色和布局的設(shè)計(jì)了。

3.1字體與字號(hào)在網(wǎng)頁設(shè)計(jì)中的應(yīng)用

隨著軟件技術(shù)的發(fā)展，現(xiàn)在電腦給我們提供的字體越來越多，但是用于設(shè)計(jì)的字體多了，在設(shè)計(jì)時(shí)如何選擇最為適合的字體也就成了難點(diǎn)。通常情況下，一個(gè)頁面上用到的字體不會(huì)超過4種，而且只有觀者的電腦里安裝了這些字體，才能看到頁面預(yù)期的效果，所以如果使用過多的字體是沒有意義的，不但影響網(wǎng)頁的整體設(shè)計(jì)效果,還會(huì)降低網(wǎng)頁打開的速度。

文字字體的選擇

對(duì)于網(wǎng)頁中的字體，在設(shè)計(jì)時(shí)，我們應(yīng)該選擇與網(wǎng)頁設(shè)計(jì)思想相符合的字體，文字不要過于華麗，舒適即可，例如古典風(fēng)格，應(yīng)該使用哥特式字體等，以免減弱了網(wǎng)頁主題的表達(dá)，除此之外，在設(shè)計(jì)的時(shí)候還要突破常規(guī)，發(fā)揮整體的創(chuàng)意性。

網(wǎng)頁設(shè)計(jì)時(shí)默認(rèn)的字體是宋體，設(shè)計(jì)師可以根據(jù)網(wǎng)頁風(fēng)格的不同，選擇其他合適的字體。在選擇字體的時(shí)候，要考慮到中英文字體間的差異。對(duì)于中英文字體排列問題，見下圖(圖1)：

圖1　四種不同的中英文字體(該圖為筆者分析繪制)

從圖1可以看出，對(duì)于不同排列的中文字體，基本沒有太大的間距變化；而不同英文字體的排列，則會(huì)有較大的變化，除了間距會(huì)改變外，字母的大小也會(huì)有很大的不同，因此，英文的排布容易導(dǎo)致整個(gè)網(wǎng)頁布局的混亂，所以在進(jìn)行中英文排列的時(shí)候一定要根據(jù)字體間的差異精心排布，做到疏密得當(dāng)，沒有窒息感。

文字大小的選擇

px：像素單位，10px表示10個(gè)像素大小，在現(xiàn)在的網(wǎng)頁設(shè)計(jì)中，常被用來表示字體大小。網(wǎng)頁中瀏覽器的默認(rèn)字體大小為16px。[3]同一個(gè)網(wǎng)頁，在不同的設(shè)備上使用時(shí)，所顯示的字體大小也是不同的，電腦的屏幕比較大，視距也比較固定，而手機(jī)的屏幕相對(duì)小很多，所以在設(shè)計(jì)頁面的時(shí)候，要根據(jù)實(shí)際和用戶的使用習(xí)慣來確定字體的大小。

3.2網(wǎng)頁設(shè)計(jì)中文字的色彩及裝飾

網(wǎng)頁中字體色彩的選擇和裝飾效果同樣非常重要。

在進(jìn)行網(wǎng)頁設(shè)計(jì)時(shí)，一般既要求整個(gè)頁面的美觀，又要求整體文字的優(yōu)美流暢，而色彩不僅能使頁面充滿生機(jī)，還能給瀏覽者帶來強(qiáng)烈的視覺沖擊。因此設(shè)計(jì)師在設(shè)計(jì)網(wǎng)頁的時(shí)候，應(yīng)該充分了解色彩的意義、象征以及色彩間的搭配,合理地運(yùn)用色彩，給觀者帶來最佳的視覺效果。

通常來說，網(wǎng)頁中的文字都是白底黑字，或者淺灰色的文字，整體顏色都比較樸素，這樣更符合觀者的喜好。除非是特別有創(chuàng)意的設(shè)計(jì)，不然一定切忌隨意去使用顏色，而且背景和文字一定要用高對(duì)比的顏色，以加強(qiáng)觀者的識(shí)別度。

當(dāng)然，設(shè)計(jì)時(shí)還要盡量避免一些特殊的顏色，尤其是藍(lán)色，藍(lán)色在網(wǎng)頁中代表著超級(jí)鏈接，會(huì)讓人無意識(shí)的想去點(diǎn)擊；再有黃色，因?yàn)辄S色在電子屏上的識(shí)別度很低，很難讓人看清頁面上所要顯示的文字。

對(duì)于文字的裝飾，為了突出文字，可以運(yùn)用少量精心選擇的元素，如果裝飾太多，整個(gè)頁面就會(huì)均勻的呈現(xiàn)，從而失去強(qiáng)調(diào)的意義。

3.3網(wǎng)頁設(shè)計(jì)中文字的布局

網(wǎng)頁頁面的設(shè)計(jì)，是指在一定的平面上根據(jù)主題的要求將所有元素進(jìn)行有序的排列組合。網(wǎng)頁中文字的編排與設(shè)計(jì)，最重要的一點(diǎn)在于要服從信息內(nèi)容的性質(zhì)及特點(diǎn)，并且風(fēng)格要與內(nèi)容特性相吻合，而不是相互脫離，更不能相互沖突。[4]

設(shè)計(jì)者在安排視覺要素時(shí)要結(jié)合點(diǎn)、線、面來分析，把文字和圖像等元素進(jìn)行有序的排布，以達(dá)到有效傳達(dá)信息的效果。“點(diǎn)”在網(wǎng)頁布局中有豐富畫面的作用，同時(shí)在視覺上也表現(xiàn)出一定的張力，其大小和位置的不同，也會(huì)使觀者產(chǎn)生不一樣的視覺體驗(yàn)，“線”是點(diǎn)運(yùn)動(dòng)產(chǎn)生的軌跡，而“面”則是線的運(yùn)動(dòng)所產(chǎn)生的，不論哪個(gè)元素，都有其存在的理由。如果在頁面設(shè)計(jì)中加以點(diǎn)、線、面來精心排布，定會(huì)使觀者有別樣的感受。對(duì)于設(shè)置相對(duì)簡(jiǎn)單的頁面，還可以借助陰影來分割空間，讓所有內(nèi)容在層次上完美展現(xiàn)。

除了整體的布局外，頁面中的文字在排布的時(shí)候也可以借助點(diǎn)、線、面的作用，加強(qiáng)韻律，文字開篇還可以用小色塊來點(diǎn)綴，以引導(dǎo)觀者，但是一定要注意細(xì)節(jié)，點(diǎn)綴不要過于復(fù)雜，以免混淆觀者。

除此之外，節(jié)奏和韻律在頁面布局上的合理運(yùn)用，也會(huì)使文字與文字、文字與圖片或者圖片與圖片在頁面上合理分布,進(jìn)而使整個(gè)頁面疏密有序、錯(cuò)落有致的變化。

4結(jié)語

當(dāng)今社會(huì)是信息占主導(dǎo)的的社會(huì)，是創(chuàng)意的社會(huì)。隨著計(jì)算機(jī)技術(shù)的飛速發(fā)展，網(wǎng)頁制作變得愈發(fā)容易，此時(shí)，網(wǎng)頁的設(shè)計(jì)也就顯得尤為重要。但是，無論技術(shù)怎樣改進(jìn)，設(shè)計(jì)終究萬變不離其中。設(shè)計(jì)師在設(shè)計(jì)時(shí)可以最大限度的發(fā)揮自己的創(chuàng)意，但是設(shè)計(jì)與編排要顧全大局，遵守網(wǎng)頁視覺設(shè)計(jì)的原則，突出頁面主題，抓住文字的重要性。當(dāng)然為了達(dá)到最佳的設(shè)計(jì)效果，設(shè)計(jì)師需要從觀者的角度出發(fā)，反復(fù)分析頁面布局的整體視覺效果,進(jìn)而使觀者享受到最舒適的視覺感，讓未來的網(wǎng)頁更加精彩。

參考文獻(xiàn)：

[1]陳繪.數(shù)字時(shí)代背景下的視覺傳達(dá)設(shè)計(jì)研究[J061].東南大學(xué),2010.

[2]李垚.商用網(wǎng)頁視覺設(shè)計(jì)的現(xiàn)狀及對(duì)策[D].吉林藝術(shù)學(xué)院，2007(25).

[3]如何給你的網(wǎng)頁選擇合適的字體.百度文庫.http://wenku.baidu.com/view/e83262f36294dd88d0d26bff.html.

[4]蘇煥.新媒體環(huán)境下的品牌展示設(shè)計(jì)研究[D].浙江大學(xué)，2005(74).

作者簡(jiǎn)介：孫宇嬌，女，北京交通大學(xué)建筑與藝術(shù)學(xué)院在讀設(shè)計(jì)學(xué)碩士，研究生方向?yàn)閿?shù)字媒體藝術(shù)。

中圖分類號(hào)：TP3

文獻(xiàn)標(biāo)志碼：A

文章編號(hào)：1671-1602(2016)14-0047-02