設(shè)計(jì)字體時(shí)的一此小技巧(3)
影響文字外觀的因素?zé)o外乎是字體,字號(hào),對(duì)齊方式,樣式,字間距,行高,行寬。
(一)字體 font-family
字體有:字庫字體和創(chuàng)意字。
字庫字體分:襯線字體和無襯線字體。
襯線字體有設(shè)計(jì)感和裝飾感,一般用于正文,對(duì)于英文字母筆畫末端的裝飾線有助于引導(dǎo)讀者的視線。
無襯線字體簡(jiǎn)約時(shí)尚,不帶感情色彩,一般用于標(biāo)題。
最受歡迎的字體:Georgia Arial Verdana Lucida Helvetica Times New Roman
網(wǎng)頁常用中文字體:微軟雅黑 黑體 宋體 <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瀏覽器一般用戶只有宋體,且渲染出來很屎,樓主不知如何解決。
2字體抗鋸齒技術(shù):目前較實(shí)用的是CSS3中的font-smooth和@font-face新特性。
創(chuàng)意字:是在原有字庫字體的基礎(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ì)比是文字排版中常見的手法。表現(xiàn)視覺沖擊力,表現(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中無法自動(dòng)控制,需要手動(dòng)調(diào)整。
(四)樣式
這里把顏色,陰影,漸變,抗鋸齒預(yù)設(shè)等統(tǒng)稱在樣式里,一般會(huì)用不同的樣式表強(qiáng)調(diào),因?yàn)闆]有過多的規(guī)范,所以不贅述。
值得一提的是在網(wǎng)頁設(shè)計(jì)中經(jīng)常把正文字體設(shè)為宋體 12pt 抗鋸齒預(yù)設(shè)為:無
(五)字間距 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
- 相關(guān)教程
- TA的教程
- 收藏
- 返回
- 平面設(shè)計(jì)
- 字體技巧
- 原創(chuàng)
- 自譯教程
- 平面設(shè)計(jì)教程
學(xué)習(xí) · 提示
相關(guān)教程