您的位置:首页资讯知识加油站 → 资深设计师教你9种组合使用字体的方式

资深设计师教你9种组合使用字体的方式

时间:2011/3/22 19:20:32来源:SoleilNeon's Blog作者:SoleilNeon我要评论(0)

优秀的文字排版对于成为优秀的设计来说至关重要。一个漂亮的设计选择了一个错误的文字排版方式仍然会使整体变得糟糕。但是在超越基本的Serif和Sans Serif字体组合之外的字体组合技巧对于很多设计师来说既棘手又很困惑。尽管怎样才能做出优秀的设计是主观上的意识,但是仍然有一些准则可以指明方向。现在开始,由你来实验和尝试不同的方法。不要害怕在你的设计中尝试新的事物,但是要相信你的眼睛以及作为设计师的直觉。有时候,尽管都按照所谓的准则去做了,但是设计出来的作品仍然看起来很奇怪。

NexusFont(字体预览管理器)v2.7.0.1912官方版
授权:免费软件 大小:5.5M 语言: 多国语言[中文]

匹配气氛

每一种字体都有一种情绪气氛。有些是心情愉快的,有些是有趣的,有些是严肃的,有些是典雅的,有些是专业的。拥有类似情绪气氛的字体能更好的融合起来,而不太容易产生美学上的瑕疵。

例如下面这张图。左边的文字中主体文字为Tahoma字体而标题为Snidely字体,显然他们并不能协调。Snidely是装饰性字体,看起来古怪而恐怖,而Tahoma字体看起来保守而现代。尽管他们并不是最差的搭配,但他们并不是最理想的组合。

typographicmood 9种组合使用字体的方式

图的右边,主体的字体为Neuton,标题的字体为Nevis,两种字体都有类似的情绪气氛,不是太沉闷也不是太正式。这让他们搭配的很好,尽管在外观上有着明显的不同。

匹配字母形式

组成一种字体的字母形式可以是多种多样的,这些变化基于多种因素,比如历史影响和整体风格。找到匹配的字母形式对于找到匹配的字体来说是个好方法,尽管你可能也会从字体风格和其他因素来匹配字体。

最快速的检查字体匹配程度的方法之一是检查a,g,e三个小写字母的字母形式。以下图为例,Aller和Gentium字体在字母形式上相匹配,Helvetica和Museo字体在字母形式上相匹配。4个字体在小写字母a上都有同样的字母形式,而小写字母g就体现出了极大的不同。

letterforms 9种组合使用字体的方式

其他可以检查的字体包括小写字母t(有些字体会有一个尾巴,而有些则没有),小写字母f和小写字母q。不同字体间的不同字母形式并不是个大问题,但是如果希望字体能够协调统一的话,还是尽量选择具有相同或者类似的字母形式的字体为好。

经典的Serif和Sans Serif字体组合

对于文字排版中最常见的组合方式也许就是Serif字体和Sans Serif字体的组合了。因为冲突的几率很小,所以Serif字体和Sans Serif字体的组合很容易实现。只要你主要到了字重和比例,想出错都难。

下图展示了两种组合Serif字体和Sans Serif字体的不同组合方式。左边的例子说明了当文字的比例一致的时候可以组合字体的不同字重。标题字体为Slab Serif字体的ChunkFive,而主体字体为Sans Serif的Junction。两者都有强烈的视觉效果,但是标题的字体使主体看起来并不是那么的抢眼。

serif sansserif 9种组合使用字体的方式

图的右边看起来就有些传统,字体选择非常接近。标题字体为Junction,而主体字体为Prociono,两者看起来都很轻,字母形式上也很接近。

使用颜色捆绑起来

如果你正在使用大量的不同的字体,那么尝试使用色彩来将他们捆绑起来。让所有东西都使用一种颜色看起来融洽而统一。

看看下面这张图,颜色会留下巨大的印象,每行文字除了颜色之外都一样。但没有一个是能够成为好设计的,上方的文字没能在字体上保持协调统一,下方的文字就像是幼儿园的小朋友在绘画课上的涂鸦。

color 9种组合使用字体的方式

下面的图显示了色彩的统一是多么的重要,特别是当你忽略了本文中的其他几条准则的时候,色彩的统一更是关键。如果你希望在不同的字体间增加对比是很容易的,只需使用不同的颜色即可。

color 2 9种组合使用字体的方式

使用淡淡的色彩上的不同就足够增加文字上的视觉效果。这两行字使用了Fontin和Fontin Sans字体,他们是同一个字体家族中的字体,因此具有非常接近的外观。

相同的比例

比例是最需要考虑到的地方,特别是在标题或者Logo的统一行文本中使用不同字体的时候。具有相同比例的字体比不同比例的字体混合起来更轻松并且看起来更像是一个整体。

最快速的检查比例的方法是对比字体的x高度。简单来说,拥有相同的x高度的字体在整体的比例上也基本一致。在下图中,Helvetica字体和Neuton字体具有相同的x高度。

x height 9种组合使用字体的方式

