包含在用戶界面 (UI) 樣式指南中的一個關鍵元素是排版將如何出現在您的移動程序 或 網站設計中。客戶第一次與光龍網絡團隊討論排版時,您可以選擇是要使用預先存在的字體還是創建您品牌獨有的新字體。但是隨著您的排版決策變得更加細化,您最終將需要討論字距調整。
如果字距調整對您來說是一個新概念,那么本文將幫助您弄清楚它是什么、它的目的以及如何使用它來改進包括排版在內的設計。讓我們首先定義字距,以便更好地理解它是什么。
什么是字距調整?
字距調整是指兩個單個字母之間存在的間距。這是一種可以追溯到印刷機的排版方法,最初被稱為間距。雖然您可能已經在最近的UI 設計中遇到過字距調整,但了解字距調整最佳實踐和最佳入門方式非常重要。讓我們仔細看看字距調整以及如何開始將其融入您的設計過程。
字距調整的目的是什么?
字距調整的目的是完全控制排版的間距,以便每個字母都有足夠的喘息空間。例如,如果您將“l”和“i”等可區分的小寫字母放在一起(“li”),字體的字距調整不是問題,但如果您將大寫“V”和“由于間距增加,A' ('VA') 在一起。字距調整還可以通過使排版更易于閱讀且不那么嚇人來幫助您克服認知超負荷的問題。
當設計師使用他們的設計系統工具構建他們的 UI 基礎架構時,他們會記錄段落、組件、邊距、填充等之間的間距。這種謹慎的元素間距方法應該擴展到您對設計排版的看法。
數字排版中的字距
即使您的設計工具自動將間距合并到您的排版中,您仍然需要根據您當前正在設計的內容以及您計劃如何將排版合并到該設計中來考慮字距調整。下面,讓我們分解字距調整值和字距調整表的含義,以幫助您入門。
緊縮值
在字距調整過程中調整字母間距時,有正值和負值之分。每個正增量都會增加任意兩個字母之間的間距,而負增量會減小間距。但是,請記住,每個字母都有不同的形狀和大小,因此突出顯示所有文本并同時調整所有間距的值可能不會產生您想要的效果。
字距調整表
自印刷機發明以來,字距調整已成為排版設計的主要內容,因此創建了字距調整表以幫助指導設計師的流程。字距調整表是一個字母對列表,其中包括每個列出的對的最佳間距值。在排版設計過程中參考這些表格很有用,但重要的是要記住您選擇的字體在字母間距中起著重要作用。
4 種字距調整
調整排版間距有四種關鍵方法,包括:
公制字距
光學字距
手動字距調整
上下文字距調整
讓我們快速瀏覽一下每一個,以了解它們的含義以及它們的工作原理。
1. 公制
公制字距調整是一種自動字距調整選項,可以輕松地在字母之間創建空間,而無需花費大量時間進行設計。這種字距調整方法使用一個字距調整表,其中存儲了每對字母之間特定間距的值。
2.光學
光學字距調整是一項高級功能,可自動檢測每個字母的輪廓。這種字距調整方法使用一種算法來計算字母之間的最佳間距。
3. 手動字距調整
手動字距調整只是自己調整每個字母之間的間距,這看起來很乏味。但是,手動調整字距為您提供了自動選項無法提供的控制級別。對于經常使用排版的設計師來說,這是首選方法,尤其是在平面設計方面。
4. 上下文字距調整
上下文字距調整本質上是查看一串字母以確定它們之間的適當間距。這種字距調整方法會根據整個單詞的最佳間距自動移動字母,而不是僅將兩個字母視為一組。
改善排版的字距調整技巧
現在您了解了可供您使用的不同字距調整選項,是時候查看一些有助于指導您完成整個過程的關鍵提示了。
留意特定的字母配對。字母有各種各樣的形狀,其中一些在彼此相鄰放置時非常尷尬。一定要注意傾斜的字母(A、K、V、W、Y)、帶有手臂或交叉筆劃的字母(F、L、T),以及特定的字母配對(W 或 V 與 A;T 或 F 與 A )。
觀察間距如何隨字體大小變化。隨著您增加或減少字體大小,字母之間的間距可能會改變并改變排版的預期外觀。您應該將其余設計中的相同視覺層次結構方法應用于排版間距。
讓字母呼吸。手動調整字距時,請確保不要將空間減少太多或太少,除非是針對特定用例。否則,它會降低單詞的可讀性,損害用戶的整體體驗。在運動或用戶體驗 (UX) 動畫設計中使用排版時,這一點尤其重要。
什么是字距調整的最佳字體?
最好的字距調整字體是那些字母之間已經有很好間距的字體,因為這將為您節省大量的編輯時間。此外,嘗試選擇一種簡約且易讀的字體,讓任何人都可以輕松閱讀,尤其是如果你還是第一次學習如何進行字距調整。
字距調整的價值以及如何開始
雖然字距調整似乎是一個不值得投入大量時間的小調整,但現實情況是它會對您的觀眾如何消費和欣賞您的排版產生巨大影響。例如,您網站主頁上的大文本以及字母之間的間距不一致確實會分散體驗,并且還可能破壞您網站的可掃描性。
如果您仍然不確定如何開始使用字距調整,請訪問不同的網站并將排版示例的圖像保存到您的設計靈感情緒板上。如果您遇到一個獨特的排版挑戰,您可以通過查看您最喜歡的樣本集合來解決它。