最专业的八方代购网站源码!

资讯热点
代购源码网站设计:代购源码网站字体排版的10个基本规则

发布时间:2019-9-23 分类: 电商动态

优化代购源码网站文本布局也是优化用户界面的一种方法。在本文中,作者将分享一组规则,这些规则将帮助您提高文本的可读性和易读性。

"通信及QUOT;在设计中发挥着至关重要的作用–它建立了代购源码网站和用户之间的链接,并帮助用户实现他们的目标。当我们谈论网页设计中的沟通时,它通常是指文本的输出。

排版在此过程中起着至关重要的作用:网络上超过95%的信息以书面语言的形式存在。良好的文本布局使阅读更容易,键入不良的文本布局会导致用户关闭网页。 “网页设计是95%的排版设计>:

 优化排版是优化界面可读性,可访问性,可用性,使整体平衡的关键。

换句话说:优化代购源码网站文本布局也是优化用户界面的一种方式。在下面的文章中,我将提供一组规则,帮助您提高文本内容的可读性和易读性。

 1.尽量使用少的字体

使用3种以上不同的字体将使代购源码网站看起来不那么结构化和不专业。请注意,一次使用更多字体样式可能会破坏所有布局。

为防止这种情况,请尝试减少字体数量

通常,将字体数量限制到最小(两个计数,一个是正确的)。如果使用多种字体,请确保字体具有系列感并且基于字符宽度。以下面的字体组合为例。格鲁吉亚和Verdana(左)的结合创造了一对和谐相似的价值观。相比之下,Baskerville和Impact(右)极大地掩盖了衬线的相应不匹配,从而产生更好的视觉体验。

确保字体系列根据其字符宽度标准相互补充

 2.尝试使用标准字体

字体嵌入服务(例如Google Web Fonts或Typekit)有许多有趣的字体,可以为您的设计提供创新,新鲜和意想不到的效果,并且它们易于使用。以Google为例:

选择任何字体,例如Open Sans。

生成代码并将其粘贴到HTML文档中。

完了!

这种情况会不会出错?

 其实这种做法有两个问题

并非所有人在打开浏览器时都可以访问相同的字体,这意味着您选择的用于获得更好用户体验的字体将不会显示给所有用户。

用户更熟悉标准字体,因此他们可以更快地读取他们想要的信息。

除非您的代购源码网站有足够的引人入胜的自定义字体(例如品牌或创建身临其境的体验),否则最好使用系统字体。更安全的方法是使用系统字体:Arial,Calibri,Trebuchet等。请记住,良好的文本布局会吸引读者阅读内容,而不是文本本身。

 3.限制文本线长度

每行放置适当数量的字符是文本可读性的关键。它不仅是您的设计,它决定了文本的宽度,它也应该是一个可读性问题。考虑Baymard Institute的可读性和文本行长度的建议:

“如果您想获得良好的阅读体验,则应将每行限制为约60个字符。每行具有适当数量的字符是文本可读性的关键。 ”的

如果一行文字太短,眼睛必须总是回头,打破读者的节奏。如果文本行太长,则用户的眼睛很难长时间专注于单行文本。图像来源:材料设计

对于移动设备,基本上每行保留30-40个字符。以下是在移动设备上查看的两个代购源码网站的示例。第一个使用每行50-75个字符(每行和桌面的最佳字符数),而第二个使用最佳的30-40个字符。

在网页设计中,您可以使用像素来限制文本块的宽度,从而实现每行的最佳字符数。

 4.选择各种尺寸的文本元素

用户将从具有不同屏幕尺寸和分辨率的设备访问您的代购源码网站。大多数用户界面需要各种大小的文本元素(按钮文本,字段标签,部分标题等)。选择一种适用于各种尺寸和分辨率屏幕的字体非常重要,以保持每种尺寸的可读性和可用性。

谷歌的Roboto字体

确保您选择的字体在较小的屏幕上清晰可辨!尝试避免使用脚本的脚本,例如Vivaldi(在下面的示例中):尽管它们很漂亮,但它们很难阅读。

Vivaldi字体很难在小屏幕上阅读

 5.使用可区分字母的字体

许多字体可以很容易地混淆类似的字母形式,特别是与“我”相关的字母形式。和“L” (如下所示)和字母间距差,

例如,当”并且&ndquo; n”看起来像“M””。因此,在选择类型时,请务必在不同的上下文中检查您的类型,以确保它不会给您的用户带来问题。

 6.避免所有字母大写

全部大写字母–是指所有以字母为单位的文字–在不涉及阅读的上下文(例如首字母缩略词或徽标)中,整体看起来很漂亮,但是当您的消息涉及阅读时,请不要强制使用所有大写字母。正如Miles Tinker所说,在他的标志性作品“可读性”中,与小写类型相比,所有大写都提高了扫描和阅读的速度。

 7.不要尽量减少线间距

在排版中,我们对两行文本之间的间距(或行高)有一个特殊术语。通过增加行高,可以增加文本行之间的垂直空白,通常可以提高可读性以换取屏幕空间。有一个基本规则,顶空应该是字符高度的30%,以便于阅读。

好的间距有助于提高可读性图片来源:微软

正如Dmitry Fadeyev指出的那样,正确使用段落之间的差距已被证明可以使理解增加20%。使用空白技能可以为用户提供可以转换知识然后去掉不相关细节的内容。

左:几乎重叠的文字。右:良好的间距有助于提高可读性。图片来源:Apple

 8.确保您有足够的颜色对比度

文字和背景不应使用相同或相似的颜色。文本越明显,用户扫描和阅读的速度就越快。 W3C建议将正文和图像文本对比如下:

这些文本行与颜色对比度建议不匹配,并且难以根据背景颜色读取

小文本的背景对比度应至少为4.5:1。

大文本(14pt/18pt常规及以上)应该具有至少3:1的对比度及其背景。

这些文本行符合颜色对比度建议,易于阅读背景颜色

一旦选择了颜色,绝对有必要在大多数设备上使用真实用户进行测试。如果任何测试显示阅读文本有问题,那么您可以确保您的用户遇到完全相同的问题,然后一起解决它们。

 9.避免将文字着色为红色或绿色

色盲是一种常见病,尤其是男性(8%的男性是色盲),建议使用色彩以外的线索来区分重要信息。此外,避免使用红色和绿色单独传达信息,因为红色和绿色色盲是最常见的色盲形式。

 10.避免使用闪烁的文字

闪烁自身或闪烁的内容可能会触发敏感个体的神经系统事件。它不仅会引起神经阻力,而且对于普通用户来说可能会令人烦恼或分散注意力。

结论

文本布局是一个重要的设计区域,做出正确的排版选择可以让您的代购源码网站感到精神焕发。因此,文本布局的可读性,可理解性和清晰度至关重要。文本排版的存在是为了突出显示内容,并且应该以不增加用户认知负荷的方式阅读内容。

« 提交个人用户代购源码网站的方法 | 淡季中明显的教育行业网络营销 »