界面設計中中英文排版的注意事項

界面設計基本包含了：文字排版，圖片製作，平面設計，三維立體設計，靜態無聲圖文，動態有聲影像等，其中文字排版是不可或缺的一部分，今天我們主要講解中英文字體排版問題，現在我們就跟著老師一起來看看：在界面設計中，中英文字體如何進行合理的排版？

1. 字體樣式不要過多

不管是平面設計還是界面設計，我們在設計中的字體樣式都不要超過3種，不然太多的類型尺寸和樣式會破壞布局，讓用戶無法準確獲取信息。

通常情況下網頁設計和APP設計中文字樣式選擇不超過兩種，一種一般就足夠了。如果您使用多個字體，請確保字體系基於字元寬度互補。

如圖：左邊組的字體相對就比較和諧，而右邊字體的粗細對比太明顯，則顯得輕重比例很不和諧了。

2. 嘗試使用標準字體

比如，在windows系統下，網頁設計字體盡量選擇系統內嵌的標準字體微軟雅黑和Aril；在app設計中，iOS字體選擇蘋方和fs字體等等。

3. 限制線長度

如果你想要讓用戶從你的文字中快速獲取信息，你應該考慮適當的文字長度。如果每行文字太短，視線頻繁的換行，會打破讀者的節奏。如果一行文字太長，用戶的眼睛將很難專註於文本，引起閱讀疲勞。

對於移動設備，您的英文內容應該每行30-40個字元 。以下是在移動設備上查看的兩個網站的示例。第一個使用每行50-75個字元（列印和桌面的每行最佳字元數），而第二個使用最佳30-40個字元。

中文內容每行在20個文字左右，最為合理。

4. 選擇各種尺寸的字體

確保您選擇的字體在較小的屏幕上清晰可辨！下圖中上方為網頁設計常用字體大小，下方為移動端設計常用字體大小。

5. 使用容易分辨的字體

英文字體中注意區別」i」和「l」。

中文字體中盡量選擇黑體

6. 避免英文全部大寫

英文全部大寫容易導致用戶不易閱讀，從而影響用戶獲取信息的速度。

7. 合理間距

英文行間距一般是字元高度的30%，以便良好的可讀性。

而中文行距我們通常設置為字元高度的150%，如下圖中間文字

而段落之間的間距可以比行間距提高20%，留白可以為用戶提供消化內容的時間。下圖左：幾乎重疊的文字。右：良好的間距有助於可讀性。

8. 確保您有足夠的顏色對比度

不要對文本和背景使用相同或相似的顏色。文本越明顯，用戶能夠掃描和閱讀的速度越快。

這些文本行不符合顏色對比度建議，難以根據背景顏色進行閱讀

這些文本行符合顏色對比度建議，並且易於閱讀背景顏色

我們通常歸納成，深色背景使用淺色字，淺色背景使用深色字，有顏色的背景可以使用白色字。

9. 避免將文字著色為紅色或綠色

建議使用除顏色以外的其他線索來區分重要信息。也避免單獨使用紅色和綠色來傳達信息，避免有色盲用戶無法順利閱讀的情況。所以在我們設計當中可以考慮使用圖標來提示用戶。

10. 避免使用閃爍的文字

閃爍或閃爍的內容可能會使一些敏感人群發瘋，特別是互補色內容呈現閃爍狀態，對於一般使用者來說，這可能是令人討厭或分心的。

本文為源碼時代UI老師原創，轉載請標明出處（www.itsource.cn）