有效提高UI界面的文本易读性方式

时间:2017-10-09 来源:文率科技

每个人都有不同的思维,在设计工作中,100个人可能有100种不同的设计理论,但是天津网站建设-文率科技的小编认为,虽然每一个设计师都有自己的思维,艺术没有规则可寻,但是关于UI设计中最基本文字排版却是有依据可循的,下面文率科技的就为大家简单谈一谈如何通过文字排版科学提高移动端文本的易读性,提升设计质感。

1、字体大小


大家都知道,文字有着不同的字号,不同字号的文字大小不同,通常情况下,标题的字号一定要打,解说注释的字号要要,总是文字大小的设置并非是一成不变的,作为UI设计展,你要依据它的作用来灵活运营。在版面的设计中,首先要做的就是确定文字的大小,只有这样才能依据它来调节平衡,决定大标题,小标题以及注释文字大小。

如图:即便文字的大小是一样的,由于字体不同,视觉上看起来字的大小也是有区别的,而且选择文字的时候,需要考虑整体页面的美观度,可读性。

2、文字留白

所谓的留白,其实就是在版面中留出的多余空间,如果能够恰当的处理好留白自然能够使文本视觉流平顺,从而提升界面阅读的舒适性。一般情况下,对于一篇文章来说,留白从小到大分别有文字中的空白、文字与文字之间的空白、行与行之间的空白、段与段之间的空白,留白面积的大小也要遵循这个顺序。

3、特殊符号的处理


中文汉字中有很多的不同的符号,这些符号若不规则的堆积在一起,对于界面的整体阅读性造成非常不利的影响。所以,为了使这些繁杂的要素配置得整洁美观,在开始排版之前,就需要预先制定“段落样式”的设计排版规则。

如:中文和英文混排,为使中文和英文和谐自然地结合,需要把英文的字号设定得比中文字号大一些。还有左右对齐,必须决定是否把标点“悬吊”在对齐线之内。

4、增强文字对比度

一般情况下,一个成功的页面一定具有足够的文本对比度,但是值得注意的是对比度过于强烈和过于微弱都是不利于阅读的,所以关于对比度这块详细的把控。

前段时间文率小编发现了这样一个页面,看起来不是十分舒适,文字和背景的颜色对比度太低。于是就找到一个网站对这个页面进行了测试,可以看到它的文字对比度是3.96:1,除非加大字重,否则它就不合适。

5、对齐方式


总的来说,文本的对齐方式,一般分为四种:左对齐、居中对齐、右对齐以及两端对齐。一般来说,移动端文本的对齐主要采用的是左对齐或两端对齐,这里简要谈一谈这两种对齐方式的优劣。

左对齐:容易造成右端留白过多,整体视觉失衡,但是这种对齐方式不破坏文字本身的起伏和韵律,能保证较好的阅读体验。

两端对齐:可以保证段落文字整齐划一,成规整的块状,但是打破了文字和字间空白之间形成的韵律,阅读起来未必舒适。

优秀的设计师,不但要注意设计中的各种规范,同样还需要负责到底的精神,上文中天津网站建设-文率科技http://www.wenshuai.cn/所说的这些,如:大小、间距、对比度,在前端和产品经理的眼里只是一个数值,他们并不知道一个数值有可能会对设计造成多大的影响,所以,设计师必须用一丝不苟的精神对你的页面负责到底,这样才能设计出一个充满质感品质界面。

联络方式:

中国 · 天津市河西区南京路35号亚太大厦1403室
电话:15620613686
邮编:300220