恭喜你成为UI中国推荐设计师 (详情)
//百度统计 20220402 uicn

您的意见是我们 UI 中国进步的动力!
点击立即反馈按钮,发表您的意见!
立即反馈
QQ群反馈
您也可以加入UI中国官方反馈群进行反馈!
群号:302892100
备注:反馈问题后@管理员能让我们及时了解您的意见

提交需求

赛事与广告咨询合作,请填写需求表单,我们会在第一时间与您联系!

0/20
0/200

设计大赛

  • 设计大赛
  • 发布广告
  • 发布招聘
  • 其它需求

提交完成
感谢您对UI中国的支持和信赖!
设计中重要的可读性
0.0°
2016-04-01 自译外文 规范/资料 原作者: 未知 举报 2001 10 5 0

设计中文字的可读性非常重要,它是设计的第一步,而不是最后一步。

设计的可读性应该是最值得关注的问题之一,无论涉及到任何设计项目,如果其中的文字不能被读取,那你就没必要把它放在首位。优秀文本设计的标准之一就是确保其能被人理解,而可读性是理解的重要组成部分。今天我们将讨论如何规划围绕文本设计,让你的项目变得易于阅读。

什么是可读性

当谈到设计的时候,我们会经常谈到可读性这个概念,但是可读性,易读性和清晰的文本,并不是完全一样的概念。如果读者可以认出字母,那文字就可以被认为是可读的,但是却不一定是易读的,虽然大部分设计中的文本都易于阅读和理解。

可读性是文字可以阅读的难易程度。理解是在可读性方面的一个关键因素,为的是能够快速查看 - 理解 – 记忆。可读文本可以迅速从一定距离进行扫描。

可读性包括文字本身因素,以及如何方便阅者理解和了解。(有些专家建议一般书面文本用量不应该超过八年级的阅读水平,这样才能实现最大限度可读性。)

让我们看看一些更多的视觉标准,有助于增加可读性。

文字长度

Image title

Image title

想要塑造完美的可读性,文字的长度其实是个很重要的因素,但是却又常常被人忽略。

文字的长度,特别是在大块空白的设计中很重要,太长会导致眼睛疲惫,阅读困难。太短又经常会造成尴尬的断裂效果,断字的使用也会造成大量的复合词,这些断裂严重的影响了阅读的流畅性。

如果你想让你的文本表现的比较讨喜,首先文本字体应该足够大,这样才容易阅读,但也不能太大,否则会导致奇怪的停顿或中断阅读。

关于完善文字的表现方式,具体一行该有多少字,字体如何等等问题,有很多的标准,甚至包括一些数学公式。比如考虑文本框的宽度(这种方法最适合印刷的时候使用,但同样适用于其他的设计),以其一半为标准,确定最佳的字体大小。你可以调整文字的大小,上下位置和起始点,来达到最好的视觉呈现。

所以如果一个列宽是36p,那么文本最好是18p。

当涉及到正文,每行的字符的最佳数目是50到60,根据永恒排版教科书之一,由埃米尔·鲁德编写的“Typographie:设计手册”。该范围可以有所根据使用类型和设备的它正在观看的样式进行扩展。对于大多数项目的安全范围,桌面设备是每行45至75个字符。用于移动设备的最佳范围是每行35至50个字符。

空间和对比度

Image title

空间和合适的对比度是关键因素,当谈到可读性。每个字符必须生活在自己的空间,这和文字的颜色和背景必须有足够的不同是可以区分的。并且每个字符不与其他文字或图像分享空间。

每个字符同线路长度,间距也是重要的。所以每个字符之间的空间至少等于字符的尺寸,大多数数字设计人员习惯选择一个最小的文字大小的150%为空间距离,这就可以留下足够的空间。当每一行中读取大段的文字,且线路长度过多或线之间的空间太少,都会造成理解困难。

设计师还应该特别注意文本和其他对象之间的空间。请注意包装文本和文本跨越到其他物体的边界。文本换行 - 垂直和水平 - 应至少等于用于文本之间的行距。避免使文本块触碰其他对象或元素,或跨越在图像的顶部上运行。

防止彩色类型或文本标志过大。

不要忘了边幅留有余地。记住要留一些空白围绕整个文本框架,创造了一个几乎看不见的光环。该保证将有助于有别于其他设置文本的“噪音”,缓解了读者进入副本的冲击。

