Time:
2022-10-17 10:42:46
Author:
素马
包含在用户界面 (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) 动画设计中使用排版时,这一点尤其重要。
什么是字距调整的最佳字体?
最好的字距调整字体是那些字母之间已经有很好间距的字体,因为这将为您节省大量的编辑时间。此外,尝试选择一种简约且易读的字体,让任何人都可以轻松阅读,尤其是如果你还是第一次学习如何进行字距调整。
字距调整的价值以及如何开始
虽然字距调整似乎是一个不值得投入大量时间的小调整,但现实情况是它会对您的观众如何消费和欣赏您的排版产生巨大影响。例如,您网站主页上的大文本以及字母之间的间距不一致确实会分散体验,并且还可能破坏您网站的可扫描性。
如果您仍然不确定如何开始使用字距调整,请访问不同的网站并将排版示例的图像保存到您的设计灵感情绪板上。如果您遇到一个独特的排版挑战,您可以通过查看您最喜欢的样本集合来解决它。