網頁設計中字體的應用范文

本站小編為你精心準備了網頁設計中字體的應用參考范文，愿這些范文能點燃您思維的火花，激發您的寫作靈感。歡迎深入閱讀并收藏。

摘要：

本文介紹了字體的五種分類，分別從創意性和實用性兩方面總結了網頁設計中字體選擇和排版的經驗，為網頁設計的學習者和工作者提供一定的參考價值。

關鍵詞：

網頁設計；字體；創意性；實用性

我們在做網頁平面設計時一般考慮三個大的方面，一是顏色的搭配要符合網站的風格，二是整體的布局要合理規劃，三就是文字的排版。實際上文字的排版是非常重要也是非常體現網站視覺水平的一大部分。早在2006年，OliverReichenstein寫了一篇名為《WebDesignis95%Typography》[1]的文章用來闡述文字排版對網站設計的重要性，甚至可以說文字本身就是一種完整高效的交互設計。關于這點，許多優秀的網站做出了范例，比如：AWorkingLibrary、BlackAllenDesign還有IA公司（最受歡迎的寫作軟件公司）的網站設計都是杰出的例子。

1、字體的分類

當前有成千上萬種字體，每天還會產生更多，大致可以分為以下六種：Oldstyle：基于手寫體創建，Oldstyle字體都有截線并且小寫字母截線都有角度，所有曲線筆畫都有從粗到戲的過渡變化，粗細變化平緩，這種字體基本上沒有什么顯著的特征，不會影響人們的注意力，所以如果設計時需要的是閱讀者專注于文字本身，可以考慮使用Oldstyle字體。常用的典型Oldstyle字體有TimesNewRoman、Garamond等。

Modern：有截線但是是水平的而且非常細，筆畫粗細對比非常明顯，不符合手寫的規律，強調線完全垂直，外觀很醒目，特別是設置得非常大的時候給人一種冷酷高雅的感覺，這種字體不適合做正文，只適合做標題。經典的Modern字體包括Didot（Vogue雜志用logo）、Bodoni等。Slabserf：最開始制作廣告的人熱衷于Modern字體，并把粗線設置得更粗，后來為了解決看上去像柵欄一樣的問題，將整個字體都加粗，這就出現了粗線對比小很多的Slabserf字體，該字體可讀性較好可以顯示大量文本，但是設置成這種字體后頁面較暗，由于它簡潔直觀經常用在兒童讀物中。典型的字體包括Clarendon、black等。sansserif：無截線字體。Sans在法語中含義是“沒有”，所以sans-serif是沒有截線的意思，也就是整體筆畫整體光滑無棱角，無粗細過渡，該字體給人感覺很親切友好，比如google主頁也將標志也將原有的截線字體改為無截線字體。典型的sans-serif英文字體包括Arial、bold等，中文字體中，微軟雅黑、幼圓等都是這類字體。比較適合用在網頁中文字較多部分，讓瀏覽者獲取大量信息而不至疲勞。

Script：手寫字體。這類字體特點很明顯，一看就是手寫風格，Script字體就像奶油要少用，多用覺得膩，不能將網頁中的大段文字設置成手寫體，而且絕對不能全部設置成大寫。典型的英文通常用SegoeScript，中文的話，行書系列、草書系列的字體等，都可以算作手寫字體。Decorative：裝飾字體。有趣也很特別，可以表達鮮明的情緒，也不能多用，否則讓人感覺不上檔次。無法對其的大小、形狀下一個統一的定論，所以沒有典型字體，在網頁中通常很少用到，除非有特殊的創意性設計。

2、字體選擇的創意性

文字的版式設計，不僅僅局限于信息傳達上的概念，更是一種高尚的藝術表現形式和情感的表達。為了能讓文字的編排風格和畫面主題保持一致選擇何種字體以及幾款字體的組合我們都要多做比較和嘗試。在字體選擇上我們從創意性和實用性兩方面來考慮。創意性在于怎樣選擇字體可以使得文字和主題更好搭配，甚至文字能進一步突出主題，表達網站的目的，為此本文總結了幾種不同字體的試用范圍供大家參考。

1）中文字體－黑體。包括但不局限微軟雅黑、方正蘭亭黑體、蒙特簡黑、造字工房黑體。此種黑體的藝術風格為：方正、簡潔、醒目。試用范圍：粗黑體字強壯有力有男性特點，適合汽車、手表、建筑、打斗等內容，可作為標題。細黑體字高雅細致，有女性特點，適合服裝、化妝品、食品等行業內容，也可作為正文使用。

2）中文字體－宋體。包括但不局限于方正書宋、方正標宋、方正宋黑、創意簡標松、造字工房尚雅宋體。它的藝術風格為端莊、典雅、清正、秀麗。適用范圍為政府行業、文化藝術等。根據實際情況運用于時尚類設計、飲食文化、養生生活等。

