本文介绍了提高文本内容可读性的10个技巧

沟通在设计中起着至关重要的作用。这是在用户和代购源码网站之间建立清晰链接并帮助用户实现目标的关键。当我们谈论网页设计环境中的通信时，这通常是指文本。排版在这个过程中起着至关重要的作用：

网络中超过95％的信息以文本形式出现。

良好的排版提高了用户的阅读热情。相反，糟糕的排版会降低用户的阅读热情。正如Oliver Reichenstein在他的文章“网页设计是95％排版”中所说：

优化的排版是优化可读性，可访问性和可用性！让整体图形平衡。

换句话说：优化排版是关于优化用户界面。在本文中，我将提供一些规则来帮助您提高文本内容的可读性。

1.减少使用不同类型的字体使用3种以上不同的字体使代购源码网站看起来非结构化和不专业。请记住，太多的大小类型和样式可能会破坏任何布局。

为防止这种情况，请尝试将字体数量限制为最小值

通常，将字体数量限制到最小（两个就足够了，通常一个就够了）并将相同的字体粘贴到整个站点中。如果使用多种字体，请确保单词系统根据字符宽度相互补充。以下面的字体组合为例。格鲁吉亚和Verdana（左）的组合具有相似的价值，配对是和谐的。比较与Baskerville和Impact（右）的配对，其中大大增加的Impact使相应的serif字体不那么容光焕发。

确保字系统根据字符宽度相互补充

2.使用标准字体字体（例如Google Web Fonts或Typekit）的嵌入式服务可以为您的设计提供新鲜且意外的许多有趣字体。它们也很容易使用。以Google为例：

1.选择任何字体，例如Open Sans2。生成代码并粘贴HTML文档。 3.完成！

实际上，这种方法存在一个非常严重的问题：因为用户更熟悉标准字体，所以他们可以更快地阅读它们。

除非您的代购源码网站对自定义字体非常有吸引力（例如品牌或创建沉浸式体验），否则通常最好使用系统字体。最安全的方法是使用系统字体：Arial，Calibri，Trebuchet等。记住，良好的排版可以吸引读者的内容，而不是排版本身。

3.限制行的长度每行的正确字符数是使文本可读的关键。这不是您的设计，它决定了文本的宽度，它应该是一个可读性问题。考虑一下Baymard Institute关于可读性和线路长度的建议：

“如果你想拥有良好的阅读体验，每行应该有大约60个字符。每行具有正确数量的字符是使文本可读的关键。 ”的

如果线太短，视线必须经常返回，这将打破读者的节奏。如果文本行太长，则用户的视线难以聚焦于文本。图像来源：材料设计

对于移动设备，每行应该有30-40个字符。以下是在移动设备上查看的两个代购源码网站的示例。第一种是每行使用50-75个字符（每行用于打印和桌面的最佳字符数），而第二个使用最好的30-40个字符。

图片来源：Usertesting

在网页设计中，您可以使用em或像素来限制文本的宽度，从而实现每行的最佳字符数。

4.选择适用于各种尺寸的字体。用户将从具有不同屏幕尺寸和分辨率的设备访问您的代购源码网站。大多数用户界面需要各种大小的文本元素（按钮副本，字段标签，章节标题等）。选择一种适用于各种尺寸和重量的字体非常重要，以保持每种尺寸的可读性和可用性。

谷歌的Roboto字体

确保在较小的屏幕上说明所选字体是清晰可辨的！尽量避免使用草书字体，例如Vivaldi（在下面的例子中）：尽管它们很漂亮，但它们很难阅读。

维瓦尔第字体难以在小屏幕上阅读

5.使用可区分字母的字体。许多字体使类似的字形容易混淆，特别是对于“i”。和“L” （如下图所示）和小字母间距的空格，例如当“ R”的并且&ndquo; n”看起来像“M””。因此，在选择排版时，请务必在不同的文本环境中检查排版，以确保它不会给用户带来问题。

6.避免大写所有文本的所有大写字母：表示文本中的所有大写字母，在不涉及阅读的上下文中很好（例如首字母缩略词或徽标），但是当您的信息涉及阅读时，请勿强制用户阅读全部大写文字。正如Miles Tinker所说，在他的标志性作品中，可读的打印，所有大写和小写排版都大大降低了用户的阅读速度。

7.行间距的重要性在排版中，我们对两行文本之间的间距（或行高）有一个特殊术语。通过增加行高，可以增加文本行之间的垂直空白，通常可以提高可读性以换取屏幕空间。通常，线高应为字符高度的30％，以提高可读性。

良好的间距有助于提高可读性。图片来源：微软

正如Dmitry Fadeyev指出的那样，正确使用段落之间的差距已被证明可以使理解增加20％。使用空白的技巧是为用户提供易消化的内容，然后去掉不相关的细节。

左：几乎重叠的文字。右：良好的间距有助于提高可读性。图片来源：Apple

8.确保你有足够的色彩对比度。不要在文本和背景中使用相同或相似的颜色。文本越明显，用户读取的速度就越快。 W3C建议将正文和图像文本对比如下：

1.与背景相比，小写文本的对比度应至少为4.5：1。 2.大文本（14pt /正常18pt及以上）的背景对比度应至少为3：1。

这些文本行不符合颜色对比度建议，并且难以根据背景颜色读取。

这些文本行符合颜色对比度建议，易于阅读背景颜色。

选择颜色后，必须在大多数设备上使用真实用户对其进行测试。如果测试显示读取副本有问题，您可以确定您的用户遇到完全相同的问题。

9.避免红色或绿色文本色盲是常见现象，尤其是男性（8％的男性是色盲），建议使用这些颜色以外的颜色来区分重要信息。同时避免单独使用红色和绿色来传达信息，因为红色和绿色盲是最常见的色盲形式。

10.避免使用可能导致敏感个体癫痫发作的闪烁文本闪烁内容。它不仅会导致癫痫发作，而且对普通用户来说也很烦人并且分散注意力。

避免闪烁文字！

结论排版是一件很重要的事情。做出正确的排版选择可以使您的代购源码网站看起来更优雅。另一方面，糟糕的排版选择可能会分散注意力，并经常引起对排版的关注。使排版可读，易懂和清晰是至关重要的。

内容排版的存在是为了荣誉

排版应该以不增加用户认知负荷的方式尊重内容。

原文地址：https://uxplanet.org/10-tips-on-typography-in-web-design-13a378f4aa0d原作者：Nick Babich译者：SKYUI

« SEO如何优化关键字排名？这个技巧天龙的八个“步骤”将会看到 | 代购源码网站优化始于SEO希望看到结果必须从细节 »