通过对比,Bolton字体的x高度太高了,而Primer字体的x高度又太低了。检查其他字母可以确保字体是否协调,但是从x高度检查是个很好的开始。

同样需要检查其他不同字体中的不同字母的宽度。只需检查较宽的字母比如m,w,o,以及较窄的字体比如t,f,j。当这些字母具有相同的宽度的时候字体之间才达到最好的协调程度。

相同的字重

拥有完全不同的自重的字体可以搭配起来,但是看起来就没有具有相同字重的字体搭配起来的协调性更好。

当字重很大的字体和字重很轻的字体组合起来的时候,常见的问题就是字重很小的字体显得非常的不起眼。这在标题使用字重大的字体,正文使用字重小的字体中的效果更为明显。

看下面的这张图,标题的字体(Charlie Brown M54)完全压制住了正文的字体(TitilliumText14L Regular)。

fontweights 9种组合使用字体的方式

上图中,增加正文的字重能够协调统一。这永远是一种方法,尽管他会限制你在设计中使用不同的样式。最简单的方法就是寻找能够匹配不同字重的字体。

不要忽视单一字体

有很多同一字体家族中包含多种不同的字体。例如Fontin字体(以及Fontin Sans字体)具有多种不同的字重,能够创作出多种不同的视觉效果。

对于不同的字重和风格怎么才能产生多种不同的视觉效果来说,下图是个很好的例子。因为都基于同一个字体家族,因此也就不需要担心不同字体间的冲突问题。

fontvariations 9种组合使用字体的方式

冲突与对比

文字排版中的对比是有益的。使用不同字体的出发点是为了让不同的字体不同于另外的字体,这对于整体设计的视觉效果有贡献作用。但如果字体过于接近,那么彼此就相互冲突,而不是对比或补充。

以下图为例。第一行的字体非常接近(Hoefler Text和Goudy Bookletter 1911),没有任何的对比,反而使彼此看起来很奇怪。

conflict contrast 9种组合使用字体的方式

第二行效果好很多,字体分别为ChunkFive和Geneva。两个字体具有相类似的比例,但是外形上又有较大的不同,于是对比产生了。

第三行,证明了为什么仅仅使用不同的字体并不能带来好的对比。这就是为什么组合使用字体的时候不能仅仅只关注一个方面的因素。

强烈的对比

字体之间的强烈的对比能够为设计带来视觉亮点。这并不是说把任意两种字体放在一起就能带来好效果。你仍然需要记住基本的准则,然后决定去依照哪几条准则去做,忽视掉另外的哪几条准则。

最简单的使用完全不同的字体来创作文字设计的方法是记住比例。关注字体的整体比例尤其是x高度。

组合大量的不同字体的时候你可能需要调整不同字母的大小,因为不是所有的字体在同样字号下都有同样的大小。看看下面的例子。

combiningfonts 9种组合使用字体的方式

第一行使用了大量的不同的字体,但是他们全部都是装饰性的字体。这让他们拥有了一个同一的风格,并且形成了整体,尽管在比例和字重上有着不同。

第二行只使用了3种字体,两个是Sans-Serif字体一个是Serif字体。这些字体有很多地方都保持一致。第一他们字重上接近,最终的字体用于最短的部分,最轻的字体用于最长的部分,这样视觉上就平衡了。字母的宽度也保持着一致。最后3种字体的字母边缘都有着同样的圆滑效果。

总的来说,组合字体设计是个主观的概念,但是需要记住怎么才能创造出优秀的设计能够帮助你朝着正确的方向前进。

相关视频

    没有数据

相关阅读 尖叫字体怎么弄 微信尖叫字体怎么打开RightFont怎么用?字体管理工具RightFont使用教程微信怎么发特技字体 微信中发送特技字体教程iPhone6s怎么改字体?iPhone6s越狱改字体ios9.0.1系统怎么改字体 ios9字体怎么换如何更改Mac OS X中的邮件字体大小?iOS 8vs iOS 9字体大比拼ios9 苹方字体 ios9字体

文章评论
发表评论

热门文章 携号转网什么时候实行谷歌浏览器“Adobe Fl2015双11怎么抢红包_2odysseusota4win图文教

最新文章 2022蚂蚁庄园6月22日今2022蚂蚁庄园6月21日今 2022蚂蚁庄园6月20日今日答案 度量衡是我国2022蚂蚁庄园6月17日今日答案 夏季甜品烧仙2022蚂蚁庄园6月16日今日答案 为了减肥每天2022蚂蚁庄园6月15日今日答案 卫生纸和面巾

人气排行 B站答题答案大全 哔哩哔哩答题答案2019弹幕ipad3和ipad2的8大区别nfc功能是什么 nfc怎么用 NFC功能的手机有哪全国青少年禁毒知识竞赛在线答题 全国青少年bd版是什么意思?bd版和dvd版哪个好?手机cpu天梯图2020最新版11月 手机cpu性能天BD职位是什么?BD职业解析!硬盘划分主分区、扩展分区、逻辑分区、活动