麓言信息UI设计字体排版的10条
1、行高/行间距
首先介绍两个容易混淆的概念——行高和行间距,两者在中英文的用法也有差异。
中文行高:上一行文字的最底部与下一行文字的最底部之间的距离。
中文行间距:上一行文字的最底部与下一行文字的最顶部之间的距离(行与行之间的距离)。
基线是英文字体结构中的概念,英文的行高由基线决定。
英文行高:上一行的基线到下一行基线之间的距离(蓝线标注);
英文行间距:两行字体之间的距离,即上一行的下限线与下一行的上限线之间的距离(橙线标注)。
2、字重/衬线
字重(weight)是指字体的粗细程度。字重的粗细变化为我们在不同场景使用提供了更多选择。
衬线体(serif)是指字形笔画在首尾的装饰和笔画的粗细不同;无衬线体(sans-serif)没有笔画首尾的装饰,笔画粗细相同。
在同等字号下,无衬线字体看上去要比衬线更大,结构也更清晰,所以无衬线字体更适合在屏幕上使用。
3、层级结构
绝大多数UI界面是由一些标准元素组成——文本、矩形/框、按钮和图标。
4、最佳行长
合适的行长能确保文本在不同的设备上都能易于阅读。
这里有行长的基本用法:
中文一个字占两字符,英文一个字占一字符,行长在页面中的最大长度不能超过110个字符;
当字体变小时,增大行高可以获得更好的可读性和易读性。
5、限制字体数量
混合太多不同的字体会让界面设计变得混乱。
选择字体时尽量使用带有多种字重的同一款字体,通过灵活调节字重达到界面统一的效果。
6、定义字体比例
页面中不同的位置(标题、正文、备注)要使用不同比例的字体,从而产生连贯的排版体验。
7、使用可识别的提示
通过上面的原则可以提升界面的可读性和美观性。但是如何提高界面中信息的可理解性呢?
只有真正把设计与信息结合在一起,才能使传达的效率最优化:
避免使用专业术语。除非是为特定人群设计产品,否则应避免使用行业术语。
保持提示简洁明了。例如在访问网站时,将“只有会员才可以访问此功能”修改成“加入会员即可访问”,这样的提示更能切中要点。
8、强调重要信息
使用颜色和视觉权重来强调重要信息,用较浅的文本来展示次要信息。这样能将更多的注意力集中到更具活力的文本上,帮助用户快速做出选择。
9、考虑语言支持
同一个词语的拼写长度会随着语言的不同而变化,所以要有足够的空间来容纳字符。
10、系统字体
如果在字体选择上出现困难,可以考虑使用iOS和Android原生的系统字体。它们支持丰富的字重、尺寸和样式,利用这些字体也能打造舒适的阅读体验。
麓言信息UI设计字体排版的10条相关推荐
- 麓言信息UI设计和平面设计有什么区别?
很多朋友想要入门UI设计,但是总是被别人误以为UI设计与平面设计没啥区别,大家都是干设计的,UI设计很多时候也是做平面设计一样的活儿,事实上是怎么样的呢?UI设计就是平面设计吗?UI设计与平面设计 ...
- 麓言信息UI设计中的动效设计标准与规范
现如今,优秀的界面动效很能让人产生深刻印象,甚至是带来惊喜.它一方面表达了界面之间的交互过程,解释说明如何使用应用,另一方面也能正确引导用户的注意力.本文将界面动效的主要原则和规范做一个收集归纳, ...
- 麓言信息ui设计不会画画可以学吗?
一直想学习一下Ui设计,但是不会画画,又担心能不能学好,该怎么办?其实这是一个很简单的问题,画画手绘其实是设计的基础内容,很多设计师都是学美术出身,自然就会画画,做设计相对来说比较容易. 但是 ...
- 麓言信息学UI设计必须掌握的知识体系和职业规划
当我们步入一个新行业的时候,对这个行业即使充满了期待,又是充满了少许的一丢丢恐惧.不要恐惧,今天我们一起来梳理下,作为一名小白,怎样掌握体系的UI设计知识和准确的职业方向? 经常听到很多人有这 ...
- 麓言信息 UI设计师们的薪资都是什么情况
很多人关心UI设计的就业市场行情,想知道有多少人在和自己竞争.因为这关系着自己进入这个行业能否找到合适的工作,以及这个行业未来的前景.波士顿咨询数据表明,全世界范围内设计师人数约9000万,是指全 ...
- UI设计字体素材|设计中字母间距指南
大部分信息都是通过阅读获得的,所以在设计时注意文字是很有意义的.排版有很多方面,但帮助我提高设计质量的东西之一是字母间距. 字母间距是指在字母之间添加和删除空格.有些人把它和字距化混淆了,但这两者是不 ...
- UI设计文字排版四大原则
排版在设计中或者其他工作中的运用是广泛而又平常的不管是图文排版,还是文字排版都有它的方式方法.这些方法通常分为四个原则. 亲密原则:亲密原则指的就是相关的部分组织在一起,安排好他们之间的间距与主次.通 ...
- ui设计字体,在ui设计中用什么样的字体?
ui设计字体,在ui设计中用什么样的字体?对于ui设计的字体,由于在不同系统上的支持的字体是不一样的,在ui设计中,字体的使用又特别的常见.所以今天就来分享一下如何合理的选择合适的字体.我们大家一起来 ...
- qt ui界面无法移动控件_都是知识点!移动端UI设计最基本的10种APP界面类型(上)...
如今互联网的发展和智能手机普及,移动应用成了人们的宠儿,很多多移动APP也会根据用户的需求而更迭本身的UI设计. 授人以鱼不如授人以渔,UI设计作为设计大类的一个细分岗位,如今已经随着时间的推移成为了 ...
最新文章
- 黑客破译android开发代码真就那么容易?
- 新手探索NLP(九)——文本摘要
- go文件服务器mimetype,网络:什么是 MIME TYPE?
- 安卓Activity界面切换添加动画特效
- Python类的部分
- pythonmsgbox怎么使用_如何使用tkinter的messagebox
- @getmapping注解的作用_@Transactional注解失效了?你遇到的是这6种场景吧!
- 高校学生学籍系统C++amp;mysql
- Lync server 2013新建持久聊天室提示用户未启用SIP
- win7右键菜单不见解决办法
- three.js 中的矩阵变换及两种旋转表达方式
- SpringBoot(尚硅谷)
- 分享个短视频竞品分析报告
- mysql卸载教程,只需三步
- PC端网页布局——世纪佳缘(四)注册登录
- 用Apache POI提取Word文本
- 如何去除Word中的波浪线?这三种方法很实用!
- 【转】ST、SC、FC、LC光纤接头区别
- CSS入门(人物简历案例)
- sja1000 中断_关于单片机+SJA1000接收中断C语言编程的问题