认识达内从这里开始

字体设计可以说是网页设计中非常重要的一环，对于提高用户体验等也有突出的贡献。今天我们就一起来了解一下，字体设计中的四个主要设计核心。

一、字体

1.字体设计的重要性

辅助信息传递文字是信息内容的载体，是记录思想、交流思想、承载语言的图像或符号，而字体则是文字的外在形式特征，是文字的视觉风格表现。合适的字体可以辅助文字，将信息清晰、准确地传递给用户。

表达情感体验字体的艺术性体现在其完美的外在形式与丰富的内涵之中。在文字信息传递给用户之前，人们先感受到的是字体带来的视觉魅力以及情感表达。

塑造品牌形象不同字体有着不同的风格特征:有的字体优美清新、线条流畅;有的字体造型规整、充满张力;还有的字体生动活泼、色彩明快…根据产品的属性选择正确的字体，便能有效地塑造品牌形象。

2.界面常用字体推荐

字体的选择是由产品属性或品牌特性的关键词而决定。一般中文字体种类分为:黑体、宋体、仿宋、楷体等;英文字体种类分为:无衬线体、衬线体、意大利斜体、手写体、黑字体等。

中文字体推荐

线上中文字体推荐使用思源黑体、华文黑体、冬青黑体、微软雅黑、苹方-简、黑体-简、方正兰亭黑。其中iOS系统默认中文字体是「苹方(PingFang)」，Android系统中文字体使用「思源黑体(NotoSansCJK)」。

英文字体推荐

线上英文字体推荐使用SanFrancisco、HelveticaNeue、Roboto、AvenirNext、OpenSans。其中iOS系统默认英文字体为「SanFrancisco」，Android系统默认英文字体为「Roboto」。

二、字号

1.关于字号

字号是界面设计中另一个重要的元素，字号大小决定了信息的层级和主次关系，合理有序的字号设置能让界面信息清晰易读、层次分明;相反，糟糕无序的字号使用会让界面混乱不堪，影响阅读体验。

2.字号的选择

字号的选择，可以遵循iOS、MaterialDesign、AntDesign等国内外设计体系中的字号规则，也可以根据产品的特点自行定义。

iOS字号规则在iOS11系统中，使用SanFrancisco作为系统英文字体，包含了以下几种字号的文本样式:

11/12ptCaption(说明文字)

13ptFootnote(脚注)

15ptSubhead(副标题)

16ptCallout(标注)

17ptBody/Headline(正文/模块标题)

20/22/28ptTitle(页面标题)

34ptLargeTitle(页面大标题)

需要注意的是，SanFrancisco字体有两种模式:文本模式(SFProText)和展示模式(SFProDisplay)，文本模式适用于字号小于20pt的文字，展示模式适用于字号大于等于20pt的文字。

MaterialDesign字号规则

12sp小字提示

14sp(桌面端13sp)正文/按钮文字

16sp(桌面端15sp)小标题

20spAppbar文字

24sp大标题

34/45/56/112sp超大号文字

长篇幅正文，每行建议60字符左右，短文本建议每行30字符左右。

AntDesign字号规则

AntDesign受到5音阶以及自然律的启发定义了10种不同的字号，从小到大依次为:12px、14px、16px、20px、24px、30px、38px、46px、56px、68px。

建议主要字号为14px，其余字号的选择可根据具体情况进行自由的定义，尽量控制在3-5种之间，保持克制的原则。

三、行高

1.关于行高

行高可以理解为一个包裹在字体外面的无形的框，字体距框的上下空隙为半行距。

参考W3C原理，眼睛到屏幕的距离为25cm。西文的基本行高通常是字号的1.2倍左右。而中文因为字符密实且高度一致，没有西文的升部和降部来创造行间空隙，所以一般行高需要更大，根据不同人群的特点(儿童、年轻人、老年人)以及使用环境，可达到1.5至2倍甚至更大。

四、字重

1.关于字重

字重是指字体的粗细，一般在字体家族名后面注明的Thin、Light、Regular、Medium、Bold、Heavy等都是字重名称。越来越多的产品界面需要通过字重来拉开信息层次，当下主流趋势iOS11大标题风格就是通过字重来拉开信息层级的。

不同的字重体现不同的层级关系和情绪感受，细的字体给人以细腻、轻盈的感觉，而粗体则给人庄重和严肃的感受，所以在定义字体规范时候需要考虑什么场景用什么字重，从而保持良好阅读体验。

2.字重的设置

字重的设置同样基于秩序、稳定、克制的原则。为了统一整体效果，一般情况下使用两种字重为佳，例如只出现Regular以及Medium这两种字体粗细，特殊情况下可以使用更粗或更细的字重进一步拉开信息层级。当字号大小为12-18pt时，使用Regular;18-24pt时，使用Light;24-32pt时，使用Thin;当字号大小超过32pt时，建议使用Ultralight。以上都是建议值，具体可以根据产品定位和用户特点来设置。

作者：彭彭

节选：公众号：彭彭设计笔记

【免责声明】本文系本网编辑部分转载，转载目的在于传递更多信息，并不代表本网赞同其观点和对其真实性负责。如涉及作品内容、版权和其它问题，请在30日内与管理员联系，我们会予以更改或删除相关文章，以保证您的权益!