聯系我(wǒ)(wǒ)們 | 選号中(zhōng)心 | 招賢納士
廣商(shāng)網絡科技LOGO
專題報道

網站中(zhōng)的文字排版

信息來源:廣商(shāng)網絡科技    信息發布:admin    發布時間:2016-03-01 11:54:26


排版是個大(dà)學問,網站上每一(yī)個元素都能影響浏覽,排版設計的好壞絕對能考驗一(yī)個設計師的基本功底,而文字排版是将文字原稿,依照設計要求,組成規定版式的工(gōng)藝。書(shū)籍、雜(zá)志(zhì)等書(shū)版印刷物(wù)就是以文字排版爲基礎的,文字排版對于網站建設來說十分(fēn)重要。尤其是一(yī)個非創意性質的網頁,最重要的内容就是文字,文字的排版需要考慮文字辨識度和頁面易讀性,好排版一(yī)定有着比較棒的閱讀性,文字内容在視覺上是平衡和連貫的,并且有整體(tǐ)的空間感。布局、内容擺放(fàng)和欄目設計都會影響文字的閱讀性。從易讀性來看,需要設計師考慮字體(tǐ)、字号、行距、背景色與文字顔色對比等因素。

1.字體(tǐ)的選擇

如何選擇合适的字體(tǐ),才切合實際。解決這個問題,我(wǒ)(wǒ)們先應該知(zhī)道爲什麽要糾結于選擇字體(tǐ)這個問題。字體(tǐ)選擇存在實用性和創意性這兩個方面的因素。創意性很好理解,就是想突破常規,配合自己的網頁中(zhōng)的設計思想而選擇相應的字體(tǐ),例如表達程序員(yuán)的思維,就對代碼使用等寬字體(tǐ),表達恐怖、古典,使用哥特式字體(tǐ)等等。這點自己去(qù)找字體(tǐ)好了,不再贅述。最主要的問題是在于實用性的方面。

實用性方面,即不需要太過于華麗的字體(tǐ),隻需要大(dà)家看的都舒服、稍微帶點自己的特色即可。浏覽器解析字體(tǐ)的過程實際上是這樣的,當浏覽器加載CSS後,解析到有關字體(tǐ)的樣式,它會在你的系統中(zhōng)查找這個字體(tǐ),隻有找到了相應的字體(tǐ)文件,才會根據那個字體(tǐ)文件對網頁中(zhōng)的文字進行渲染,顯示出你想要的效果。

如果你的操作系統中(zhōng),并沒有安裝網頁中(zhōng)定義的那種字體(tǐ),就無法渲染出那種字體(tǐ)的效果,而通常使用當前系統的默認字體(tǐ)來渲染。那麽你原有的設計,就不行了,你設計時覺得挺好,字體(tǐ)、位置、大(dà)小(xiǎo)合适,但在别人的電(diàn)腦上,清一(yī)色的宋體(tǐ)。所以這個問題,才是選擇字體(tǐ)的難處所在。

針對以上問題的解決方式就是使用經典通用字體(tǐ),不同操作系統都有不同的字體(tǐ)系統,但既然是字體(tǐ),總有一(yī)些比較經典老牌的字體(tǐ)共同存在于各個系統中(zhōng)。例如無襯線的 Arial 字體(tǐ),它産生(shēng)的時間比較早,同時價格低廉,所以從早期就被 windows 操作系統使用,在其他的操作系統中(zhōng),也會有較好的不同于默認字體(tǐ)的顯示效果。

2.字号大(dà)小(xiǎo)

字号大(dà)小(xiǎo)可以用不同的方式來計算,例如磅(Point)或像素(Pixel)。因爲以像素技術爲基礎單位打印時需要轉換爲磅,所以,建議采用磅爲單位。最适合于網頁正文顯示的字體(tǐ)大(dà)小(xiǎo)爲12磅左右,現在很多的綜合性站點,由于在一(yī)個頁面中(zhōng)需要安排的内容較多,通常采用9磅的字号。較大(dà)的字體(tǐ)可用于标題或其他需要強調的地方,小(xiǎo)一(yī)些的字體(tǐ)可以用于頁腳和輔助信息。需要注意的是,小(xiǎo)字号容易産生(shēng)整體(tǐ)感和精緻感,但可讀性較差。

3.行距的變化

