了解字体的基础知识

在上一节课中,我们回顾了文字发展的历史,探讨了字体在平面设计中的功能。从中我们了解到:字体是为内容服务,选择一款字体的标准是「给读者打造一个合适的阅读体验」。

作为信息的载体,字体的选择决定了你的设计作品能否言之有物,不沦为只为吸引眼球的花瓶。不过,在正式开始介绍选择字体的技巧之前,我们要先对字体有充足的了解,这样才能「知其所以然」,在不同的设计中灵活运用字体,而不是抱着一两款所谓的万能字体走天下。

在这一节课中,我们便来学习字体的基础知识。

之所以从英文字体讲起,是因为英文字体的特征更加显而易见。

在看剧的时候,尤其是美剧或英剧开头的几集,尤其是那些没有熟悉演员的情况下,很容易分不清谁是谁。在看过此剧三到四集之后,脸盲症自然就消失了。

看剧时候的脸盲症并不是严格意义上的脸盲症,我们之所以会有类似于脸盲症的体验,是因为我们对欧美人的五官特征没有足够的判断经验。而到了第三第四集,我们逐渐看出了面孔之间的区别并记住了他们的特征。(比如发型、眼型、嘴形、身高、肩宽……)

对于字体,你或许也有脸盲症般的体验,比如下面这两个字体,你能看出他们的区别有多少吗?

由于文字是平面构成和信息传达中非常重要的一环,而字体的重要性我们在上一节已经讲述过了。那么,选对字体的前提便是能明确的知道字体的特征和区别。

所以本节我们会像认识人一样,通过学习字体的特征,看出字体的区别,克服「字体脸盲症」。下面让我们来依次认识一下英文字体的关键特征。

衬线,是指笔画末端的装饰线,是否有衬线是区分不同英文字体最显著的特征。有衬线的字体叫做衬线字体(Serif),而没有的则是非衬线(Sans-Serif)。(「Serif」意为「衬线」,「Sans」在法文中意为「没有」)

衬线体是古典的英文字体,源于古罗马的石刻拉丁字母。1968年爱德华·卡蒂奇神甫在其著作《衬线的起源》一书中指出,在石刻时人们会先用方头笔将字写在石头上,再按照痕迹刻画。由于方头笔画出的笔画起笔处和收尾处比较粗糙,于是就加上了衬线。

在传统印刷中,衬线字体常用于正文。因为衬线有视觉引导的作用,可以加快读者的阅读速度。但在现代排印中已经不再有这样的死规矩,非衬线体也有不错的阅读体验,但传统的纸媒仍然坚持使用衬线体。

另外,并不是所有衬线字体的衬线都是一样的。有些字体的衬线会更加尖锐,有些则更加圆滑。大家可以观察下图中S起笔处的区别看出衬线形状的不同。

非衬线体的出现比较晚,有说法是起源于希腊的字母形式和罗马帝国的非正式铭文,80年代开始兴起。非衬线字体曾经被称作「Grotesque」(荒唐的)或者「Gothic」(哥特的),这反映了早期人们对非衬线体的看法。如果你看到了某个叫做「xxxgrotesque」的字体,那么他的意思就是「xxx非衬线体」。

非衬线体在早期的电子屏幕上会有更好的显示效果,基本成为了电子显示器上的最佳选择,无论是iOS、Windows还是Android,都选择了非衬线字体作为系统字体。但其实随着高分辨率屏幕的出现,今天的我们大多不需要担心显示效果,而更多是出于功能和美感的考虑去选择字体。

通常情况下,非衬线体可以给人现代、简洁、有科技感的感觉;而衬线体可以给人文艺、古典、端庄的感觉。

x高度指英文小写字母x的高度,它决定了整套字体小写字母的高度,以及p、j、y、f、b这些字母的身材。

一般中英混排时使用x高度较高的英文字体。因为x高度较高的英文字体会显得更加方正一些,和方块字更般配。试着阅读下图中的段落,是不是感觉右边的文段读起来有明显的顿挫感?

