-
这几天有人问我说：
“
最近看了好多教程，都老
高大上了，但是老弟我做不到
呀，想学点直接能拿来用的，这个要求过分吗
……”
这个，好吧，那就直接说说能用的知识：字体字号。
也许你会说：字体字号？也太
Low
了吧，这个
谁不知道重要呀。
对于这个问题，我想说：会和熟练，是两回
事。一个
App
，不同部分的字体字
号
你能准确地说出来吗？
很多刚做<
/p>
APP
界面的设计师，经常会因为字号，字体颜色，间距而困扰。
拿到设计需求后，开始进行设计，不知道从何去调整界面的字
号和行间距等。
容易碰到的问题是页面和页面的字号调着调着就大小或颜色不统一了。并
且容
易导致设计稿反复得修改。设计出来的效果图文字左右间距层次不齐，导致与
预期不符等。
这小节我将和大家理一理界面
中常用的字体，字号，字体颜色及间距对齐的一
些小经验。希望能对大家有些帮助。
一
.
成也字，败
也字
在设计师的职业生涯中，至少一次甚至多次在工作中因为
字体不协调栽跟头。
在实践的过程中我们会慢慢发现一些规律或者经验规范。接下来我将
和大家一
起聊聊在界面设计中的那些常规字体的使用规范。
<
/p>
我们常常会听到，这也太
LOW
了吧！！
你能统一一下字体吗？
不明确而繁琐的字体搭配会导致整个画
面失调。可以这样说，字体可以成就设
计也可以毁掉设计。
1
/
26
问题的关键有：
1.
字体样式太多，导致页面杂乱
2.
使用的字体不易识别
3.
字体样式和内容的气氛或规范不匹配
怎么避免这样的结果发生呢？
通过设计经验可以帮助你做出更好的版式
了解不同平台的常用字体设计规范
2
/
26
在每个项目设计中只使用
1-2
个字体
样式，而在品牌字有明确的规范的情况
下，只需要一种字体贯穿全文，通过对字体放大来
强调重点文案。字体用的太
多，越显得不够专业。
不同的样式的字体，形状或系列最好相同，保证字体风格的一致性。
字体与背景的层次要分明
确保字体样式与色调气氛相匹配
二<
/p>
.
界面中文字使用的规则
在不同平台的界面设计中规范的字体会有不同，像移动界面的设计就会有固定
的字体样式。网页中会有常用的几个字体，在这我和大家分别介绍一下。
以下是在
72
像素
/
英寸
下的规范
移动端常规字体
IOS:
常选择华文黑体或者冬青黑体，尤其是冬青黑体效果最好。
3
/
26
Android
英文字体：
Roboto
4
/
26
中文字体：
Noto
5
/
26
6
/
26
移动端常用的的字号有哪些呢？
导航主标题字号：
40-42px
<
/p>
我一般设计就用
40px
，偏小的
40px
字号，显得精致些。
在内文展示中字号大小又是多大呢？
大的正文字号
32px,
副文是
26px
，小字
2
0px
在内文的使用中，根据不同类型的
App
会有所区别。
像新闻类的
APP
或文字阅读类的
APP
更注重文
本的阅读便捷性，正文字号
36
px
，
会选择性的加粗。
7
/
26
8
/
26
而列表形式、工具化的
APP
普遍是正文
32px
，不加粗。副文案
26px,
小字
20p
x
26px
的字号还会用于划分类别的提示文案，因为这样的文字希望用户阅读，但
不
要抢过主列表信息的引导。
9
/
26
36px
的字号还经常运用在页面的大按钮中。为了拉开按钮的层次，同时加强按
钮引导性，选用了稍大号的字体。
10
/
26
（见下图中的退出按钮
)
11
/
26
12
/
26
大家注意了，在选用字体大小的时候一定要选择偶数的字号，因为在开发界面
的时候，字
号大小换算是要除以二的。这个详细缘由大家可以网上查询，我就
不在这一一的介绍了。
常用字号的大小基本就这几个，根
据版式设计需要也会采用异样大小的字号来
特殊处理。这种更高的要求设计师的全局把控
能力了。
网页端
常用的字号有哪些呢？
网页中文字字
号一般都是宋体
12px
或
14px(
无状态
)
，大号字体用微软雅黑或
黑体。大号字体是
18px
、
20px
、
26px
、
30px
，一般使用双数字号，单数的字
体
在显示的时候会有毛边。
常用的字体
1.
平平稳稳
:
微软雅黑
/
方正中黑
微软雅黑系列：在网页设计中这款字体使用的非常平凡，这款只无论是放大还
是缩小，形体都非常的规整舒服。在设计过程中建议多使用雅黑，大标题用加
粗字体，正
文用常规字体。
13
/
26
-
-
-
-
-
-
-
-
-
上一篇：五年级信息技术上册第5课《编程乐园》教案
下一篇：含沸的成语16个,带解释例句