設(shè)計(jì)字體時(shí)的一此小技巧(3)

影響文字外觀的因素?zé)o外乎是字體，字號(hào)，對(duì)齊方式，樣式，字間距，行高，行寬。

（一）字體 font-family

字體有：字庫(kù)字體和創(chuàng)意字。

字庫(kù)字體分：襯線字體和無(wú)襯線字體。

襯線字體有設(shè)計(jì)感和裝飾感，一般用于正文，對(duì)于英文字母筆畫(huà)末端的裝飾線有助于引導(dǎo)讀者的視線。

無(wú)襯線字體簡(jiǎn)約時(shí)尚，不帶感情色彩，一般用于標(biāo)題。

最受歡迎的字體：Georgia Arial Verdana Lucida Helvetica Times New Roman

網(wǎng)頁(yè)常用中文字體：微軟雅黑 黑體 宋體 <h1 style="font-family:Microsoft YaHei,SimHei,SimSun";>

IOS7系統(tǒng)的默認(rèn)字體：helvetica neue LT Heiti SC（中文字體）

安卓系統(tǒng)的默認(rèn)字體：DroidSansFallback ，效果類似微軟雅黑

注：1我們只能控制輸入端，不能控制輸出，對(duì)于window系統(tǒng)下的IE6瀏覽器一般用戶只有宋體，且渲染出來(lái)很屎，樓主不知如何解決。

2字體抗鋸齒技術(shù)：目前較實(shí)用的是CSS3中的font-smooth和@font-face新特性。

創(chuàng)意字：是在原有字庫(kù)字體的基礎(chǔ)上做變化，一般用于logo和海報(bào)，在界面上以圖片的方式呈現(xiàn)。

方式：ps：在字體圖層上右鍵選擇“轉(zhuǎn)化為圖形”—點(diǎn)擊“轉(zhuǎn)換點(diǎn)工具”更改文字錨點(diǎn)。如下圖

AI：點(diǎn)擊字體右鍵“創(chuàng)建輪廓”-更改錨點(diǎn)，如下圖

（二）字號(hào) font-size

利用字體大小制造對(duì)比是文字排版中常見(jiàn)的手法。表現(xiàn)視覺(jué)沖擊力，表現(xiàn)層級(jí)關(guān)系。

標(biāo)題字號(hào)：一般為18~29px

正文字號(hào)：一般為12~14px，13px最佳

標(biāo)題B和正文Z的最佳比例為：B=2Z

（三）對(duì)齊方式 text-align

原則：確保字行邊緣保持平整，不要擾亂讀者視線。

一般在CSS中無(wú)法自動(dòng)控制，需要手動(dòng)調(diào)整。

（四）樣式

這里把顏色，陰影，漸變，抗鋸齒預(yù)設(shè)等統(tǒng)稱在樣式里，一般會(huì)用不同的樣式表強(qiáng)調(diào)，因?yàn)闆](méi)有過(guò)多的規(guī)范，所以不贅述。

值得一提的是在網(wǎng)頁(yè)設(shè)計(jì)中經(jīng)常把正文字體設(shè)為宋體 12pt 抗鋸齒預(yù)設(shè)為：無(wú)

（五）字間距 word-spacing letter-spacing

（六）行高 line-height

行高也受字體，字號(hào)，字體粗細(xì)，字體樣式，行寬，字間距等的影響。

一般 行高=字號(hào)大小+2~5px

行高/正文字號(hào)=1.5

（七）行寬 max-width

太長(zhǎng)會(huì)疲勞，太短會(huì)分散注意力。一般一行字的字?jǐn)?shù)為40~80,65最佳

一般：行高/行寬=28