ui視覺設(shè)計(jì)對字體的選擇技巧：做設(shè)計(jì)的都知道，文字內(nèi)容總是能占到整個(gè)版面將近80%的區(qū)域。因此理解字體與排版對UI設(shè)計(jì)師來說非常關(guān)鍵。不管你是從事網(wǎng)站設(shè)計(jì)、移動(dòng)應(yīng)用程序設(shè)計(jì)、還是可穿戴ui設(shè)計(jì),你的設(shè)計(jì)必須能夠清楚地傳遞出設(shè)計(jì)的意圖和目的。由于文本是基于溝通的目的,所以需要對字體設(shè)計(jì)有著深刻的理解。當(dāng)然,用戶界面的設(shè)計(jì)是不同于電子書或博客的主題設(shè)計(jì)的。但以字體為中心的設(shè)計(jì)原則仍然適用。畢竟,屏幕上的信息是通過文字進(jìn)行傳遞,而UI得語言就是字體。那么下面分享一個(gè)詳盡的ui視覺設(shè)計(jì)對字體的選擇技巧。希望對你有所幫助。

字體的基礎(chǔ)術(shù)語

了解字體設(shè)計(jì)的基礎(chǔ)術(shù)語非常重要，這些術(shù)語在介紹字體設(shè)計(jì)的相關(guān)文章中經(jīng)常出現(xiàn)。比如 x-height（X字高）指的是從字母的基準(zhǔn)線開始往上到矮字母的頂端的距離，當(dāng)X字高的比例相對大一些的話就能增加易讀性。

襯線字與非襯線字

在西方國家的字母體系，分成兩大字族：serif（襯線字體）及sans serif（無襯線字體）。襯線字（下圖中的宋體、Times New Roman）是指在字的筆畫開始及結(jié)束的地方有額外的裝飾，而且筆畫的粗細(xì)會(huì)因直橫的不同而有所不同。 相反的，無襯線字（下圖中的思源黑體、Helvetica）就沒有這些額外裝飾，而且筆畫粗細(xì)大致上是差不多。

襯線字的字體較易辨識，也因此具有較高的易讀性。 反之無襯線字則較醒目。通常來說，需要強(qiáng)調(diào)、突出的小篇幅文字一般使用無襯線字,而在長篇正文中，為了閱讀的便利，一般使用襯線字。在實(shí)際應(yīng)用中，因?yàn)橹形牡乃误w和西文的襯線體，中文的黑體和西文的無襯線體，在風(fēng)格和應(yīng)用場景上相似，所以通常搭配使用。

用戶界面中3個(gè)字體設(shè)計(jì)技巧

每一個(gè)界面基本都包括一系列的用戶選項(xiàng)。字體應(yīng)該能夠支持決策流程，應(yīng)以不增加用戶的認(rèn)知負(fù)擔(dān)的方式傳遞內(nèi)容。好的的字體能夠吸引讀者閱讀內(nèi)容,而不是關(guān)注字體本身。

1.選擇一種不同大小均適用的字體

大多數(shù)用戶界面需要不同尺寸的文本元素(按鈕復(fù)制、字段標(biāo)簽、節(jié)標(biāo)題等等)。選擇一種能夠以不同尺寸展示也能很好保持內(nèi)容的可讀性與可用性的字體。

2.選擇容易區(qū)分字體格式的字體

很多字體太容易混淆相似的字形。比如大寫和小寫字母L很相似；小寫字母R和N寫在一起可以很容易地成為一個(gè)小寫字母m 。所以需要通過字體的選擇讓用戶不易混淆這些。

比如: Clear Sans vs. Lato (觀察下面的大些I和小寫的L)

3.將文本視為用戶界面設(shè)計(jì)

卡梅倫.摩爾近十年一直傳遞這個(gè)觀點(diǎn),他認(rèn)為好的設(shè)計(jì)師會(huì)把文本視為內(nèi)容,而偉大的設(shè)計(jì)師會(huì)將其視為UI。

盡管人們對此觀點(diǎn)不一,但在界面設(shè)計(jì)中這種看法是正確的。因?yàn)楫?dāng)文本元素代表一個(gè)功能,那么它就是UI。所有UI設(shè)計(jì)在實(shí)踐中應(yīng)與字體相匹配。如果你不相信,想想你在進(jìn)入一個(gè)標(biāo)有“推”的拉手的門時(shí)所遇到的困惑。

在做設(shè)計(jì)時(shí)候，如果是沒有經(jīng)驗(yàn)的新手可能會(huì)糾結(jié)字體的選擇，不知道選哪一種才算合適的。有人就會(huì)經(jīng)常問別人這個(gè)地方該用什么字體會(huì)比較適合？或者通過模仿在搭配。

熟悉使用字體建議：

1.了解字體的性格

每個(gè)字體都有性格，人們比較喜歡一些有特色的東西。那么這些被喜歡的存在什么規(guī)則呢，了解你的目標(biāo)人群，知道你文檔的用途，選擇一類字體，是你的目標(biāo)人群所期望的字體，是你的文檔的用途所需要的字體。

2.避免使用默認(rèn)字體

如果你在語句或是設(shè)計(jì)中使用默認(rèn)字體，你是在告訴全世界你不知道還有其他的字體。

Times New Roman 和Calibri不是不好的字體，它們只是被過度使用，回到第一條規(guī)則，想想字體的性格，有比默認(rèn)字體更好的字體嗎？在大多數(shù)情況下，答案是以有的。

3.避免使用被過度使用和丑陋的字體

一些字體受到過多的歡迎，因此我們可以認(rèn)為他們是過度的使用，有點(diǎn)討厭。這是由大多數(shù)的電腦擁有很多一樣的字體造成的。

4.避免使用被過度使用和丑陋的字體

大多數(shù)文檔如果使用超過一種字體看起來比較好，但是少部分使用超過三種看起來比較好。那么你需要記住什么t呢？無論這個(gè)文檔是什么，嘗試使用兩種字體，一種標(biāo)題使用，一種文本內(nèi)容使用。

二.界面中文字使用的規(guī)則

在不同平臺的界面設(shè)計(jì)中規(guī)范的字體會(huì)有不同，像移動(dòng)界面的設(shè)計(jì)就會(huì)有固定的字體樣式。網(wǎng)頁中會(huì)有常用的幾個(gè)字體，在這我和大家分別介紹一下。

以下是在 72像素/英寸 下的規(guī)范

移動(dòng)端常規(guī)字體

1、IOS:常選擇華文黑體或者冬青黑體，尤其是冬青黑體效果比較好。

2、Android

英文字體：Roboto

中文字體：Noto

移動(dòng)端常用的的字號有哪些呢？

1、導(dǎo)航主標(biāo)題字號：40-42px

2、在內(nèi)文展示中字號大小又是多大呢？大的正文字號32px,

3、副文是26px，小字20px

4、在內(nèi)文的使用中，根據(jù)不同類型的App會(huì)有所區(qū)別。

像新聞?lì)惖腁PP或文字閱讀類的APP更注重文本的閱讀便捷性，正文字號36px，會(huì)選擇性的加粗。