字母中x高度以上的部分称为升部,以下部分称为降部。区分他们的线叫做升部线(ascenderline)和降部线(descenderline)。

如果一套字体的x高度越高,那么留给升部和降部的空间就越少,字体会显得比较憨厚、稳重。相反的,如果升部和降部都比较伸展,字体会显得比较清秀、飘逸、活跃。

不同字体的升部和降部也会有不同的形状和尺寸,比如下图中五款字体对于字母y降部的处理就各有千秋。

字怀是字母的全封闭或半封闭区域,他其实是文字中的留白,留白越大对比度就越高。字怀的形状和大小是区分字体的重要特征。

通常字怀较大的字体会更舒展,稳定,容易阅读;字怀较小的字体看起来更有个性。除了大小,字怀也有形状之分,比如GillSans几乎为正圆的字怀看上去很有几何感。

观察字母o可以轻易找到中轴线,中轴线决定了字体的重心,非衬线字体的中轴线通常是竖直的,衬线体的中轴线通常是倾斜的。

通常竖直中轴线的字体偏几何化(比如字母O像一个圆形而非椭圆形)所以看上去更加现代,标准,工业化因为这种完美的圆形很像是标准化的工业制品;而倾斜中轴线的字体则像是手写出来的(想象一下用平头笔书写字母O,左右两边自然会粗一些),更有人文气息。

字体设计是一个极其细致的工作,单个字母的毫厘之差放在大段文字中就是千里之别。字体的小细节也是我们区别字体的重要依据,也蕴含着字体设计师的巧思,让我们尝试去找这些字体设计的细节吧:

第一个小细节是文字的写法。英文中a与g都有两种写法,有两个字怀叫doublestory,有一个字怀叫singlestory。同一种字体通常选择同一种写法来处理a和g,非衬线体常用singlestory的写法,doublestory更多出现在衬线体中。

第二个小细节是笔画结束时的角度和方向,也能区分字体,尤其是小写字母e的末端。同一款字体通常会保持同样的角度和方向、同一种笔画结尾风格。末端较平的字体看上去比较稳定,末端有角度的字体看上去更灵动。

字母R的结尾也是重点观察的对象,下图这三款字体都是根据其中AkzidenzGrotesk演化而来,但对字母R结尾的处理各不相同。

第三个小细节是「点」,尤其是字母i、j上的点。有些字体使用方形点,视觉上会和下方的竖线更加接近。

不同字体的数字风格也有不同处理,有old-style和lining两种。

old-stylefigures的数字拥有大小写字母一样的升部和降部,适合大小写字母协调;Lining则高度统一,和中文字体配合更加和谐,Old-stylefigures拥有升部和降部的特点更能配合英文字体的美感。不过Old-stylefigures同时阅读起来也相对慢一些,在讲究阅读效率的场景下(比如数据表格),Liningfigures更合适一些。

如果你想深度了解西文字体,可以阅读这本《西文字体:字体的背景知识和使用方法》。

本书的作者小林章是一位日籍著名字体设计师,任Monotype字体总监,曾参与Optima等著名字体的改刻,以及腾讯字体的设计。这本书对西文字体的基础术语概括全面,还包括一些知名字体的解析以及故事,是非常好的英文字体入门书籍。读完这本书之后,你会对很多经典的英文字体了如指掌,并且进一步加深对西文字体构造的认识,甚至对字体的选择和搭配有所了解。

下面,让我们趁热打铁,试试我们所学到的区分技巧能否让我们摆脱「字体脸盲症」。

至此,我们已经学习了英文字体的9个特性。下面试试来一起区分,我们将给出三组相似的英文字体,推荐大家先自己看一分钟,尝试描述两个字体之间的区别,再看解析。

解析:同为衬线字体,两者的关键区别在衬线。

解析:两款字体都因国际主义设计风格而流行,当时Helvetica的设计目的就是与AkzidenzGrotesk竞争,其设计也是从AkzidenzGrotesk改造而来,但也有所区别。