想想对比度。空间是创建对比度的一种方法;另一种是彩色。在苍白的背景上的黑色文本是博客和书籍中比较流行的趋势,因为大块的内容需要从介质(纸或屏幕)脱颖而出。当涉及到文本块的阅读,坚持简单的颜色选择,如黑色,白色或灰色,从背景中脱颖而出。

连字符和断字

最能刺激读者视觉的东西之一就是标题中间或者三分之一处有一个巨大的连字符或者下方有个小标题。它们既能吸引读者又能加重读者理解文本,所以设置的时候千万要注意这些细节。

一些连字符是在大型副本块可以接受,但记住使用的数量不能过多。

糟糕的表达和断裂的手法一样会使读者感到不和谐。尽量保持标题和副标题的简短,简单而直接,避免长段使用短语,保持措辞简洁,让读者感受到阅读乐趣,引诱他们深入阅读。

当设计电子产品和网络产品项目的时候,可考虑大量的空白和副标题的使用。这些空白可以使文字更直观地被接受,哪怕经过重复也不会显得那么突兀。

对齐方式

Image title

无论是在文本中心,还是偏左,或者是沿着一个文件的右侧对齐,文本的对齐相当重要,可以极大地影响可读性。一般而言,文本习惯向左对齐,因为它反映了你的阅读方式 - 从左至右。你熟悉每一行开始和结束的地方。

正确的和合理的排版路线其实很难决定。小文本块最好右对齐,比如大的报价或艺术文本元素。对齐文本需要精确完美的断字,对齐规格和非流体的环境,这样的效果最好,这就是为什么你在印刷设计的局限最常看到它的原因。

文字居中这种对齐方式,虽然很流行这么使用,但其实这种方式本身不适合增加可读性。它可用于具有持续性的小文本块,但有些情况就不合适了,比如文本只有特殊的几行的时候。居中的文本最困难的是,仅凭眼睛观察很难知道是从哪里开始,又是从哪里结束的,因为两边的线条参差不齐。

可读性工具

The Readability Test Tool: 输入一个插件(或者直接一个文本数据)然后可以得到一个通过数学计算的可读性分数。你会得到快速和易于理解的结果,如阅读年级水平和许多可读性指数得分,再加上一个全面的分析。该工具还包括书签功能。

Readability:  这个Web浏览器插件和应用程序可以打开任何网页并将其转化为干净阅读的视图,并允许用户收集页面稍后阅读。

Juicy Studio Readability Test:  了解更多关于所有不同的可读性测试和算法,以及了解各手段如何运作,和这些手段会对你的项目产生什么样的影响。

Information Architects “The 100% Easy-2-Read Standard:” 这篇文章写于2006年,包括各种各样的可读性清单。虽然它主要适用于网页设计,但许多提示都发人深省,今天仍然适用。

结论

总的来说,这些建议可以提高你设计的可读性或者减少影响阅读的因素,如果想让你的内容是有效的,它必须是可读的。增加可读性设计,可以更好的为你的读者或者用户服务。

如果有很多信息,用户不能在短时间内理解文本的话,他们会倾向于离开。而这些读者或者说是潜在客户,你下次想吸引他们就不会那么简单了。

全球最新的设计资源,精彩实用设计技巧每天呈现。欢迎关注微信公众号:ienqoo

Image title

让每一款产品体验更好:www.enqoo.com

更新:2016-04-01

收藏

10人已收藏

enqoo

让产品体验更好:http://www.enqoo.com/

  • 47

    作品

  • 272

    粉丝

  • 1

    关注

  • 从现在起学 Cinema 4D – 对象关系
  • 从现在起学 Cinema 4D - 基础操作
  • Enqoo 交互/设计师招募...
  • 10个自由职业者日常的智能小贴士
相关标签
设计规范设计

    猜你喜欢

      2016-04-01 自译外文 规范/资料 原作者: 未知 举报 2001 10 5 0

      设计中重要的可读性

      0.0°

      你确定要举报设计中重要的可读性

      如果查出恶意举报,十天内禁止提交任何举报申请。

      0/200

      上传证据: 超过10M的附件请使用网盘地址

      点击上传附件

      对谁可见:

      全部设计师
      • 全部设计师
      • 推荐设计师和认证设计师

      您确认要推荐?

      该作品发布时间:2016年03月31日

      评分

      完整度

      启发性

      勤奋性

      排版布局

      推荐心得

      建议20-200字以内

      0/200

      5
      10
      0

      账号或密码错误,请重新输入

      账号或密码错误,请重新输入

      登录

      手机号

      发送验证码 120s 验证码错误

      登录
      第三方账号登录