网站设计：网站字体排版的10个基本规则

发布时间：2019-06-19 18:04

发布者：嘉铭物联

浏览次数：

1。使用尽可能少的字体

使用超过3种不同的字体会使网站看起来不结构化和不专业。请注意，更多的字体样式会同时破坏所有布局。

要防止这种情况，请尝试减少字体数量。

一般来说，字体的数量被限制在最少(两个多于一个，一个正好)。如果您使用多种字体，请确保该字体具有系列感，并且基于其字符宽度是互补的。以下列字体组合为例。乔治亚和维尔达纳(左)结合在一起创造了相似价值观的和谐配对。相比之下，巴斯克维尔和impact(右)大大掩盖了衬里的相应不匹配程度，形成了更好的视觉体验。

确保字体系列在基于字符宽度的标准下相互补充

[/h 2。尝试使用标准字体

字体嵌入服务(如谷歌网络字体或typekit)有许多有趣的字体，可以为你的设计提供创新、新鲜和意想不到的效果，而且它们使用起来也非常方便。以谷歌为例:

选择任何字体，例如打开sans。

生成代码并粘贴到html文档中。

完成！

在这种情况下没有错误吗？

这种方法实际上有两个问题。

并不是每个人在打开浏览器时都能使用相同的字体，这意味着您选择的具有更好用户体验的字体不会显示在所有用户面前。

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

除非您的网站有足够吸引人的自定义字体(如品牌或创造身临其境的体验)，否则最好使用系统字体。使用arial、calibri、投石机等系统字体更安全。记住，好的排版会吸引读者阅读内容，而不是文本本身。

[/h 3。限制文本行长度

每行字符的正确数量是文本可读性的关键。决定文本宽度的不仅仅是你的设计，还应该是可读性的问题。考虑baymard研究所关于可读性和文本行长度的建议:

& ldquo；如果你想要一个好的阅读体验，你应该把每行限制在60个字符左右。每行有适当数量的字符是文本可读性的关键。&rdquo。

如果一行文字太短，眼睛必须经常向后转，以打破读者的节奏。如果一行文本太长，用户的眼睛不能长时间聚焦在一行文本上。照片来源:材料设计

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

在中，您可以通过使用像素来限制文本块的宽度，以获得每行的最佳字符数。

[/h 4。选择不同大小的文本元素

用户将通过不同屏幕尺寸和分辨率的设备访问您的网站。大多数用户界面需要不同大小的文本元素(按钮文本、字段标签、部分标题等)。)。选择一种能够在不同尺寸和分辨率的屏幕上运行良好的字体以保持每个尺寸的可读性和可用性是非常重要的。

[/ 谷歌的机器人字体

确保您选择的字体在较小的屏幕上清晰易读！尽量避免草书字体，比如维瓦尔第(在下面的例子中):虽然它们很漂亮，但很难阅读。

维瓦尔第字体在小屏幕上很难阅读。

[/h 5。使用字母字体

许多字体很容易混淆类似的字母形式，尤其是& ldquoi&rdquo。还有。l & rdquo(如下图所示)和较差的字母间距，

例如当& ldquor & rdquo还有。n&rdquo。看起来像。m & rdquo。因此，在选择您的类型时，请确保在不同的上下文中检查您的类型，以确保它不会给您的用户带来问题。

6。避免所有字母大写

所有大写字母& ndash它表示所有字母大小写文本& ndash在不涉及阅读的上下文中，如首字母缩略词或徽标，它们看起来都很漂亮和完整，但是当您的消息涉及阅读时，不要强制使用所有大写字母。正如迈尔斯·廷克所说，在他里程碑式的作品中-& ldquo；可读性。在中，与小写类型相比，全大写可以提高扫描和读取速度。