3）中文字體－幼圓。包括有方正準圓簡體、方正細園簡體、造字工房悅圓體和造字工房雅圓體等。藝術風格細長細膩，不太適合用在比較嚴肅和正式的場合。

4）中文字體－書法體。包括方正楷體、方正隸書、方正魏碑簡體、葉根友毛筆行書等。此字體書法韻味濃厚，帶有書卷味、古色古香。適用于中國風頁面，不適合大篇幅使用。

5）英文字體－無截線字體。包括Arial、Tahoma、Helvetica等。這種字體給人一種簡單、現代化、休閑輕松的感覺。適用于扁平化設計，也適合搭配任何設計項目，包括banner、平面設計以及網頁字體等。

6）英文字體－modern字體。包括Didot、TheTimesnewroman、Georgia等。此種字體風格優雅又精致，可用于電影海報、游戲、時尚類網頁設計中。

7）英文字體－vv手寫英文字體。有Exmouth、Italianno等。此種字體飄逸優雅，適用于珠寶、服飾類網站，還可以用于制作一些精美的賀卡、邀請函、婚禮請柬等。

3、字體選擇的實用性

網頁設計中在Banner窗口可以使用一些很有個性的字體，在正文部分要避免使用那些有個性的字體，因為訪客的終端上很可能沒有安裝那些特殊字體，那樣會導致內容無法顯示，所以英文常用的字體也就是TimesNewRoman、Arial和Verdana。在使用中文字體時基本上選擇Windows系統自帶的，包括宋體、楷體或者幼圓，微軟雅黑都是可以的。字體樣式選擇建議：整個版式選擇兩到三種字體為最佳效果，否則會有凌亂感破壞整體效果。一般來說粗字體作標題，細體字作正文。

1）字體的大小選擇在英文網站字體大小選擇上，一般由于英文字母相對漢字來說較簡單，即使是小字體也能顯得很清晰明了，所以大部分英文網站的主要部分都是選擇較小的字體。中文網頁不能照搬那樣的設計，由于字體的復雜度，通常字體大小在10px以下是看不清的，一般要達到11px及以上才有不錯的顯示效果。從現有的中文網站分析，12px和14px大小的宋體結合使用在閱讀性和外觀上是最好的。比10px再小，可閱讀性和美觀性都沒有了。比14px再大，可閱讀性好，但是不夠美觀。字體大小的選擇建議：英文網站字體大小可以選擇10px，11px，12px等字體大小，中文網站字體大小可以選擇12px，14px，16px等字體大小。

2）字體的顏色選擇字體的顏色的選擇對整個網頁的風格影響很大，正文內容部分一般會使用黑色，給人中立的感覺。紅色或者黃色等暖色調能很快吸引訪客的目光，產生熱情、興奮等刺激感，多用在特價、食物等廣告中。而藍色、灰色等冷色調則給人職業、科技、商務等感覺，多用在機械、風景等頁面中。

3）字體其他的特性選擇除了以上概括的網頁字體樣式，大小，顏色外，當然字體還可以設置其他的各種特性比如斜體、粗體、下劃線，對齊方式等。字體選擇是一種很直接、感性的行為。無論選擇什么字體，都要把握網頁的總體風格滿足訪客的需要。比如粗體字強壯有力具有男性特點，適合機械、科技、建筑業等內容；細體字典雅華貴偏向女性特質，更適合化妝品、服裝、時尚等行業的內容。同一頁面中，如果字體種類少，就會顯得版面雅致有穩定感；如果字體種類多，則版面活潑豐富多彩。關鍵是如何根據頁面想要表達的內容來控制比例關系。

4、結束語

網頁設計不僅僅是一種技術，更是一種藝術，其中如何選擇字體，如何排版文字是非常重要的一個部分。只有正確的使用了字體才能讓瀏覽者感受到其中要傳達出的內涵與情感，獲得設計者想要表達的信息。

參考文獻

[1]OliverReichenstein.WebDesignis95%Typography[J],UIdesign,2006(10):56-60

[2]張巖.網頁設計中扁平化設計的趨勢[J],美術大觀,2014,(5):132-133.

[3]鄧美玲,李丹.Photoshop在網頁設計中的作用[J],電子技術與軟件工程,2015,(04):110-110.

[4]張璐.關于網站網頁設計中的視覺元素分析[J],科技風,2014(14):48-49.

[5]劉莎.網頁設計中字體設計分析[J],網友世界,2013(22):12-13

[6]李玉榮.淺談網頁設計中的文字設計[J],科技創新與應用,2015,(09):65-65.

作者：周倩 單位：長沙商貿旅游職業技術學院