设计中国|网页设计中的可读性
设计的可读性应该是最值得关注的问题之一,无论涉及到任何设计项目,如果其中的文字不能被读取,那你就没必要把它放在首位。优秀文本设计的标准之一就是确保其能被人理解,而可读性是理解的重要组成部分。今天设计中国的笔者们将讨论如何规划围绕文本设计,让你的项目变得易于阅读。
什么是可读性
当谈到设计的时候,我们会经常谈到可读性这个概念,但是可读性,易读性和清晰的文本,并不是完全一样的概念。如果读者可以认出字母,那文字就可以被认为是可读的,但是却不一定是易读的,虽然大部分设计中的文本都易于阅读和理解。
可读性是文字可以阅读的难易程度。理解是在可读性方面的一个关键因素,为的是能够快速查看 - 理解 – 记忆。可读文本可以迅速从一定距离进行扫描。
可读性包括文字本身因素,以及如何方便阅者理解和了解。(有些专家建议一般书面文本用量不应该超过八年级的阅读水平,这样才能实现最大限度可读性。)
让我们看看一些更多的视觉标准,有助于增加可读性。
文字长度
想要塑造完美的可读性,文字的长度其实是个很重要的因素,但是却又常常被人忽略。
文字的长度,特别是在大块空白的设计中很重要,太长会导致眼睛疲惫,阅读困难。太短又经常会造成尴尬的断裂效果,断字的使用也会造成大量的复合词,这些断裂严重的影响了阅读的流畅性。
如果你想让你的文本表现的比较讨喜,首先文本字体应该足够大,这样才容易阅读,但也不能太大,否则会导致奇怪的停顿或中断阅读。
关于完善文字的表现方式,具体一行该有多少字,字体如何等等问题,有很多的标准,甚至包括一些数学公式。比如考虑文本框的宽度(这种方法最适合印刷的时候使用,但同样适用于其他的设计),以其一半为标准,确定最佳的字体大小。你可以调整文字的大小,上下位置和起始点,来达到最好的视觉呈现。
所以如果一个列宽是36p,那么文本最好是18p。
当涉及到正文,每行的字符的最佳数目是50到60,根据永恒排版教科书之一,由埃米尔·鲁德编写的“Typographie:设计手册”。该范围可以有所根据使用类型和设备的它正在观看的样式进行扩展。对于大多数项目的安全范围,桌面设备是每行45至75个字符。用于移动设备的最佳范围是每行35至50个字符。
空间和对比度
空间和合适的对比度是关键因素,当谈到可读性。每个字符必须生活在自己的空间,这和文字的颜色和背景必须有足够的不同是可以区分的。并且每个字符不与其他文字或图像分享空间。
每个字符同线路长度,间距也是重要的。所以每个字符之间的空间至少等于字符的尺寸,大多数数字设计人员习惯选择一个最小的文字大小的150%为空间距离,这就可以留下足够的空间。当每一行中读取大段的文字,且线路长度过多或线之间的空间太少,都会造成理解困难。
设计师还应该特别注意文本和其他对象之间的空间。请注意包装文本和文本跨越到其他物体的边界。文本换行 - 垂直和水平 - 应至少等于用于文本之间的行距。避免使文本块触碰其他对象或元素,或跨越在图像的顶部上运行。
防止彩色类型或文本标志过大
不要忘了边幅留有余地。记住要留一些空白围绕整个文本框架,创造了一个几乎看不见的光环。该保证将有助于有别于其他设置文本的“噪音”,缓解了读者进入副本的冲击。
想想对比度。空间是创建对比度的一种方法;另一种是彩色。在苍白的背景上的黑色文本是博客和书籍中比较流行的趋势,因为大块的内容需要从介质(纸或屏幕)脱颖而出。当涉及到文本块的阅读,坚持简单的颜色选择,如黑色,白色或灰色,从背景中脱颖而出。
连字符和断字
最能刺激读者视觉的东西之一就是标题中间或者三分之一处有一个巨大的连字符或者下方有个小标题。它们既能吸引读者又能加重读者理解文本,所以设置的时候千万要注意这些细节。
一些连字符是在大型副本块可以接受,但记住使用的数量不能过多。
糟糕的表达和断裂的手法一样会使读者感到不和谐。尽量保持标题和副标题的简短,简单而直接,避免长段使用短语,保持措辞简洁,让读者感受到阅读乐趣,引诱他们深入阅读。
当设计电子产品和网络产品项目的时候,可考虑大量的空白和副标题的使用。这些空白可以使文字更直观地被接受,哪怕经过重复也不会显得那么突兀。
对其方式
无论是在文本中心,还是偏左,或者是沿着一个文件的右侧对齐,文本的对齐相当重要,可以极大地影响可读性。一般而言,文本习惯向左对齐,因为它反映了你的阅读方式 - 从左至右。你熟悉每一行开始和结束的地方。
正确的和合理的排版路线其实很难决定。小文本块最好右对齐,比如大的报价或艺术文本元素。对齐文本需要精确完美的断字,对齐规格和非流体的环境,这样的效果最好,这就是为什么你在印刷设计的局限最常看到它的原因。
文字居中这种对齐方式,虽然很流行这么使用,但其实这种方式本身不适合增加可读性。它可用于具有持续性的小文本块,但有些情况就不合适了,比如文本只有特殊的几行的时候。居中的文本最困难的是,仅凭眼睛观察很难知道是从哪里开始,又是从哪里结束的,因为两边的线条参差不齐。
可读性工具
Readability: 这个Web浏览器插件和应用程序可以打开任何网页并将其转化为干净阅读的视图,并允许用户收集页面稍后阅读。
Juicy Studio Readability Test: 了解更多关于所有不同的可读性测试和算法,以及了解各手段如何运作,和这些手段会对你的项目产生什么样的影响。
InformationArchitects “The 100% Easy-2-Read Standard:” 这篇文章写于2006年,包括各种各样的可读性清单。虽然它主要适用于网页设计,但许多提示都发人深省,今天仍然适用。
总的来说,这些建议可以提高你设计的可读性或者减少影响阅读的因素,如果想让你的内容是有效的,它必须是可读的。增加可读性设计,可以更好的为你的读者或者用户服务。
-
2021/12/28
-
2021/12/23
-
2021/12/17
- 爱华仕斩获“2021年度中国厨卫行业年度智能
- 回首2021,迎战2022 彩虹线开启新征程!
- 福临板材|福满2021,圆梦2022
- 美特照明:2022年照明新趋势,经销商如何做大
- 会自己“洗澡”的集成灶,帅康自动清洗集成灶
- 带你设计一款功能多变,简单实用的休闲露台阳
- 世纪豪门吊顶:破防了!原来颜值+实力=H20
- 装修木门选的好,噪音统统没烦恼
- 寒潮来了,有淋浴房洗澡更保暖舒服
- 元旦特辑:欧意电器述说生活的点滴与美好
- “中国十大品牌”获奖名单出炉,赛戈水漆荣耀
- 2021值得消费大赏 凯迪仕智能锁荣摘两项桂冠
- 益恩家居:新年新气象,爱自己从好好睡觉开始
- 元旦伊始:健康新生活,从精格管道直饮水开始
- 喜迎元旦|新年新灯饰 箔晶智能照明让酒店暖
- 吉美帮的2021 “专精特新” 深耕屋面防水体
- Aqara携手京东成立灯光设计联盟 打造灯饰照
- 年底厨房焕新颜,如何选择厨电?好太太智能来
- 全铝家具全屋莫兰迪色系,这款美式轻奢范赢邻
- 顺趋势·筑凤巢·赢未来 凤梧居门窗2021年会隆