界面设计的字体规范:常用字体,字号,字体颜色及间距对齐

今天125网页设计给大家分享界面设计中常用的字体,字号,字体颜色及间距对齐的一些小经验,通过设计经验可以帮助你做出更好的版式,相信大家会有收获。

一、常见界面设计中字体使用问题

1.字体样式太多,导致页面杂乱

2.使用的字体不易识别

3.字体样式和内容的气氛或规范不匹配

二.界面设计中文字的使用规则

移动端常规字体

IOS:常选择华文黑体或者冬青黑体,尤其是冬青黑体效果最好。

界面设计的字体规范:常用字体,字号,字体颜色及间距对齐

Android

英文字体:Roboto

中文字体:Noto

界面设计的字体规范:常用字体,字号,字体颜色及间距对齐

移动端常用字号

导航主标题字号:40-42px

我一般设计就用40px,偏小的40px字号,显得精致些。

界面设计的字体规范:常用字体,字号,字体颜色及间距对齐

内文展示中字号的大小:

大的正文字号32px,副文是26px,小字20px。

在内文的使用中,根据不同类型的App会有所区别。

像新闻类的APP或文字阅读类的APP更注重文本的阅读便捷性,正文字号36px,会选择性的加粗。

界面设计的字体规范:常用字体,字号,字体颜色及间距对齐

而列表形式、工具化的APP普遍是正文32px,不加粗。副文案26px,小字20px

界面设计的字体规范:常用字体,字号,字体颜色及间距对齐

26px的字号还会用于划分类别的提示文案,因为这样的文字希望用户阅读,但不要抢过主列表信息的引导。

界面设计的字体规范:常用字体,字号,字体颜色及间距对齐

36px的字号还经常运用在页面的大按钮中。为了拉开按钮的层次,同时加强按钮引导性,选用了稍大号的字体。

(见下图中的退出按钮)

界面设计的字体规范:常用字体,字号,字体颜色及间距对齐

大家注意了,在选用字体大小的时候一定要选择偶数的字号,因为在开发界面的时候,字号大小换算是要除以二的。

本文转载自Micu设计,原文链接: ,本文观点不代表125jz立场。

(0)
江山如画的头像江山如画管理团队
上一篇 2018年12月29日 上午8:43
下一篇 2018年12月29日 上午9:47

99%的人还看了以下文章

  • 网页制作实战项目三:运动会页面制作

    【时间要求】 2 学时( 45 分钟× 2=90 分钟) 【上机内容】 运动会页面制作 【上机目的】 1 、掌握表格布局的方法和技巧 2 、掌握HTML及CSS的使用 【上机重点】 1 、表格布局 2 、HTML及CSS的使用 【上机难点】 1、导航条的制作 2、CSS的使用 【上机内容】 请在规定时间内制作出以下网页:(要求要符合网站建设的规范!) 所需素…

    2018年4月19日
    9.4K1
  • 福利!13款免费商用黑体字体推荐

    “黑体”结构清晰、简洁有力的字形风格能使版面显得庄重醒目并富有现代感。无论是识别性、适用面、视觉效果都非常好。本期推荐 13 款免费商用黑体,前 6 款为各大品牌开发的黑体字型,后 7 款是在传统黑体上进行设计改造,形成各有特点的黑体变体。 Adobe 和 Google 共同开发的免费黑体。字体设计优雅,显示效果优秀,可以满足不同场景下的文字显示需求。由于字…

    2023年1月20日 网页设计
    7.3K0
  • 决定网页设计品质的9个细节

    细节决定成败”在页面设计中是颠扑不破的真理。一个页面的细节能充分体现出页面的品质。本文介绍了网页设计中的字号、字体、样式、间距、颜色、排版、留白、层次、光影等细节如何处理?

    2020年2月6日 网页设计
    4.4K0
  • 董文利聊颜色搭配-节日经典配色

    网页设计师联盟优秀设计师董文利,董老师系列教程分享,聊颜色,特别是按节日给出的经典配色,牛** 董文利一名靠谱平面设计师/网页设计师/插画设计师。典型80后,爱绘画,玩音乐,不做设计的时候喜欢独自一个人在家附近的江水旁静静的坐上一小会儿。2011年毕业于湖北工业大学艺术设计学院,所修专业是平面设计。

    2021年2月4日
    10.9K0
  • 9种常用的排版小技巧

    分享优秀网页设计发布的9种常用的排版小技巧,不同氛围的文字排版组合,演绎不同的版面风格。 ​​​​

    2020年4月4日 网页设计
    8.1K0
  • 网页上标准的广告尺寸规格大全

    网页中的标准网页广告尺寸规格 一、120*120,这种广告规格适用于产品或新闻照片展示。 二、120*60,这种广告规格主要用于做LOGO使用。 三、120*90,主要应用于产品演示或大型LOGO。 四、125*125,这种规格适于表现照片效果的图像广告。 五、234*60,这种规格适用于框架或左右形式主页的广告链接。 六、392*72,主要用于有较多图片展…

    2020年3月11日
    7.8K0

发表回复

登录后才能评论