行距的變化也會對文本的可讀性産生(shēng)很大(dà)影響。一(yī)般情況下(xià),接近字體(tǐ)尺寸的行距設置比較适合正文。行距的常規比例爲10:12,即用字10點,則行距12點。這主要是出于以下(xià)考慮:适當的行距會形成一(yī)條明顯的水平空白(bái)帶,以引導浏覽者的目光,而行距過寬會使一(yī)行文字失去(qù)較好的延續性。除了對于可讀性的影響,行距本身也是具有很強表現力的設計語言,爲了加強版式的裝飾效果,可以有意識地加寬或縮窄行距,體(tǐ)現獨特的審美意趣。例如,加寬行距可以體(tǐ)現輕松、舒展的情緒,應用于娛樂性、抒情性的内容恰如其分(fēn)。另外(wài),通過精心安排,使寬、窄行距并存,可增強版面的空間層次與彈性,表現出獨到的匠心。

4.文字留白(bái)

在排版文字時,在版面需要留出空餘空間,留白(bái)面積從小(xiǎo)到大(dà)應該遵循的順序是:字間距、行間距、段間距。此外(wài),在排版内容區之前,需要根據頁面實際情況給頁面四周留出餘白(bái)。

5.文字背景

白(bái)色是全頻(pín)光,全放(fàng)射光對人眼睛的最有刺激,所以很多印刷品讀物(wù)的紙(zhǐ)張都選用乳白(bái)色或者淡黃色的紙(zhǐ)張。由于顯示器本身就發光,所以同是純白(bái)色背景的文字,在電(diàn)腦上比在紙(zhǐ)上閱讀會使眼睛更容易疲乏,另有研究表明:在電(diàn)腦上閱讀隻有在紙(zhǐ)上閱讀速度的78%,閱讀效率大(dà)大(dà)減低。因此,爲了提高頁面浏覽的舒适度和效率,越來越多的頁面采用淺灰色和淡黃色做爲頁面背景。另外(wài),印刷品以文字爲主的出版物(wù)往往會采用低光澤度的紙(zhǐ)張,也是因爲光澤度高的紙(zhǐ)張反射度高,導緻閱讀質量下(xià)降,容易使人視覺疲勞。

6.文字的整體(tǐ)編排  

頁面裏的正文部分(fēn)是由許多單個文字經過編排組成的群體(tǐ),要充分(fēn)發揮這個群體(tǐ)形狀在版面整體(tǐ)布局中(zhōng)的作用。從藝術的角度可以将字體(tǐ)本身看成是一(yī)種藝術形式,它在個性和情感方面對人們有着很大(dà)影響。在網頁設計中(zhōng),字體(tǐ)的處理與顔色、版式、圖形等其他設計元素的處理一(yī)樣非常關鍵。從某種意義上來講,所有的設計元素都可以理解爲圖形。

7.文字對比

文字對比可以分(fēn)爲三類,主要是标題與正文的字體(tǐ)與字号對比、文字顔色對比,以及文字顔色與背景顔色的對比。在标題與正文對比中(zhōng),标題使用18号的微軟雅黑,正文使用12号的宋體(tǐ),兩種字體(tǐ)字号的對比讓文字内容富有層次,很容易吸引讀者眼球。文字顔色對比方面,一(yī)部分(fēn)文字采用了與主要文字不同的另一(yī)種顔色,這種對比是增加視覺效果的有效途徑之一(yī),突出展示了段落的重點,這是非常常用的一(yī)種文字排版設計方式。而正文文本與背景合适的對比可以提高文字的清晰度,産生(shēng)強烈的視覺效果。白(bái)色背景、紅色标題、黑色正文的對比,以及紅色背景與白(bái)色文字對比的應用,将文字内容清晰襯托出來,既有豐滿的層次感,同時有具有很強的視覺沖擊力。


        




上一(yī)篇:企業網站建設都需要注意哪些問題

下(xià)一(yī)篇:網站建設發展趨勢


廣商(shāng)網絡科技LOGO
背景線

業務郵箱:286889048@qq.com

地址:長春市西安大(dà)路與普陽街交彙華爾茲大(dà)廈2棟6門


 


.....................................................................................................Copyright 廣商(shāng)科技 All Rights Reserved 版權所有 舉報專線:13244308262....................................................................................................