每天都在用的“黑體”,原來這么排版才好看!

2021-8-19    seo達(dá)人

圖片

漢字的黑體是依據(jù)西文無襯線體特點(diǎn)所創(chuàng)造,黑體起初只有一種筆畫粗細(xì)度,由于漢字筆劃多,這會(huì)導(dǎo)致小字清晰度較差,所以一開始主要用于標(biāo)題設(shè)計(jì)。

隨著制字技術(shù)的精進(jìn),黑體具有了不同字重和寬窄的字形,讓黑體應(yīng)用領(lǐng)域更為廣泛,無論標(biāo)題、內(nèi)文還是注釋都可以勝任。

圖片

尤其是隨著20世紀(jì)末電腦和互聯(lián)網(wǎng)的普及,黑體字的價(jià)值得到了進(jìn)一步體現(xiàn),它簡(jiǎn)潔的筆畫特征與屏顯介質(zhì)特性相符,從而成為了當(dāng)今各種屏幕媒介中最有發(fā)展前景的字體。

圖片

黑體高度的統(tǒng)一性,可以讓字體本身對(duì)眼睛刺激降到最低,而把更多的注意力放在文字表達(dá)的內(nèi)容上,特別適合段落性文字的編排,成為正文使用的首選字體。因?yàn)檎膹?qiáng)調(diào)的是字體“讀”的功能性,為正文選擇黑體可以讓讀者輕松舒適地進(jìn)行閱讀,專注于文字所表達(dá)的內(nèi)容。

圖片

圖片

各大字庫(kù)也開發(fā)有各有特點(diǎn)的黑體,其中免費(fèi)商用的有:思源黑體、阿里巴巴普惠體、OPPOSans、鴻蒙字體。

圖片

在黑體基礎(chǔ)上又衍生出很多字體,這里推薦的是部分可以免費(fèi)商用的黑體:

圖片

 

黑體的使用場(chǎng)景

簡(jiǎn)潔和規(guī)矩的黑體在氣質(zhì)上沒有太大的個(gè)性,它適用的范圍比較大,可塑性很強(qiáng),通過字形的變化,可以表現(xiàn)出不同的氣質(zhì)。

 

現(xiàn)代、科技

黑體簡(jiǎn)潔干練和幾何化結(jié)構(gòu)的筆畫特征,呈現(xiàn)出強(qiáng)烈的現(xiàn)代感,適合表現(xiàn)科技、未來感相關(guān)的情景。(如電子、科技、互聯(lián)網(wǎng)等行業(yè))

圖片

圖片

 

正式、嚴(yán)謹(jǐn)

黑體是極具理性風(fēng)格的字形,沒有明顯情緒導(dǎo)向也讓黑體給人一種中立客觀的印象,適用運(yùn)用在各種正式、嚴(yán)謹(jǐn)和體現(xiàn)安全信賴感的場(chǎng)景。(如政府、企業(yè)、醫(yī)療行業(yè)等)

圖片

圖片

 

醒目、沖擊力

較粗的黑體強(qiáng)壯有力顯得十分醒目,還具有很強(qiáng)的視覺沖擊力,常用于促銷頁(yè)面,口號(hào)式的標(biāo)題配上粗黑體才夠力道。

圖片

圖片

 

渾厚、力量

粗黑體渾厚穩(wěn)重,具有力量感,適合運(yùn)用在運(yùn)動(dòng)、工業(yè)等設(shè)計(jì)領(lǐng)域。還有著有男性傾向,常用在體現(xiàn)男性產(chǎn)品的設(shè)計(jì)中。

圖片

圖片

 

高雅、精致

筆畫較細(xì)的黑體結(jié)構(gòu)清晰,沒有過多的裝飾,顯得簡(jiǎn)約、高雅而精致,有著女性特點(diǎn),適合運(yùn)用在服裝、化妝品等行業(yè)。

圖片

圖片

 

黑體的搭配實(shí)操

案例一

使字體搭配協(xié)調(diào)的一個(gè)基本原則就是選擇風(fēng)格相近的字體。使用同一字族里的字體進(jìn)行搭配,是最簡(jiǎn)單、安全的搭配方法。本次案例使用思源黑體進(jìn)行搭配示范。通過字體的大小、粗細(xì)形成閱讀的層次感。

