西方的先进字体排版资源

作为设计师，学会选择排版类型是一项重要的技能，文字是你与用户沟通的主要方法之一，而排版可以决定你设计的成败。

排版优美而又复杂，有些设计师热衷于版式的设计，这几乎贯穿了他们整个设计生涯。他们同时也提供给我们很多可供选择的在线资源。

本文旨在在设计的起点上帮助你了解如何选择版式类型，你将摆脱常规字体的束缚去探索更多字体以及字体之间的搭配。

确定你的设计目标

确定目标是你做任何设计的前提，你想传达怎样的信息？什么样的设计媒介？

好的设计可以将排版与设计目标紧密相连。因为排版是传达情感、基调、与风格的关键。

举个栗子，如果你要设计一款插画风格的贺卡，那就选择一款能够融入插画的字体，并且将整个版式与设计协调一致。

如果你要设计一款图形驱动的登陆页，那就选择一款不会影响观看体验的简单字体。

确定你的目标用户

这一步至关重要，因为用户年龄和兴趣会影响字体以及版式选择.

举个栗子，一些字体更适合孩子，当学习阅读时，孩子们需要高度清晰的字体，所以字体要很大。Sassoon Primary就是个很好的例子，Sassoon Primary由Rosemary Sassoon开发，并基于她对，更适合孩子阅读的字母的一项研究而创立。

有些字体更适合老年人，这种“老年字体”大小适度、对比度较高、拒绝衬线和一些装饰性的点缀。

选择版式时多考虑你的用户和他们的需求，说白了就是站在用户的角度考虑问题。

寻找灵感

观察其他设计师的工作流程，试着去体会他们对于版式选择所做的决定。

字体灵感

对于寻找字体灵感来说，CreativeBloq 的 The 100 Best Free Fonts可以提供很棒的资源，在文章中，CreativeBloq解释了每种字体选择背后的一些心思。

Awwwards的100 Greatest Free Fonts Collection for 2015也是个不错的网站。

Invision还编制了一个 giant repo of typography resources，你一定会在那找到很多灵感！

Typ.io.可以让你从实际网站中找到字体灵感，此外，该网站还提供了每个灵感样本底部的CSS字体定义。

除了访问专业的字体灵感网站外，你还可以查看你喜欢的网站所用的字体，它就是WhatTheFont；google上的扩展插件，它可以通过将鼠标悬停的方式查看字体。

字体组合灵感

不仅是字体，更要关注字体之间的组合，同字体本身一样重要，合适的字体组合有助于建立视觉层级，并提高设计的可读性。

Typewolf.的字体组合灵感来自各种不同的网站，除此之外，他们也提供字体推荐和一些资深的排版指南，这可是版式爱好者的福利哦！

FontPair上也提供一些字体组合上的灵感，并专门针对Google字体。可以按类型风格组合排序，如无衬线和衬线，或衬线和衬线。

最后要讲的是，有多名设计师所创建的在线字体搭配收集方案，如Typography: Google Fonts Combinations和 Typography: Google Fonts Combinations Volume 2，只需在Behance和Dribbble等网站上搜索“font pairing” 即可。

选择属于你的字体

经过一番研究与灵感获取之后想必你已经有了十足的把握，关于字体选择，请牢记以下原则：可读性，易读性和目标。

选择常规且易于阅读的字体。避免装饰过度的字体，倾向与一些简单实用的字体。还有要考虑字体的应用场景，例如，一些字体更适合作为标题而不是正文。

为此，在选择字体之前，要预期设计将要达到的效果。

在字体搭配方面，保持简单，最多选择三种不同的字体。此外，有对比性的字体可以搭配使用，这有助于引导读者的视线，先是标题然后是文本，还可以通过不同的字体大小，颜色和重量來创造视觉对比。

网站字体，可以使用Google Fonts，Typekit和Font Squirrel，Google Fonts是免费的，Typekit和Font Squirrel都有免费和付费的字体。

确定字体大小

下面就是确定字体大小了，Adobe公司的Tim Brown创建了Modular Scale，这是创建模块化比例的主要工具。通过历史上那些熟知的比例來创建字体尺寸。

例如：你可以以黄金比例为依据來创建字体组合的比例，下面是经计算后的前五个选项。

黄金比例(1:1.618)

1.000 x 1.618    = 1.618

1.618 x 1.618    = 2.618

2.618 x 1.618    = 4.236

4.236 x 1.618    = 6.854

6.854 x 1.618    = 11.089

当然，你可能会觉得比例有些大，继续看看黄金比例后期的尺寸变化。

黄金比率（1：1.618）

...

11.089×1.618 = 17.942

17.942×1.618 = 29.03

29.030×1.618 = 46.971

46.971×1.618 = 75.999

75.999×1.618 = 122.966

没错，数字之间的间隔开始变得更大。对于大多数界面来说，可能不太实用。不过还好，Modular Scale有基于几何、大自然和音乐的各种比例。

小二度15点16

主要二8:9

次要三5：6

大三4:5

...

除了黄金比例，你还可以使用例如“完美四号”这样的间隔。

完美四（3：4）

...

9.969×1.333 = 13.288

13.288×1.333 =

17.713

17.713×1.333 = 23.612

23.612×1.333 = 31.475

31.475×1.333 = 41.956 41.956×1.333 = 55.927

一旦选定了一组尺寸，你就可以从列表中挑选字体大小，并将他们四舍五入到最近的整数。

字体大小

标题1：55px

标题2：42px

标题3：31px

标题4：24px

标题5：14px

身体：17px

图片说明：14px

创建一个排版风格的指南

这是整个过程的最后一步，以此來标准化你的设计。

像Sketch这样的程序中，你可以创建共享的文本样式，以便快速插入已经从准则中应用的文本样式。

在此过程中，你可以调整并确定文本属性，如颜色、重量和大小。

选择颜色时，要充分考虑调色板。版式中的颜色要与色板一致。

你的风格指南中要确定包含：字体定义，字体大小，字体颜色和示例用法。

Google的MaterialDesign排版指南就是个很好的例子，还有一些像Mailchimp，Apple和Focus Labs都有很棒的排版指南。

可以说排版是一项实验，他是科学与艺术的融合

我强烈建议你去打破所谓的“舒适区”在设计中探索新的风格。

你最喜欢的字体是什么？可以留言给作者@Jonathan Z. White

或者给码字的人@jeremy和他的朋友们

感谢观看！