Getting Typography Right in Digi

2017-08-31 本文已影响18人 Fetiz

在数字设计中正确使用字体

字体可以成就也可以毁灭一个产品，本文将教会你如何善用字体

15041561034435.jpg

优化字体就是在优化可读性，理解性，可用性，综合所有的一切图形平衡。

这里有10条建议：

1. 尽可能少的使用字体数目

15039840801171.jpg

当你使用太多字体时，所有的字体都在争取注意力。

为了防止发生这种情况，尽可能的限制你用的字体的数量

同时使用超过三种字体，会导致记得设计结构看起来很杂乱，将使用的字体家族限制在一个很小的数目内（两个已经足够多，一个通常也已经很满足需求），并且尽可能的再整篇幅内使用同一个字体。

首先对你的设计主题文字选择一个字体

主题文字通常是你的产品内最常见的元素，将会是你的用户能看到和体验到的，你的主题文字将会占据你设计最大部分的影响力。

尽可能的使用同一个字体，知道你完全掌握

对于初学者，建议最好使用一种字体，直到完全掌握。多使用同一种字体的不同样式，现代字体大多有不同的样式，意味着他们共用统一字重。样式的多样化，可以帮助你在不同位置使用字体。一个很好的例子是苹果的 San Francisco typeface。

15039847339343.png

确定所选的字体家族是互相补充的

如果你还是需要多个字体，确保字体们可以互相补足。下方的 Gerogia 和 Verdana 相比较右边的 Baskerville 与 Impact ，左边的字体表达了相同的价值，悦目的搭配，而右侧则显得过于大的字重导致 Imapct 对整个搭配都带来了极大的阴影。

15039853353396.png

2. 选择正确的字号

15039853655363.png

字号的不同，严重影响到你的屏幕阅读体验：

字太小导致阅读困难，这就导致很多读者会跳过其所呈现的信息。尤其是对于移动设备，小的字对于小且亮的屏幕简直就是阅读灾难。
字太大会导致分心，并且更倾向于单个字本身。

这就是为什么你需要选择合适于你设计的正文。提供一个统一适用所有的标准是不可能的，以下是一些建议：

对于桌面，使用 16 px 或更大的正文字号。不过分大并且适合阅读
iOS 设备：使用至少 11 点的字体，可以适应大多典型阅读距离而不用缩放
Android：最小的可读字体在 12 sp，但仍然建议最少使用 14 sp 在主体文字上。

Tip ：分布式缩放「modular scale」是一种用于确定字号的方式，首先选择一个字体比例，例如黄金比，然后选择一个基本的字号，通过连续加倍或者缩小，得到有序的字号，这些可以帮助你选择不同字号来应用于设计。Gridlover 是一个可以方便确定字号的工具。

3. 左对齐以及留意空白

15039965188330.png

在西方世界，阅读习惯为从上到下，从左到右。将左侧对齐，将会更方便于阅读。左对齐有助于帮助眼睛换行阅读找到左边界。

留白也是非常重要的，要尽量避免一行内只出现了一个单词「widow」。

15039966913779.jpg

4. 选择一个能够在大多字号下良好表现的字体

15039979115673.png

用户会通过各种各样的方式访问你的网页或者 APP，要选择大多时候都能在各种字号下呈现良好可读性的字体。

尽量不要使用草体的脚本字体，这些字体虽然很美观，但是却难以阅读。

15039987850252.png

5. 使用可以区分字母的字体

15039989009496.png

辨识度「Legibility」是用来衡量一个字符于另一个字符在特定的字体中能够多容易辨别出来的概念。并不是所有的字体都优先考虑了辨识度，很多字体将「i」和「l」设计的很难区分。有些时候，字间距也是十分重要的问题，字间距不够，会导致「r」与「n」很容易的被混识为「m」。需要尽量避免使用此类字体，否则会在小屏幕上非常难读。

6. 限制每行的文字长度

15040564395795.png

行长「Line Length」是一段文字的横向长度。长文字是在设计中最常见的问题，每行拥有刚刚合适的文字是阅读体验良好的秘诀。最为主流的观点是，理想的行长在桌面阅读上不能超过60个字符，包含所有的空格在内。这种行长能够积极的影响我们的阅读节奏，人的心会在跳到下一行的时候感到愉悦，只要这个动作不是特别频繁。