如何在设计中选择正确的字体和版式?

11月28日 收藏 30 评论 3 UI/交互

如何在设计中选择正确的字体和版式?

作为一名设计师,你需要学到的最重要的技能之一就是如何选择字体。这是因为文字内容是设计师与用户沟通的主要方式之一,版式可以决定设计的成败。排版工作兼具美感和复杂性,有些人把自己整个职业生涯都献给了字体设计。幸运的是,他们的工作都以文档的形式,很好的记录了下来,让我们在设计时,有大量的资源可以学习。
本文旨在帮助你学习如何选择正确的字体类型。同时,也鼓励大家去探索那些你自己熟悉的字体组合。

一、确定目标

在做任何事情之前,首先都需要确定设计的目标。你想传达的信息是什么?你设计的媒介又是什么?好的设计,会利用好版式并与目标达成一致。这是因为版式在你的设计中是表达情绪、基调和风格的关键。例如:如果你设计的贺卡是走很重的插画风,那么选择一款合适的插画风格字体就很关键。合适的字体风格要与整体的设计调性保持一致。

如果你正在设计一个以图片为核心的登录页面,选择一个不喧宾夺主的简单字体就很关键。使用字体作为一种强化信息传达的方式。如果图片是设计的重点,那么选择简单的字体,图片就会更加突出。

二、确定受众

在确定设计目标之后,接着需要确定目标用户。这一步很关键,因为有关用户的信息,如:年龄、兴趣和文化素养,会直接影响到字体的选择。例如:有些字体更适合给儿童设计时使用。在阅读时,孩子们需要字迹清晰,字型大方的字体。Sassoon Primary 就是一个不错的例子,Sassoon Primary 是由 Rosemary Sassoon 开发的,正是基于她对儿童容易阅读字体的研究,有些字体更适合老人,Senior-friendly 字体有更加易读的尺寸,对比度也足够高,同时也避免了复杂的装饰性笔迹。在选择字体时,要考虑到你的读者和他们的需求。简单来说,需要与你的用户共情。

三、寻找灵感

1.字体灵感

对于字体设计的灵感,CreativeBloq 的《75种最好的免费字体》就是一篇非常棒的文章,可以让你正确地选择字体。在那篇文章中,CreativeBloq 解释了每种字体背后的玄机。
另一个有用的资源是 Awwwards 在2015年发布的《100个最全的免费字体合集》。Invision 也编制了一个版式字体合集,你也可以在那里找到很多灵感资源。想从实际线上网站获得灵感,type.io 这个网站会非常适合。这个网站从网上收集到了大量的字体设计案例,另外,网站中还在每个案例底部提供了css 的字体样式。除了寻找专门的字体网站,也可以去查看你最喜欢的网站,看看他们是如何使用好字体的。「WhatTheFont」是一个很好的工具,它是一个 Chrome 扩展插件,只需要悬停在网页中你希望了解的字体上,就能准确知道它的字体属性了。

2.搭配灵感

除了单个字体,还要看看字体搭配的灵感。合适的字体组合和字体本身一样重要,良好的字体组合有助于建立视觉层级,提高设计的可读性。要获得灵感,可以从 Typewolf 开始。Typewolf 收录了大量来自不同网站的字体组合灵感。除此之外,他们还有字体推荐和高级排版指导,简直就是版式创作者们的宝库。FontPair 还专门为谷歌字体设计了字体搭配灵感。你可以按字体类型组合进行排序,例如:无衬线字体和衬线字体或者衬线字体和衬线字体。

四、选择字体

有了前面的研究和灵感,你就可以选择自己喜欢的字体了。在选择字体时,有三个原则需要记住:可读性、易读性和目标。选择常规且易于阅读的字体,要尽量避免一些装饰性的字体。同时,还要注意到字体的用途。比如:一些字体更适合作为标题而不是正文。因此,在选择字体之前,先研究一下它的预期使用目标。在字体组合方面,保持简单原则,在一个页面中最多使用三种不同的字体。此外,字体的组合需要有明确的对比,这样会有助于引导读者的眼睛,首先应该是标题然后才是正文。同时,你还可以使用不同的字体大小,颜色和字重来完善视觉对比。对于web字体来说,你可以去使用谷歌字体、Typekit 和 Font Squirrel。谷歌字体是免费的,而Typekit 和 Font Squirrel 提供了免费和付费的字体。

五、确定字体大小

确定字体组合后的下一步是确定字体大小。这方面有一个很好的工具,是由 Adobe版式主管 Tim Brown 设计的模块化缩放工具。模块化比例是一种用来识别过往令人满意的搭配比例,以确定字体大小组合的系统。模块化比例是一个系统,用来识别历史上令人满意的比例,以创建规范来确定字体大小。比如:你可以使用基于黄金分割的比例。

版式设计是需要亲自实践才能很好掌握的,它是一门科学,也是一门艺术。我期待你去打破你的舒适区,去探索属于你自己的字体设计经验。

C 3条回复 评论
黑加仑

刚接触Redis,太有用了!!

发表于 2022-02-09 22:00:00
0 0
杜行知

感觉文章思路挺清晰的~

发表于 2022-01-07 23:00:00
0 0
半糖去冰

大厂陆续开放校招了要抓紧时间

发表于 2021-09-14 13:40:00
0 0
Bury

安利一款我用过最好用的接口测试工具——apipost ,页面简洁,操作简单功能也多。

发表于 2021-09-12 18:45:00
0 0
带脑斧

这家笔试好难

发表于 2021-09-09 13:30:00
0 0