版式对产品设计的影响

版式是排列文本和字母以使书面语言清晰易读并吸引读者的艺术或技术。排版旨在使内容有吸引力、易于阅读并无处不在——书籍和杂志、网站和应用程序,甚至产品包装上。

对人类情绪的影响

不同的字体对人类情感产生深远的影响,根据读者先前的文化背景、环境和心理唤起情感并传达特定的信息。每种字体都有独特的个性,例如,衬线字体通常与传统、值得信赖和正式有关,而无衬线字体通常被视为现代、干净和简约,这样的例子不胜枚举。

排版的易读性

易读性是指读者识别、区分和阅读文本和字体中的各个字符的难易程度。因此,易读性程度取决于所使用的字体风格。以下是提高易读性的一些最佳实践,

  • 最好避免过度装饰或复杂的字体,以免影响可读性。相反,使用简单的字体即使快速浏览也能清晰辨认。

  • 避免使用过长的线条,因为它们会使眼睛难以跟踪文本。

  • 对比度是关键,文本和背景之间有清晰的对比度很重要。白色(几乎白色)背景上的黑色(几乎黑色)文本(反之亦然)提供了高对比度和可读性。

  • 将文本放置在繁忙或复杂的背景上会导致阅读困难。

产品可读性的重要性

可读性是指读者成功解读、处理文本并理解文本含义的难易程度。它指的是单词和块在页面上的排列方式。可读性是制作高质量内容的重要因素。关注可读性会增加目标受众真正轻松阅读内容并与之互动的机会。字间距不足、行距最小、字体较小或文本与背景没有适当的对比度——所有这些都会使文本难以阅读,给用户的眼睛带来紧张感,但它们通常甚至无法解释确切的原因。如果所有这些因素都得到很好的平衡,那么对于用户来说就更具可读性。以下是提高文本可读性的一些最佳实践,

  • 人们通常不会阅读较大的句子或段落,而是被动地浏览。因此,最好使用短句子和较小的段落。

  • 专家建议写作达到八年级水平,以提高可读性并使整个过程变得轻松。

  • 最好避免使用花哨的单词和缩写词。

  • 字体大小对于可读性非常重要。最好确保字体大小不要太小而无法在移动设备上阅读。

  • 密集的文本对读者来说很困难,因此请确保行之间以及标题和段落之间有足够的空间。

无障碍

在可访问性方面,少即是多。最简单的方法是选择一种常见且简约的字体,使文本更易于理解。在视觉可访问性方面,字体起着重要作用。因此,选择通用字体可以增强视力不佳、学习障碍和其他认知特征的人的易读性和可读性。以下是提高可访问性的一些最佳实践,

  • 最好使用适合我们目标受众的字体。

  • 字母应该很容易彼此区分。

  • 字体之间的间距较小会影响视觉可达性。因此,最好确保字体有足够的字母间距。

  • 有些字体的多个字母的字形实际上是相同的。所以最好尽量减少这种字体。

  • 如果文本颜色与背景颜色太相似,用户将很难阅读。因此,我们必须确保足够的颜色对比度以获得最佳的可读性。

  • 当与字体缩放辅助工具一起使用时,最好确保尊重排版的所有属性。

色彩对比在版式中的作用

文本和背景之间足够的颜色对比度可以改善用户的体验、可访问性、易读性和可读性。您可以使用许多工具在线检查排版对比度,但我通常使用WebAIM进行设计。足够的对比度取决于两种颜色(即背景颜色和文本颜色)之间的对比度。如果我们的文本对比度评级失败,我们可以将文本颜色更改为对比度更高的颜色,以提高可访问性。对比度不仅基于颜色,还基于字体选择、间距、大小和粗细——所有这些因素都会影响页面的可访问性。


版式指南

产品要成功,必须清楚地传达其意图和目的。我们通过文本与用户沟通并建立联系,因此文本必须清晰且易于理解。大多数情况下,设计系统会自动推动我们遵循各自的指南,但如果您要创建一个新的指南,那么这些是一些排版指南,可以帮助我们创建更好的产品或设计系统,

  • 在我们的产品中使用最少数量的字体。使用多种字体会使产品变得非结构化,并且使用户难以阅读。

  • 选择正确的字体大小很重要。如果字体太小,则会给读者带来压力,如果字体太大,则可能会分散注意力,并容易引起读者的注意。

  • 最好选择适合多种尺寸的字体。

  • 使用正确的排版层次结构可以让用户更轻松地找到他们正在寻找的内容。

版式影响产品成功率的部分

版式在产品的成功中发挥着重要作用,无论是网站、移动应用程序、包装还是任何其他与设计相关的工作。以下是排版如何影响产品的成功率,

  • 创建品牌形象。

  • 它可以吸引用户的注意力并使他们参与内容。

  • 版式通过使用各种字体大小、样式和粗细来帮助建立内容的视觉层次结构。

  • 版式可以唤起情感并为产品定下基调。

Figma 插件可改善排版

这里有一些 Figma 插件可以帮助我们改进排版,

  • 对比度
    对比度插件是设计师创建易于访问的数字产品的强大工具。该插件可以扫描所选图层中使用的调色板,并根据 Web 内容可访问性指南 (WCAG) 提供有关哪些组合在对比度方面可能存在问题的见解。

  • 字体对
    字体对插件可以作为设计师有效选择和配对字体的宝贵工具,并且它与 Google 字体库集成。

  • Text Prettier
    Text Prettier插件使我们的文本在显示时清晰易读且有吸引力,从而帮助我们改进排版。这可以解决与不正确的引号、标点符号、日期和电话号码格式等相关的问题。

  • 字体预览
    字体预览对于设计师来说是一项宝贵的资产,它为我们输入的任何内容提供直观的实时预览,使我们能够探索和选择项目的字体。

  • Typescale
    Typescale插件允许您轻松地为您的版式创建模块化比例。只需点击几下,您就可以轻松地将一行文本转换为根据您选择的比例定制的均衡的印刷比例。

结论

排版不仅仅是为产品选择一种或几种字体,或者只是在使用开箱即用的设计系统时随波逐流。版式承载着品牌的身份和产品的情感。


首页 > 新闻资讯

Tag: 交互设计公司 HMI交互设计 深圳UED设计公司 深圳UI设计公司
留言