如果您是图形或UX设计师，那么这篇文章适合您。

好吧，这将是一个漫长的过程。让我们喝杯咖啡，从健康的灵感开始。

“大字体，即使是大字体，也可以是美丽和有用的。但镇定通常比大小重要得多——而镇定主要由空虚组成。

— 罗伯特·布林赫斯特

排版无处不在——在我们的手机上、街对面的广告牌、产品包装上、书籍上——名单是无穷无尽的。文本占当今网络上共享信息的90%以上。我们无法想象一个文本不是视觉设计一部分的世界。这是沟通的关键要素之一。

正确应用排版可以成就或破坏我们的设计。根据研究，用户平均需要 50 毫秒（当然是潜意识）才能对您的品牌留下第一印象。您使用的每种字体都以不同的方式影响用户的心理——它传达了一种独特的个性和情感，最终导致用户与您的品牌产生某些联系。要了解排版在设计中的重要性，请查看Google Design的这篇有趣的文章，了解他们如何将Google字体重新构想为更具交互性，可扩展性，开放性和视觉吸引力的资源，供设计师探索和了解不同的字体系列。

现在我们了解了排版的重要性，让我们进入理论。简单来说，设计中的排版是指“文本的风格或外观”。排版的广度和范围几乎是无限的，但不要被暗示——你不需要研究阳光下的一切来让你的设计脱颖而出。在本文中，我们将介绍基础知识，这些基础知识应该可以让您在大多数项目中处于有利地位。

是字体还是字符？

对于外行来说，排版似乎是一种选择字体的练习，但它远不止于此。首先，让我们了解字体和字符

字符：字体是字形（即字母、数字、符号和标点符号）的集合，它们都共享一个设计。有史以来第一个字体是Blackletter，由活字印刷机的发明者古腾堡开发！

字体：字体是字体中的一组字形。例如，Helvetica和Futura是不同的字体。但是12点Helvetica和24点Helvetica，或Helvetica Light和Helvetica Regular是同一字体的不同字体。这些差异源于物理印刷机的历史。术语字体和字体通常可以互换使用。您当前正在阅读的文本采用宪章（衬线）字体，这是 Medium 在其网站上使用的字体之一。

字体和字体之间区别的图示。在这里，哥谭是字体，而不同重量的哥谭代表不同的字体。

字体和字体之间区别的图示。在这里，哥谭是字体，而不同重量的哥谭代表不同的字体。

尺寸、重量、款式和比例

接下来，让我们看一下您可能遇到的字体的四个简单属性：大小、粗细、样式和比例。

大小：这是不言自明的，指的是文本的大小，通常用点或“pt”表示。大小越大，文本显示得越大，描边粗细按比例增加。

粗细：粗细是指任何给定字体中字体笔触的总粗细。较重的重量通常用于吸引注意力。一些常用的砝码有细、正、中、粗;但重量可以具有几乎无限的范围，从一端的超轻到另一端的特黑。

类型族中权重的数量和单个权重的实际命名取决于创建它的设计者，并且可能是任意的。使用可变字体，像您和我这样的最终用户可以通过调整权重轴来更好地控制权重。

样式：样式通常是三种类型之一 - 正常（直立），斜体和倾斜。斜体最初是为了有效地强调较大文本块中的小段文本而引入的，并且仍然很好地服务于此目的。斜体样式与斜体略有不同，因为它不使用草书变换，并且可能显示为常规文本，但带有倾斜。斜体样式常见于无衬线类型族，而斜体样式在衬线类型族中很常见（稍后会详细介绍衬线）。

比例/宽度：比例是指字符相对于其高度的宽度。请注意，我们在这里谈论的是字符的宽度，而不是笔画。较小的比例将呈现更“浓缩”或“压缩”的外观，而较大比例将呈现“扩展”外观。宽度名称的范围可以从“额外压缩”到“扩展”。请注意，与粗细和样式不同，大多数类型族没有多种宽度选项，通常只有一个宽度。