国际主义设计风格强调干净、易读、客观,其主要特征包括非对称排版、栅格、无衬线字体(如Akzidenz-Grotesk)、靠左对齐而右边不齐等。此外,这一风格更倾向于使用摄影,而非插图或绘画。许多早期的国际主义风格的作品将字体排印作为主要的设计元素,而不仅仅只用于正文之中,这也是其英文名称「InternationalTypographicStyle」(国际字体风格)得名的原因。时至今日,该运动对平面设计策略与理论仍有着深远的影响。

解析:上面的Roboto是Android系统的默认英文字体,下面的SanFrancisco则是iOS的默认英文字体,两个字体都是为了屏幕显示和扁平化的界面而设计,有些神似。

讲完了如何辨识英文字体,我们接着讲中文字体。大家不必害怕,因为中文的字体特征和英文有非常多共通之处。

对于中文字体,我们仍然可以将其分为「衬线字体」和「非衬线字体」两种。书法中的「顿笔」,印刷字体末尾三角都可以算作衬线。

所谓顿笔,是书法中在笔画开头和末尾处更多用力并多做停留的一种手法。通过顿笔,笔画的开头和末尾会显得更粗且富有变化,字体看上去就更有美感。

顿笔放在印刷字体中就是一种衬线。而一些印刷字体,比如宋体,在顿笔处理上更加几何化,比如「一」字的末尾就处理成了类似三角形。

衬线字体显得比较有古典韵味。非衬线体在电子显示媒介上应用广泛,传播信息更加清晰,但也少了些书法之美。与英文字体相同,衬线字体的衬线也各式各样,对比衬线形态是区分字体的好办法。

我们常见的宋体与楷体属于衬线体,而黑体则属于非衬线体。虽然楷体与宋体都可以认为是衬线体,但楷体更加偏向模拟毛笔书写,而宋体则更加锋利平整,适合打印。

与英文字体「字怀」一样,字怀是文字内中空的空间,也叫内白、字谷。与英文字体不同的是,汉字的字数多且笔画差距大,有些笔画少的字天生字怀大,笔画多的字自然字怀较小,而英文字母相对平均一些。

观察「口、回、国」三个字,你会发现最简单的「口」字反而内白最小,这是因为「口」字中心是空的,视觉上会显得很空很大,所以字体设计者通过缩小内白的方式来达到视觉上的平衡。

字怀偏大的字体观感稳定,反之则比较灵动。内白均衡的字体视觉更稳定均衡,适于阅读。而内白对比强烈的字体(如书法字体)会更有律动。目前市面上的印刷字体大多追求内白上的均衡。

重心指的是字体的纵向视觉中心,通常会比几何中心偏上一些。让字体「看起来是一套」的重要手法就是重心位置一致,不同字体的重心略有不同。

重心决定了字的身材比例,重心越低越稳重,字面越高越高挑轻盈。最近几年新设计的字体都倾向于提高字体重心,增加轻盈感。比如1997年的微软雅黑、2015年的苹方、2019年的OPPOSans,重心在不断提高。

字面,可以理解为字所占的面积。同样字号的字体,有些显得大有些显得小,这就是字面的不同。字面大的字体会观感比较稳重,字面小的观看会比较清秀。

中文字体中也有一些小细节,同样可以帮你区分字体。

喇叭口是笔画末端变宽的部分。喇叭口最初是由于铅字印刷的技术限制,导致笔画开始和结束的地方着色较少,显得圆润不锋利。于是字体设计师在笔画两端稍微加粗,也就是加了喇叭口,印刷出来的效果就能达到视觉上的均衡。

而如今的屏幕清晰度已经可以精确地显示字体,喇叭口已经由「技术限制」变为「审美选项」,它能让字体看上去更有力道和韵味。在苹果推出「苹方」字体前使用的「华文黑体」就是有喇叭口的。但由于在屏幕上出现喇叭口并非本意,近些年带喇叭口的字体出现频率越来越低,甚至有些「古典黑体」的感觉。还记得BellCentennial吗?

