文本是主要的通信方式，这使得网页排版对于商家来说至关重要。本文将介绍一些排版基础知识，并提供在操作文本时需要考虑的一些事项。
我假设读者对文字处理已足够熟悉，因此可以跳过文本对齐、斜体和粗体等基本内容。我将转而介绍一些较少为人知的概念，这些概念你可能已经了解，即使术语是新的。掌握这些术语将帮助你更好地识别和控制处理文本时的各种情况。
字体与字型
排版中一个常见的误解是认为字体（fonts）和字型（typefaces）是相同的。实际上，字型是一组字体的集合，也称为“字体族”，包含该字体的所有变体。例如，在 Arial 字型中，你会找到 Arial、Arial Bold、Arial Narrow、Arial Narrow Bold 等字体。
就网页而言，某些字型被认为是“网络安全”的，而另一些则不是。换句话说，有些字体族可以在所有浏览器中正常显示，而有些则不能。在为网页设计文本时，请牢记这一点。
衬线体与非衬线体
“Serif”（衬线体）和“sans-serif”（非衬线体）描述的是字体是否带有衬线——即某些字符末端的额外笔画。我将衬线称为“脚”。顺理成章地，衬线体会有衬线，而非衬线体——“sans”是法语中“没有”的意思——则没有。Arial 是非衬线体的一个例子，Times New Roman 是衬线体的一个例子。
你可以在下面的图中看到由数字“8”代表的衬线示例。你还会注意到，字型结构远不止衬线这么简单。除非你对排版有浓厚兴趣，否则无需担心字型结构的问题。在这里，我只打算讲解基础知识。
衬线体的结构。
衬线体和非衬线体不仅仅是有无“脚”的区别。对于大多数读者来说，在印刷品中，衬线体比非衬线体更容易阅读，因为衬线有助于引导视线从一个字符移动到另一个字符，从一个词移动到另一个词。然而，在处理数字文本时，情况通常相反，因此非衬线体成为网页正文的首选。
这并不意味着衬线体绝不能用于网页，或非衬线体绝不能用于印刷品。你只需考虑你计划如何使用这种字体。如果你打算将所有网站正文使用衬线体发布，可能需要重新考虑。
字距调整、行距与字间距
以下是三个非常有用但常被排版新手忽视的概念。这些概念也经常被混淆——事实上，我最近才了解到，我整个职业生涯中一直称为“字距调整”的东西，实际上是“字间距”。
这三个概念中最简单的是行距（leading），发音为“ledding”。行距是文本行之间的垂直间距。可以通过调整行距来提高可读性或增加文本块的美观度。
垂直空间可以提高可读性。
字距（Tracking），正如我前面提到的，常常被误认为是字偶间距（Kerning），它是指一行文本中字符之间的间距。你可以将字距理解为类似于行距的概念，但它处理的是同一行内的字符，而非行与行之间的关系。如以下示例所示，字距是平衡多行文本而又不损失所需字体大小的绝佳方式。
字距是所有字母之间均匀的间距。
字偶间距（Kerning）与字距类似，但它仅调整特定字母组合之间的间距。这可能会让人困惑，但我认为下面维基百科的示例很好地说明了字距和字偶间距之间的区别。大多数高端字体都会在字体文件内预先指定好字偶间距。请注意，虽然两者不同，但可以通过手动使用字距来实现字偶间距的效果。
字偶间距通过调整特定字母的间距来获得更好的视觉平衡。
通用使用原则
既然我已经介绍了一些排版的基础知识，现在来看看如何在设计中运用排版。
对比度
在排版中，尤其是网页排版中，一个需要考虑的重要因素是对比度。由于计算机显示器通过发光来生成图像，如果文本的对比度过低或过高，都会对眼睛造成负担。回想一下早期互联网时代，黑色背景上的彩色文字非常流行。你还记得在这些网站上阅读内容有多困难吗？这就是对比度过高的例子。
对比度可用于使文本清晰易读，同时避免刺眼难看。
并没有一条通用的规则来规定对比度和排版的关系。在某些情况下，你可能希望在深色背景上使用白色文本。我的建议是考虑你处理的文本量，以及对比度过低或过高是否会导致眼睛疲劳加剧。你应该能立即感受到高对比度或低对比度文本的可读性差异。
排版层级
文本和设计另一个不可或缺的部分是“排版层级”（Typographic Hierarchy），即通过系统化的大小、粗细、间距和位置安排来强调或弱化页面上的信息。我们在日常文本中经常看到这一点，它在网页设计中至关重要。排版层级的目标是在文档或页面中创造流畅的阅读流，同时吸引人们对重要信息的注意。这是通过对同等重要性的信息使用一致的格式来实现的。
例如，在网页设计中，我们定义 H1、H2 和 H3 HTML 标签，以在层级中的特定级别渲染文本。H1 标签位于层级的顶部。在给定网页上，所有 H1 标签具有相同的字体大小、粗细、颜色和样式。H2 紧随其后，其字体大小、粗细、颜色和样式与 H1 不同。
排版层级不仅是处理信息重要性的极佳方式，良好的层级还能通过为读者的视线创造自然路径，引导读者浏览整个页面。看看今天的任何一份报纸，你都应该能够发现排版层级的存在。
一致性
一致性通常与层级结构相伴，但在此单独讨论是必要的，因为存在一些误解。你可能听说过，网站应该只使用一种字体。虽然这句话有一定道理，但这并非全部真相。
许多新手设计师容易陷入在一个页面中使用过多字体的陷阱。即使为层级结构中的不同级别指定了特定字体，过多的字体也会相互竞争，打断页面的阅读流畅性。然而，这并不意味着你不应该在网站上使用多种字体。目标不是让字体相互冲突。
从使用同一家族（typeface）内的字体开始是一个好的起点。这将为你提供丰富的字体变体，用于构建你的网站。只要不破坏网站的连贯性，使用多种字体家族是可以的。例如，花哨的手写体可能与粗犷的无衬线体形成过于强烈的对比。同时，避免使用两种或多种过于相似的字体家族，因为这同样会造成混淆。
你可以放心地在网站标题或标志中使用较为冷门的字体，而不会影响网站其余部分的流畅性。当你注意到网站中出现了来自多个字体家族的多种字体时，你可能需要考虑简化设计。
同样，没有关于字体选择的通用规则。例如，这里有一个网站使用了多种字体，但并未破坏整体的浏览流畅性。
一个利用多样化排版设计的示例网站。
如果这一切让你感到困惑，我建议暂时限制所使用的字体种类数量，并尝试感受网站排版与其层级结构之间的关系和流畅性。
排版的奇妙世界
排版的世界非常广阔。我们在这里只是刚刚触及皮毛。如果你仍然对排版感兴趣，我鼓励你探索更高级的排版技巧，甚至考虑创建自己的字体。与此同时，请密切关注你电商网站上的排版设计。它对良好的设计和沟通至关重要。