10个字体规则提升用户体验_【设计圈】

说到网页设计和app设计，优秀的字体可不仅仅是个漂亮的外观。在这些地方，字体必须具有良好的易读性和可扫描性，...

说到网页设计和app设计，优秀的字体可不仅仅是个漂亮的外观。在这些地方，字体必须具有良好的易读性和可扫描性，同时在视觉上要能与内容紧密关联。这几点非常重要，遗憾的是，大多数设计师在这方面都缺乏实际经验。

在这篇文章中，我们将介绍10个与字体有关的规则，这些规则能帮助你创建更为优越的用户体验（每条规则都有相应的站点作为示范）。

保证易读性

在网页中必须使用无衬线字体的观念已显得过时，但它背后的信息依然非常重要：那就是文本必须易于阅读。

你需要避开难以辨认的字体，例如花体字，黑体字或过于新奇的字体（为了达到特定的艺术效果而使用的装饰性更强的字体属于例外）。

最易读的字体应该是可扫描的，而且这种字体本身不应引起阅读者的注意。这些几乎“隐形”的字体的易读性是如此之高，以至于用户根本不怎么去留意字体本身的风格。

可查看链接 http://builtthings.com/

留出充裕的行间距

若要确保字体具有良好的用户体验，留出足够的行间距是关键的一点。在移动阅读方面，多数略显夸张的行间距都能带来更为轻松的阅读体验，因而这一点显得尤其重要。

许多因素都影响到行间距的数值，例如：

文本大小

文本数量

字体风格

屏幕宽度

调整行间距没有一成不变的规则，但你可以参考以下数值：对大多数网站，将行间距设定为文本大小的125%；对移动设备，将行间距设定为文本大小的150%；设置较为宽松的段落间距，让段落更容易被浏览。

可查看链接 http://justactions.org/

使用圆润的字体

大而平滑的字体阅读起来更为容易。较大的曲线型字体也有更好的易读性。

而密集的字体阅读起来就困难多了。宽疏的字体，例如这篇文章中采用的字体（指原文的字体---译者注）由于很容易区分彼此，因为也更适合阅读。

圆润的字体更接近孩子们刚刚学习阅读和写字时接触的字体。这种审美上的印象会让用户终生难忘。

可查看链接 http://robinmastromarino.com/

赋予字体不同的大小

当你为字体大小感到犹豫不定的时候，把让你看起来觉得舒适的文本再略微调大一点。文本中字体大小基本上取决于你要处理的文本的数量。对大段的文本要特别注意。

虽然不同的设计师文本的数量有不同定义，但多数设计师都认为，每行文本中应包含的最佳字符数在45—60之间。在移动终端上，这一数值会大幅缩小，通常仅为此数值的半数。

可查看链接 https://www.theory11.com/

寻求更高的X高度

字体的高度，特别是小写字体的高度，能极大地影响用户阅读内容时的流畅度。字体的X高度也就是字体中小写字母x的高度。一般来说，x高度越高的字体，阅读起来越容易。

这意味着小写字体需要更接近大写字体的高度。尽量将小写字母的x高度调整为大写字母X高度的三分之二或者四分之三。

可查看链接 http://grainandmortar.com/

学习如何调整字间距

好的调整字间距技巧等于好的字体。

你可能没有时间去一一调整文本正文的字间距，事实上这也没有必要。但对于装饰型的字体，调整字间距必不可少。你需要将每个字符的字间距调整到浑然天成的地步。这一细节将使你的站点从那些忽略了这关键一步的站点中脱颖而出。

可查看链接 http://www.boss.info/promos/waza_amplifier/

考虑整体比例

当你为一个项目创建字体风格时，从整体上考虑所有元素的比例将对你很有帮助。这听上去似乎很复杂，但事实上这么做只会让你的工作更轻松。

再回头看看行间距：它就是一种比例。考虑一下你选择的正文字体，标题和次级标题的大小。你需要决定如何把它们放置在一起才能获取完美和谐的视觉效果。

可查看链接 http://www.google.com/maps/about/behind-the-scenes/streetview/treks/petra/#streetview

笔触尽量保持一致

笔触的宽度对字形的影响不言而喻。笔触极细的字体可能会给阅读造成困难，因为它缺乏对比度。而笔触极粗字体由于难以被眼睛接受，阅读起来同样不易。而粗细笔触对比特别强烈的字体也会有类似的问题。

解决方法：尽量把字体的笔触保持在接近一致的范围。相近的风格更容易辨识，看起来也更为稳定。

可查看链接 http://www.visithumboldt.com/

限制字体的数量

不要超过两种字体。我必须再说一遍：不要超过两种字体。

在任何项目中都应该恪守这条原则。过多的字体会让你的用户发疯，会干扰视线，会给阅读造成困难。总之，过多的字体令人厌烦。

选择两种字体——如果你觉得有必要的话，还可以添加一种用于装饰的字体。规划好每种字体该如何被使用。包括考虑它们的色彩，大小，位置等等。它们在不同的页面和不同的设备上都应保持一致。

可查看链接 http://www.moxhe.com.au/

加强对比

在某些“潮流”设计中，背景与字体间的对比度非常小。这看起来也许很酷，但对用户却不够友好，因为这使阅读变的困难。

内容是网页中最特殊，最重要的东西。增加背景和字体的对比度能让用户更轻松地阅读屏幕上的每个字（这也是淡色的背景搭配黑色或灰色的字体如此流行的原因）。你的站点包含的文本越多，对比度就越重要。如果你看文本时，必须要很费力地眯着眼睛，那说明对比度或许太低了。Color Safe就是一款能帮你创建近乎完美的对比度的工具。

最后，别忘了字体只是影响用户体验的诸多元素之一。

可查看链接 http://elespacio.net/

原文翻译：刘海静

来源：视觉ME