请注意，当我们更改大小、粗细和样式时，文本外观如何以不同的方式变化（字体：Helvetica）。第二个示例（下图）显示了两种比例变化（字体：Futura）

类型族将包括多个权重和样式，通常采用 TrueTypeFont （TTF） 或 OpenTypeFont （OTF） 格式文件，我们可以下载并安装在计算机中。大型字体系列通常包含大量字体样式和粗细的变体，为设计人员提供了更多可供选择的选项。

行距、跟踪、字距调整和层次结构

大小、重量和样式是我们通常在决定字体时选择的更高层次的特征。但是字体还有其他更微妙的特征，设计师经常使用这些特征来对其文本元素进行最后的润色，并优化它们的视觉吸引力。我们走吧！

行距/行距：行距（发音为led-ding）是指两行文本之间的垂直空间。这个词起源于铅条（一种金属），在机械排版时代用于分隔线条。设计师在需要时玩弄引线以提高文本的可读性 - 太多或太少都可能令人眼痛（见下文）。

字距/字符间距：字距是指文本序列中字符之间的水平间距。这可以根据美学要求进行压缩或扩展。通常的做法是，更喜欢对小字体进行更宽的跟踪，而对较大字体进行较窄的跟踪。

字距调整：字距调整是指一对单个字符之间的水平间距。尽管两个字符中心之间的空间在整个文本中可能相似，但由于它们的形状不同，单个字符之间的空间通常看起来不相等。由于任何两个字符在彼此相邻放置时以不同的方式组合在一起，因此不同字符集之间的字距调整会有所不同，例如，“a”和“b”之间的字距调整可能与“b”和“c”之间的字距调整不同。

调整字距调整涉及单独查看每个字母，以评估不同的形状或样式如何影响它与另一个字母的连接方式。调整字距调整的目的是确保所有字母看起来均匀分布且视觉上令人愉悦;并且任何两个字母都不应相互混合或相距太远以致影响可读性。

顶部的文本显示了哥谭字体的自然字距调整，在“i”和“n”之间可以看到的最大字距调整。下面的文本显示了当所有相邻字符之间的字距调整设置为最大字距调整时的效果 — 请注意“K”和“e”在第二个实例中看起来有多远。

作为初学者，我们可能经常将字距调整与字距调整混淆，但主要区别在于字距调整处理较大文本组（如单词或行）之间的间距，而字距调整处理一对字母之间的间距调整。在实践中，字距调整通常应用于大段文本，而字距调整应用于特定的小段文本，如页眉和徽标。

某些字符对可能具有自然宽或窄的字距调整，例如字母 A 和 V，它们在标准文本中自然看起来更远，并且可能经常需要调整字距以使它们更靠近。

看看下面的可口可乐品牌标志——看看第一组C和O与第二组C和O之间的间距。你能注意到区别吗？这是字距调整在起作用。由于第二个 C 的设计与第一个明显不同，并且两个 O 的垂直对齐方式不同，因此重新调整了字距调整，使字符看起来分布更均匀。

下面的第二个例子说明了Zara'a标志的重新设计。虽然旧徽标（左）使用了宽字距调整，但新的再现（2019 年）突出了衬线并减少了字距，几乎以至于字符开始相互叠加（如果你问我，这不是一个好的改头换面！

可口可乐和Zara：对字距调整的不同看法

层次结构：层次结构通过使用不同级别的强调将眼睛从一个元素依次引导到下一个元素，并被设计师用来引导观众的眼睛到文本中最重要的元素，例如标题或CTA。为此，设计师决定他们希望最大强调的位置，然后通过改变它们相对于常规文本的外观来突出这些元素 - 通常是通过使它们更大或更粗。

了解了这些术语后，现在让我们仔细看看字体。

字体分类

说到字体，我们需要知道6种主要分类或类型，每种分类或类型都有一定的关联和个性。