BellCentennial

Figma官网,使用了由DINAMO设计的Whyte字体

「折」笔画是分辨字体的好办法。不同字体「折」的角度、顿笔(衬线)的形状、笔画结束形态都可能有所不同。下图可以看出,华文宋体的折在结束的时候有一种笔逐渐离开纸面的感觉。思远宋体则感觉是用了一些力再离开纸面,比较丰满。

记得小学写「心」字的时候,这三个点儿一直点不对地方。「点」在中文字体中可比想象中要复杂,点的弧度、长度、位置都会呈现不同的气质,况且很多字不只有一个点。我们可以通过对比「点」这个简单笔画分辨字体。

下面这对「三点水」的例子可以看出:苹方的「点」是带有弧度的,旗黑的「点」是直的。试着眯起眼来看一下,你会感觉苹方的更加柔和,旗黑的更加坚定。下面这张图说明了「点」这样一个简单的笔画可以带来怎样的不同:

以上便是我们介绍的七种中文字体的特征了,如果你对中文字体想有更深入的了解,这里有三个延伸阅读推荐给你:

《中国字体设计人:一字一生》—廖洁连:相比上一期推荐的《西文字体》,这本书更加有文化积淀,通过采访十二位中文字体设计人,讲述了中文字体设计的产生和变迁,也反映了社会的变化。整本书虽然气氛悲观,但能从其中了解不少关于中文字体设计背后的艰辛以及与西文字体的不同之处。

下面就用我们刚刚了解到的字体特征,尝试区分这些字体吧。

解析:

有什么办法快速对比字体特征?不知道大家有没有在做练习题的的过程中总结出来一些经验,我个人的经验是先粗略看一下两个字体的感觉,再具体抓住一到三个字母进行对比,通常一个字母对比出的区别是可以应用在整套字体上的。

英文字体的特征是否能用在中文字体上?其实中英字体的特征是有很大重叠的,比如衬线就是一模一样的。大家可以先猜测一下本节英文字体的特性可以如何对应到中文字体上。具体的答案大家看下一节就知道了。

找到身边的英文字体,特征是怎样的?这其实是练习题的一个延伸,既然我们已经掌握了一些字体特征知识,那么生活中出现的字体就是我们最好的练习案例。每当看到一个英文字体,都可以花几秒来思考一下该字体的设计特征,并思考一下为什么。长此以往相信你会有更多收获。

中英文字体可以对应吗?读完本章大家应该有明确的感知:中英文字体特征是可以对应的。比如完全相同的衬线概念,内白-字怀;重心-x高度。有了这样的认知,大家可以将中英字体特性看作一个整体的辨识工具,这样更加好记一些。

字体的特征之间是否互相影响?我认为字体特征之间是有所影响的,或者说字体的各个字体特征组合是一体和谐,相互配合的而不是分散独立的。比如说内白和字面,一个是内部的留白一个是整体的面积,两者组合起来可以达成字体的感觉:大内白配合小字面对比小内白配合大字面的感觉是不一样的。

