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

字體的基礎術語

了解字體設計的基礎術語非常重要，這些術語在介紹字體設計的相關文章中經常出現。比如 x-height（X字高）指的是從字母的基準線開始往上到矮字母的頂端的距離，當X字高的比例相對大一些的話就能增加易讀性。

襯線字與非襯線字

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

襯線字的字體較易辨識，也因此具有較高的易讀性。 反之無襯線字則較醒目。通常來說，需要強調、突出的小篇幅文字一般使用無襯線字,而在長篇正文中，為了閱讀的便利，一般使用襯線字。在實際應用中，因為中文的宋體和西文的襯線體，中文的黑體和西文的無襯線體，在風格和應用場景上相似，所以通常搭配使用。

用戶界面中3個字體設計技巧

每一個界面基本都包括一系列的用戶選項。字體應該能夠支持決策流程，應以不增加用戶的認知負擔的方式傳遞內容。好的的字體能夠吸引讀者閱讀內容,而不是關注字體本身。

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

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

2.選擇容易區分字體格式的字體

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

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

3.將文本視為用戶界面設計

卡梅倫.摩爾近十年一直傳遞這個觀點,他認為好的設計師會把文本視為內容,而偉大的設計師會將其視為UI。

盡管人們對此觀點不一,但在界面設計中這種看法是正確的。因為當文本元素代表一個功能,那么它就是UI。所有UI設計在實踐中應與字體相匹配。如果你不相信,想想你在進入一個標有“推”的拉手的門時所遇到的困惑。

在做設計時候，如果是沒有經驗的新手可能會糾結字體的選擇，不知道選哪一種才算合適的。有人就會經常問別人這個地方該用什么字體會比較適合？或者通過模仿在搭配。

熟悉使用字體建議：

1.了解字體的性格

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

2.避免使用默認字體

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

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

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

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

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

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

二.界面中文字使用的規則

在不同平臺的界面設計中規范的字體會有不同，像移動界面的設計就會有固定的字體樣式。網頁中會有常用的幾個字體，在這我和大家分別介紹一下。

以下是在 72像素/英寸 下的規范

移動端常規字體

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

2、Android

英文字體：Roboto

中文字體：Noto

移動端常用的的字號有哪些呢？

1、導航主標題字號：40-42px

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

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

4、在內文的使用中，根據不同類型的App會有所區別。

像新聞類的APP或文字閱讀類的APP更注重文本的閱讀便捷性，正文字號36px，會選擇性的加粗。