成都网页设计哪家好?



成都网页设计哪家好?(图1)

沟通在设计中起着至关重要的作用 - 在网站和用户之间建立清晰的联系并帮助您的用户实现他们的目标至关重要。当我们在网页设计上下文中谈论沟通时,我们通常指的是文本。排版在这个过程中起着至关重要的作用:
 
网络上超过95%的信息是书面语言的形式。
 
好的排版使阅读行为变得毫不费力,而糟糕的排版使用户关闭。正如Oliver Reichenstein在他的文章“网页设计是95%的排版”中所说:
 
优化排版就是优化可读性、可访问性、可用性(!)、整体图形平衡。
 
换句话说:优化您的排版也会优化您的用户界面。在本文中,我将提供一组规则,帮助您提高文本内容的可读性和易读性。
 
1.将使用的字体数量保持在最低限度
使用超过3种不同的字体会使网站看起来非结构化和不专业。请记住,一次使用过多的类型大小和样式也会破坏任何布局。
 
 
为了防止出现这种情况,请尝试将字体系列的数量限制在最低限度
通常,将字体系列的数量限制在最低限度(两个就足够了,一个通常就足够了),并在整个网站上坚持使用相同的字体系列。如果确实使用了多种字体,请确保字体系列根据其字符宽度相互补充。以下面的字体组合为例。Georgia和Verdana(左)的组合具有相似的价值观,创造了和谐的配对。相比之下,Baskerville和Impact(右)的配对,其中Impact的重量大大掩盖了Baskerville。
 
 
确保字体系列根据其字符宽度相互补充
2. 尝试使用标准字体
字体嵌入服务(如Google Web Fonts或Typekit)有很多有趣的字体,可以为您的设计提供新的,新鲜的和意想不到的东西。那么,什么地方会出错呢?实际上,这种方法有一个严重的问题 - 有趣的字体会分散用户阅读的注意力。用户可以花时间思考设计师使用的字体,而不是阅读文本。
 
除非您的网站迫切需要自定义字体,例如用于品牌打造或创建沉浸式体验,否则通常最好坚持使用系统字体。请记住,好的排版将读者吸引到内容,而不是类型本身。
 
3. 限制行长度
每行上具有适当数量的字符是文本可读性的关键。决定文本宽度的不应该是你的设计,它还应该是一个易读性的问题。考虑一下贝马德研究所关于可读性和行长度的建议:
 
“如果你想要一个好的阅读体验,每行应该有大约60个字符。每行上都有适量的字符是提高文本可读性的关键。
 
 
如果一条线太短,眼睛将不得不太频繁地向后移动,从而打破读者的节奏。如果一行文本太长,用户的眼睛将很难聚焦在文本上。图片来源:材料设计
对于移动设备,您应该选择 每行30-40个字符 。以下是在移动设备上查看的两个网站的示例。第一个使用每行 50–75 个字符(打印和桌面每行的最佳字符数),而第二个使用最佳 30–40 个字符。
 
 
图片来源:用户测试
在网页设计中,您可以通过使用em或像素限制文本块的宽度来实现每行的最佳字符数。
 
4.选择适合各种尺寸的字体
用户将从具有不同屏幕尺寸和分辨率的设备访问您的网站。大多数用户界面需要各种大小的文本元素(按钮副本、字段标签、节标题等)。选择一种在多种尺寸和重量下都能正常工作的字体非常重要,以保持每种尺寸的可读性和可用性。
 
 
Roboto 字体 by Google
确保您选择的字体在较小的屏幕上清晰可辨!尽量避免使用草书字体的字体,例如Vivaldi(在下面的示例中):虽然它们很漂亮,但它们很难阅读。
 
 
维瓦尔第字体将很难在小屏幕上阅读
5. 使用可区分字母的字体
许多字体使得混淆类似的字母形式太容易,特别是与“i”和“L”混淆(如下图所示)。因此,在选择类型时,请务必在不同的上下文中检查你的类型,以确保它不会给用户带来问题。
 
 
6. 避免全部大写
所有大写文本(即所有字母都大写的文本)在不涉及阅读的上下文中(例如首字母缩略词或徽标)都没问题,但是当您的消息涉及阅读时,不要强迫用户阅读所有大写文本。正如Miles Tinker所提到的,在他的作品《打印的易读性》中,与小写字体相比,全大写打印大大延缓了扫描和阅读的速度。
 
 
7. 不要最小化行间距
在排版中,我们有一个特殊术语来表示两行文本之间的间距 - 行距(或行高)。通过增加行距,可以增加文本行之间的垂直空白区域,从而通常提高可读性以换取屏幕空间。通常,行距应比字符高度高约 30%,以获得良好的可读性。
 
 
良好的间距有助于提高可读性。图片来源:微软
正如德米特里·法杰耶夫(Dmitry Fadeyev)所指出的那样,在段落之间正确使用空格已被证明可以将理解率提高20%。使用空白的技能在于为用户提供可消化的内容量,然后剥离无关的细节。
 
 
左:文本几乎重叠。右:良好的间距有助于提高可读性。图片来源:苹果
8. 确保有足够的色彩对比度
不要对文本和背景使用相同或相似的颜色。文本越明显,用户扫描和阅读的速度就越快。W3C 建议正文文本和图像文本采用以下对比度:
 
小文本与其背景的对比度应至少为 4.5:1。
大文本(粗体为 14 pt/常规及以上为 18 pt)与其背景的对比度应至少为 3:1。
 
这些文本行不符合颜色对比度建议,并且很难在背景颜色下阅读。
 
这些文本行符合颜色对比度建议,并且根据其背景颜色易于阅读。
一旦你选择了颜色,就绝对有必要在大多数设备上与真实用户一起进行测试。如果任何测试显示阅读副本时出现问题,则可以确保用户会遇到完全相同的问题。
 
9. 避免将文本着色为红色或绿色
色盲是一种常见的情况,特别是在男性中(8%的男性是色盲),建议使用除颜色以外的其他线索来区分重要信息。还要避免单独使用红色和绿色来传达信息,因为红色和绿色色盲是最常见的色盲形式。
 
 
10. 避免使用闪烁文本
闪烁或闪烁的内容可引发易感个体的癫痫发作。它不仅会引起癫痫发作,而且对一般用户来说可能会令人讨厌或分心。
 
 
避免闪烁文本!
结论
排版是一件大事。错误的排版选择可能会分散用户阅读的注意力。使排版可读、易懂和易读至关重要。
 
排版的存在是为了尊重内容
 
排版应以一种永远不会增加用户认知负荷的方式尊重内容。

首页 > 新闻资讯

留言