THE END
1.超全面!这可能是最完整的字体设计基础知识!优设网@钱浩Hawking:近些年,字体设计越来越火热,很多小伙伴急于求成跳过了汉字基础知识的学习,直接上手做起了字体设计,很多基础性的错误越来越常见。这也是我写这篇文章的初衷,希望对初学者有所帮助。 文章目录 汉字的发展简史 字体基本笔划 字体基本常识 永字八法 https://www.uisdc.com/basic-knowledge-of-font-design
2.学习字体设计前,先补上这份超全面的字体基础知识铤而走险的话又会容易招到律师函警告,那么怎么办呢?最直接粗暴的方式就是学会字体设计,需要用什么字体就做什么字体,自己动手,丰衣足食。那么学习字体设计应该从哪里开始学呢?今天的这节课,我们就为你开启字体设计的新大门,给你们介绍一些最基础最基础的字体设计知识。https://ziyouziti.com/art-5.html
3.设计理论:字体设计的基本知识心得技巧网页制作设计理论:字体设计的基本知识 文字,是人类思想感情交流的必然产物。随着人类文明的进步,它由简单而复杂,逐步形成了科学的完美而规范化的程式。它既具有人类思想感情的抽象意义与韵调和音响节律,又具有结构完整,章法规范,而又变化无穷的鲜明形象。尤其是象形文字,更是抽象与具象的紧密结合,其文字https://www.jb51.net/web/7100_all.html
4.字体设计的基本原则字体设计的方法有哪些→MAIGOO知识字体设计最基本的功能就是传达信息。字体设计最重要的一点在于要服从表述主题的要求,要与其内容吻合一致,不能相互脱离,更不能相互冲突,破坏文字的诉求效果。尤其在商品广告的字体设计上,更应该注意任何一条标题、一个字体标志、一个商品品牌都是有其自身内涵的,将它正确无误地传达给消费者,是字体设计的目的,否则,将https://www.maigoo.com/goomai/322094.html
5.字体设计自考重点知识点有哪些?字体设计自考重点知识点有哪些? 一、学习目的和要求 通过学习使学生掌握汉字中的基础字体宋体、黑体,以及英文字体罗马体和无饰线体等字体的笔画特征和结构安排,以及创意变体字的设计要求、设计程序、设计方法,培养学生进行字体设计的基本技能。 要求学生可以正确的书写汉字中的基础字体宋体、黑体,以及英文字体罗马体和无https://www.eol.cn/baokao/xueliti/xueli/2023042113357.html
6.写字教学设计写字教学设计12 第(1)课时 课题: 书法---写字基本知识课型:新授课 教学目标: 1、初步掌握书写的姿势,了解钢笔书写的特点。 2、了解我国书法发展的历史。 3、掌握基本笔画的书写特点。 重点: 基本笔画的书写。 难点: 运笔的技法。 教学过程: 一、了解书法的发展史及字体的分类: https://mip.oh100.com/kaoshi/jiaoxuesheji/645730.html
7.写字课的教学设计(精选7篇)写字课的教学设计6 第(1)课时 课题: 书法---写字基本知识课型:新授课 教学目标: 1、初步掌握书写的姿势,了解钢笔书写的特点。 2、了解我国书法发展的历史。 3、掌握基本笔画的书写特点。 重点: 基本笔画的书写。 难点: 运笔的技法。 教学过程: 一、了解书法的发展史及字体的分类: https://www.ruiwen.com/jiaoxuesheji/5149925.html
8.平面设计L:具有终身学习的能力和习惯,不断更新和拓展自身的知识和技能。 5.2层级目标 5.2.1中级技能 培养面向广告设计、图文制作、出版印刷等类型企业就业,适应广告设计师职业岗位群 (如广告设计师、美工、设计师助理、美术编辑等)工作,胜任图像处理、图形绘制、版式编排、字体设计、标志设计、招贴设计、书籍画册设计、包装设计http://www.kfjx.com/xxfwx/xkjs/pmsj.htm
9.书法课程教学设计案例(7篇)一、了解书法的发展史及字体的分类: 1、介绍我国书法的发展的历史。 2、介绍基本书体:颜、柳、赵、欧体,分类出示范本,边欣赏边讲解。 二、讲解书写的基本知识和要求: 1、书写姿势:做到“三个一”:一拳、一尺、一寸(师及时指正) 2、了解钢笔的性能:笔头富有弹性;选择出水顺畅的钢笔;及时地清洗钢笔;选择易溶解http://www.jiaoyubaba.com/jiaoan/29892.html
10.书法课的教案(通用24篇)一、了解书法的发展史及字体的分类: 1、介绍我国书法的发展的历史。 2、介绍基本书体:颜、柳、赵、欧体,分类出示范本,边欣赏边讲解。 二、讲解书写的基本知识和要求: 1、书写姿势:做到“三个一”:一拳、一尺、一寸(师及时指正) 2、了解钢笔的性能:笔头富有弹性;选择出水顺畅的钢笔;及时地清洗钢笔;选择易溶解https://www.jy135.com/jiaoan/1321506.html
11.《字的创意设计》优秀教案(通用5篇)重点:了解汉字的历史,掌握美术字体艺术设计的基本知识、技巧、方法。 教学难点 难点:字体设计的创意。对同学分析能力、应变能力和形象思维能力的培养,使他们能抓住字义、字形、结构等汉字基本特征,灵活、合理地进行变体,使原字体变得更形象、美观、活泼,达到创新的.目的。 https://www.unjs.com/jiaoan/qita/20230128131001_6329757.html
12.字体排版基础知识阿光2022-08-31· 云南 推荐文章中文字体设计基础知识13628阅读12赞 字体排版基础知识-第一节3249阅读6赞1评论 字体排版小技巧3914阅读2赞 字体的基本属性0219420阅读7赞 读《网易设计师:做好文字排版的小技巧》笔记1990阅读6赞 中西字体搭配清单2248阅读7赞1评论 喜欢4https://m.clzg.cn/article.html?id=395912
13.平面设计专业基础知识12.商业海报设计:海报设计基础知识,海报的设计内容,海报的表现形式,海报的设计准则,海报构图,海报的字体安排,海报的规格。 13.企业形象识别系统(VI)设计: 的基本知识,CIS的具体组成部分,优秀VI对企业的重要意义,VI设计的基本原则,VI设计的流程。 14.报纸广告设计:报纸广告设计基础知识,报纸稿版式,报纸稿设计要点。https://www.yjbys.com/edu/pingmiansheji/407547.html
14.小学书法教育论文(精选11篇)但在实际教学中艺术设计专业的书法教学应该有更高的要求,实用的目的是首要的,但不能仅仅定位在实用这一最浅层次,如果是这样,书法本身所具有的丰富内涵和功能都不会得到发挥。因而,正确的观点是:使学生掌握基本的理论知识和基本技能,注重实用和审美两者兼顾,培养具有较高的艺术设计人才。https://mip.wenshubang.com/xiaoxuejiaoyubiyelunwen/986498.html
15.05712艺术设计基础本课程的前修课程是视听语言、电影史、影视编导等。视听语言是一门研究视听媒介及其语言艺术的课程,电影史、影视概论是介绍影视方面的相关基础知识,这两门课程可以帮助我们掌握艺术的基本概念本性,了解艺术设计的基本写作方法并结合具体作品进行分析研究,从而更好地掌握动画设计基础知识。 https://www.jseea.cn/webfile/selflearning_jcdg/2009-06-01/5660.html
16.字体设计课题研究论文(五篇):字体设计表现形式的方法研究新媒体本文通过对字体的发展演变史的梳理,对字体表现形式、技巧进行汇总,为字体设计研究提供理论依据。 关键词:字体设计;字体表现形式与方法;图形化设计 字体设计,并不只仅仅是指简单的笔画变形。优秀的字体设计往往是具有某种特质和倾向性的视觉符号,它对提升页面设计的品质和视觉表现力都发挥了极其重要的作用。当我们眼前https://m.book118.com/html/2021/0927/7166003103004012.shtm
17.UI设计中的字体使用指南,初学者必备!互联网在进步,所以设计趋势也是有着各种各样不同的形式,而字体作为基本语言,是设计师需要掌握的基本技能之一,希望能对各位读者有所帮助。 另外其实在工作中,也建议大家对自己的经验进行总结,对关键信息进行提炼加以沉淀,一方面能让自己的知识更加牢固,另一方面也可以帮助后来者进行成长。 https://www.douban.com/note/670612979/?from=author&_i=7253433IL1BDIA,7253465WWZoECZ