主要字体分类：衬线/无衬线/文字/书法/黑字/显示

主要字体分类：衬线/无衬线/文字/书法/黑字/显示

衬线：你有没有注意到单个字母末尾的小笔触、线条和设计？例如，仔细查看此“d”的顶部和右下角。这些笔画称为衬线，使用衬线的字体称为衬线字体（请参见下图）。在物理印刷中，衬线用于提高文本的易读性。

衬线字体具有非常传统/正式的外观;并唤起认真、务实、值得信赖和尊重。它们经常用于官方文件，奢侈品牌和印刷出版物，如杂志，报纸和书籍（这解释了为什么Medium使用衬线字体作为正文文本）。Times New Roman是一种流行的衬线字体。

平板衬线字体是衬线字体的一个子组，具有更大的粗细和大小以及均匀的笔触，使它们看起来更有冲击力和大胆。衬线通常较重且呈方形。当用于描述强度或重量或轻松吸引注意力时，这会派上用场——使这些字体适合标题。机器人板是一个流行的例子。

《时代新罗马》中的文字。请注意字母末尾的衬线（用圆圈突出显示）。

无衬线：“Sans”在法语中的意思是“没有”，因此无衬线是指不使用衬线的字体，呈现简约、干净和现代的外观。它们代表了现代性和进步性，看起来不那么正式，更直接，并且在计算机和移动屏幕上往往具有更好的可读性。因此，无衬线字体在大多数现代品牌设计和网页内容中得到了广泛使用。

蒙特塞拉特和赫尔维蒂卡是流行和多功能的无衬线字体。还记得谷歌的旧品牌标志吗？它采用衬线字体，在 2015 年用定制的无衬线字体重新设计，以赋予一种新的、更现代的外观。

谷歌的旧（顶部）和新（底部）徽标。请注意旧徽标中使用的衬线字体。

脚本：脚本字体模拟手写脚本的外观和感觉，每个字符通常都有一个连接的尾部以实现流畅性。他们有一种非常非正式、有趣、随意和创造性的感觉。想想Instagram，吉百利，可口可乐和雷朋的标志。由于其性质和有限的可读性，脚本字体迎合了一组特定的用途（例如标题、标题或简短副本），并且不能用作大多数用例的主要字体（正文副本）。这解释了它们在大多数长篇 Web 内容上缺乏流行性的原因。想象一下，必须以脚本字体阅读所有 Medium 故事，那将是一场噩梦！

一些使用脚本字体的著名徽标：Kellogs，Cadbury，Instagram，Ray-Ban，Ford，可口可乐

除了衬线、无衬线和脚本之外，我们还有更多的字体类型（可能不像上述三种那样大量使用，但仍然相关）。

书法：书法字体的整体外观接近字体，试图在外观上模仿笔触，但字母形式具有现代的当代艺术外观，可以选择用于渲染小段文本。

黑字/哥特式：这些可能是所有字体中最古老的，可以追溯到中世纪。有史以来印刷的第一本书，圣经，使用黑字字体。其特点是细笔和粗笔触之间的高度对比，这些唤起了一种非常传统和古典的氛围。请记住，使用黑字字体时，易读性可能是一个问题。

Display / 装饰性：这些是不属于上述任何类别的现代字体，并且在样式上可能非常多样化，因此我们很难根据简单的特征来定义它们。显示字体可以包含脚本、黑字、全大写字母等等，它们的形式可能非常特定于某个时间段或流派。由于它们具有装饰性风格，并且旨在用于大尺寸文本，因此它们通常应用于少量文本，例如标题或涂鸦。

如果您想知道网页设计的前 20 种最佳字体，并且需要为您的下一个应用程序或网站提供一些想法，请查看下篇章。

如果您有需要，可以点击ui设计公司进行咨询

人工智能体验设计咨询公司,武汉UI设计公司,交互设计公司,HMI交互设计,网站UI设计公司