圖片

西文選擇與黑體風(fēng)格統(tǒng)一的無襯線體“Univers”,粗細(xì)盡量和中文相一致。

圖片

編排效果:

圖片

 

案例二

第二個(gè)案例進(jìn)行一個(gè)運(yùn)動(dòng)文案的編排示范。帶有強(qiáng)烈動(dòng)感的書法體,搭配具有力量感的黑體,非常適合運(yùn)用在一些要體現(xiàn)激情活力的運(yùn)動(dòng)、游戲、舞蹈等設(shè)計(jì)主題,硬朗的黑體與柔和的書法體能夠產(chǎn)生強(qiáng)烈的對(duì)比效果。

圖片

西文則選擇與黑體風(fēng)格統(tǒng)一的無襯線體。注意根據(jù)書法字的結(jié)構(gòu)和筆勢(shì)進(jìn)行排版,通過對(duì)文字大小、位置的調(diào)整,讓文字看起來更緊密也更有節(jié)奏感。

圖片

也可以選用與書法體風(fēng)格匹配的西文手寫體進(jìn)行搭配:

圖片

 

案例三

第三個(gè)案例進(jìn)行一個(gè)時(shí)尚女裝文案的設(shè)計(jì)示范。本案例選擇較細(xì)的黑體和宋體進(jìn)行搭配,字形形成了微妙的對(duì)比,兩款字體都有著高雅、精致的氣質(zhì),運(yùn)用在具有女性時(shí)尚特征的設(shè)計(jì)中相得益彰。

圖片

西文則選擇和黑體相對(duì)應(yīng)的無襯線體、宋體相對(duì)應(yīng)的襯線體進(jìn)行搭配。

圖片

編排效果:

圖片

如果感覺排版太過于規(guī)矩,可以嘗試加入手寫體加強(qiáng)字形對(duì)比,打破呆板感,營(yíng)造更強(qiáng)烈的動(dòng)感。

圖片

黑體無論是識(shí)別性、適用面、視覺效果都非常好,新手使用也不容易犯錯(cuò),缺點(diǎn)是個(gè)性不足,用得不好會(huì)顯得平庸。用好黑體是現(xiàn)代設(shè)計(jì)師必須具備的基本功,需要大家不斷練習(xí)來掌握黑體字的使用技巧。

 

原文地址:藝海拾貝Design(公眾號(hào))

作者:鄧海貝


轉(zhuǎn)載請(qǐng)注明:學(xué)UI網(wǎng)》每天都在用的“黑體”,原來這么排版才好看!



藍(lán)藍(lán)設(shè)計(jì)建立了UI設(shè)計(jì)分享群,每天會(huì)分享國(guó)內(nèi)外的一些優(yōu)秀設(shè)計(jì),如果有興趣的話,可以進(jìn)入一起成長(zhǎng)學(xué)習(xí),請(qǐng)掃碼藍(lán)小助,報(bào)下信息,藍(lán)小助會(huì)請(qǐng)您入群。歡迎您加入噢~~希望得到建議咨詢、商務(wù)合作,也請(qǐng)與我們聯(lián)系。

截屏2021-05-13 上午11.41.03.png

分享此文一切功德,皆悉回向給文章原作者及眾讀者.
免責(zé)聲明:藍(lán)藍(lán)設(shè)計(jì)尊重原作者,文章的版權(quán)歸原作者。如涉及版權(quán)問題,請(qǐng)及時(shí)與我們?nèi)〉寐?lián)系,我們立即更正或刪除。

藍(lán)藍(lán)設(shè)計(jì)www.bouu.cn )是一家專注而深入的界面設(shè)計(jì)公司,為期望卓越的國(guó)內(nèi)外企業(yè)提供卓越的UI界面設(shè)計(jì)、BS界面設(shè)計(jì) 、 cs界面設(shè)計(jì) 、 ipad界面設(shè)計(jì) 、 包裝設(shè)計(jì) 、 圖標(biāo)定制 、 用戶體驗(yàn) 、交互設(shè)計(jì)、 網(wǎng)站建設(shè) 平面設(shè)計(jì)服務(wù)






分享本文至:

日歷

鏈接

個(gè)人資料

存檔