您的网站字体是否太小？

网络版式的标准已经发生变化，设计师正在采用更大、更容易阅读的排版，这些排版在不同设备上更加无缝和一致。更大的网页排版的趋势始于滚动上方的超大处理，从标题到更具艺术性的英雄标题文本元素。

移动设备上的正文大小同时开始增加，以增强可读性。从那时起，这种趋势开始渗透到网络类型的几乎所有方面。如果您最近没有考虑过网站文案的大小，那么是时候重新考虑一下 12 或 14 点/像素的正文文案了。大文字来了！

超大标题

较大文本最明显且最简单的实现是使用超大标题来吸引用户的注意力。

当没有太多长或复杂的单词需要考虑时，超大标题效果最好。这是一种面对面的处理，因此实际的字体需要易于理解。

成功秘诀：

• 坚持使用可在设计的其他部分使用的衬线或无衬线字体。新奇或脚本选项很快就会变得棘手。

• 让它变大——大得令人不舒服——然后稍微退一步，以找到设计中正确的和谐。

• 从至少 80 磅的文本开始，然后扩展到填满屏幕。确保在最终设计中使用相对尺寸，以便其在所有设备上适当缩放。（适当的 CSS 规则是“font-size”，它使用基于 100% 标准尺寸的百分比比例。）

为更大的正文副本辩护

如果您网站上的正文未达到至少 16 点，那么是时候重新考虑您的排版情况了。

这个“规则”源于移动设备，因为小于输入文本的文本实际上会在某些设备上放大。（这在用户体验方面可能会很烦人。）设计修复是创建足够大的排版级别，以便轻松阅读和理解。

此外，目标是当保持自然距离（通常约为半臂长度，类似于读书）时，移动设备上的文本可以舒适地阅读。

在此距离下，较大的文本更容易阅读，并且更适合屏幕尺寸。用户不必眯着眼睛或将设备靠近自己的脸来合理地理解文本。

成功秘诀：

• 从大约 16 磅的正文开始。这对于桌面和移动设备通常是可以接受的。

• 使用具有规则笔划宽度和简洁线条的高度清晰的字体，以最大限度地提高可读性。

• 对于细字体（使其变大）或宽字体（使其变小），稍微向上或向下调整尺寸。

• 对于文本较多的页面，请考虑使用更大的正文文本以减少眼睛疲劳，例如 18 磅甚至 20 磅。（作为指导，Medium 使用 21 点正文，而 Jeffrey Zeldman 的网站则使用 24 点。）

增加整体层次结构

因此，您要做的不仅仅是调整网站设计某一部分的文本大小。您需要重新考虑整个排版层次结构。

随着正文文本大小的增加，您需要相应地缩放类型的其余部分。否则，您可能会得到一种不和谐的印刷比例，其中某些文本大小很难相互区分。

当涉及到增加大字体的尺寸（例如标题或副标题）时，调整整体字体比例就不那么重要了。即使这些元素变得更大，与正文元素的自然区别仍然存在（显然）。如果正文开始看起来不合适，或者大字体的大小使正文看起来比实际大小小，您也应该考虑增加正文文本的整体大小。（视错觉可能会破坏设计层次结构。）

成功秘诀：

• 在整个设计中按比例调整文本大小。

• 注意颜色和尺寸对比如何影响租赁尺寸的外观。</li.

• 相信你的眼睛；如果文字看起来太大或太小，请继续进行调整，直到感觉合适为止。

不要忘记调整行距

在调整文本元素时，不要忽视文字行之间的间距。较大尺寸的文本通常需要增加行距。

考虑根据文本大小的百分比而不是固定高度创建行距规则。（这样这些更改就会自动调整。）

成功秘诀：

• 开始时，同一块到文本的行间距为正文文本大小的 1.5 倍（150%）。如果感觉很紧，请增加行距。

• 具有极端对比度的背景和文本元素通常需要一点额外的行间距以获得更和谐的感觉。为黑色背景上的白色文本添加行距，为中色调灰色背景减少一些行距。

• 密切注意所选字体的上升部分和下降部分，并相应地调整行距。

离线文本大小也在增加

虽然这种排版趋势主要针对网页设计项目，但文本大小总体上正在增加。从电子邮件到印刷材料，设计师在具有相似尺寸的印刷设计的数字项目中使用相同的指南。（您可能会将移动设备等同于明信片。）

好的设计就是好的设计。

许多项目都包含多个组件，我们专注于共同的用户体验。因此，您希望网站的设计看起来与相关明信片的设计相似。

另一个共同点是您的眼睛刚刚开始习惯看到特定尺寸的文本。就像使用用户模式一样，视觉模式使事物更容易理解和快速查看。较大的文本也不例外。

结论

您是否开始注意到在各种设计项目中用于排版的尺寸发生了变化？就我个人而言，我对它如此迅速地悄然降临在我身上感到惊讶。事实上，我发现自己一直在追求越来越大的字体尺寸。