网页排版终极指南:规则、词汇、想法和最佳实践

已发表: 2018-05-16

'一张图片胜过千言万语。'

大多数情况下,图片传达了他们要说的内容。 但是,带有文本的图像会产生更大的影响。

排版作为图形的伴侣。 排版不仅仅是从编辑软件的下拉菜单中选择随机字体和磅值。 它是平面设计的专业领域。 它是排版的艺术和技术。 如果您知道如何使用它,这是可以将您与其他设计师区分开来的重要技能之一。

什么是排版?

在进入排版的艺术和技术之前,首先要了解排版是什么。 排版是文本的视觉片段(书面文字)。 文本是一系列单词。 你看到的每一个视觉显示的文本基本上都是排版。 文本可以按视觉、听觉和数字三种方式进行分类。

What is Typography?

排版不仅仅是字母和字符的设计。 它包括点大小、间距和线长的选择。 早在约翰内斯·古腾堡(Johannes Gutenberg)推出印刷机的时候,排字员必须在物理空间中排列字母和字符。 现在在计算机时代,这项工作要容易得多。 你只需要找到开源字体,排列字母和字符,就完成了。

排版的重要性

排版是您绝对可以在任何地方找到的东西。 比如说,它可以是您的智能手机、咖啡杯、广告牌、布料等等。 排版无处不在。 字体、字母和字符排列的选择决定了您的信息将如何传达。

即使在您看来这似乎是一个小因素,但肯定不是。 即使是单一类型的调整也可以改变您作品的整体外观和感觉。 如果你注意到 Facebook 在 2016 年 6 月测试了一种名为 Geneva 的新字体。它比原来的 Helvetica 字体更薄更轻。 但是,这两种字体之间的差异是显而易见的。

排版规则

在排版中,您必须根据您的布局、网格、设计主题、配色方案等选择字体。 以下是您在工作时应牢记的一些排版规则。

Rules of Typography

选择正确的字体

如果您在互联网上花费几分钟,您会发现大量可供免费和付费使用的字体。 但这并不意味着您必须花费数小时搜索您在脑海中想象的确切字体。 即使使用有限的调色板,您也可以开始绘画。 有一些像 Helvetica 这样久经考验的字体在任何项目中都不会出错。

字体是一种设计形式,由工匠在相当长的一段时间内贡献了他所有的努力和技能。 专业设计的字体在重量和样式方面提供各种定制,以创建一个完整的系列。 此外,它们提供了相当多的字距调整,支持多语言、排版定制。

以下是考虑的最重要的印刷术语:

尺寸

并非每种字体都是平等创建的。 有些人使用胖而宽的方面,而另一些人则使用瘦而窄的方面。 不同类型的字体可以在页面上获得不同数量的空间。

字符的高度表示为 X 高度。 当您配对不同的字体时,最好只使用那些具有相似 x 高度的字体。 另一方面,字符的宽度称为“设置宽度”,它决定了字母将占用多少空间并与其他字母缓冲。

点系统是自 18 世纪以来用于测量类型的方法。 一个点可以测量为1/72英寸,12个点可以形成一个皮卡。 Pica 是衡量列宽的单位。 此外,尺寸可以以像素、英寸或毫米为单位。 这取决于项目的要求。

领导

每行文字之间的垂直间距称为行距。 之所以称其为行距,是因为在使用金属排版的时候,铅字就被用来划分字体的行数。 获得可读正文文本的经验法则是使用高于字体大小的前导值。 您可以使用 1.25 到 1.5 倍的领先值。

跟踪和字距调整

字距调整是涉及调整字符之间的空间的行为。 它有助于产生和谐的配对。

例如,当您使用大写字母“A”和大写字母“V”时,“V”字母左上角的对角线笔画与“A”右下角部分对齐。

另一方面,跟踪是与均匀应用的所有字符的间距有关的术语。 Kerning 与 track 类似,但两者并不相同。

措施

度量是解释文本块宽度的术语。 为了获得最佳的阅读体验,您应该将度量视为排版的一个重要方面。

层次结构和规模

所有类型不能以相同的大小使用,您必须为类型设置层次结构。 否则,读者将难以理解哪些信息比其他信息最重要。

通常,标题较大,子标题较小,正文类型略小于子标题,以帮助读者理解其层次结构。

不仅仅是尺寸,使用不同的颜色、重量和间距也可以帮助您在工作中设置层次结构。

词汇表

我们在这里涵盖了几乎所有涉及排版的基本概念和术语。

Glossary

  • Aesc :发音为“Ash”。 它是两个字母的连字,即。 'a' 和 'e'。 aesc 的起源来自古英语,它表示为双元音。 Aesc 已迁移到冰岛语和丹麦语等字母。
  • 光圈:光圈是字形的打结开口,可以用“e”之类的字母看到,光圈的大小根据其实现而变化。 然而,当您改变光圈时,其效果将反映在字体的可读性上。
  • 顶点:顶点是字符顶部的点。 是左右笔画交汇的地方。
  • 基线:这是大写字母的基础所在的部分。
  • Bowl : Bowl 被认为是“b”和“p”等字母的封闭部分。
  • 括号:它是一个楔形的轮廓,对于在许多字体中保持衬线和形成字体的词干很有价值。
  • 大写高度:大写高度是基线上方大写字母的高度。
  • 计数器:计数器被封闭或不完全封闭的字母形式的一部分。 计数器可以在字母“c”或“g”和“e”的下部看到。 这部分可以和碗混在一起。
  • Descender :它是低于基线的字母形式的一部分。 例如 - 像“p”、“y”和“q”这样的字母。
  • :耳是从碗的右上方展开的小笔画。
  • Glyph :它是构成字体的奇异部分。 任何有助于构建字体的单数部分,无论是标点符号、数字、字母,甚至是 dingbat,都包含在其中。 字形可以称为排版的构建块。
  • 装订线:它是您作品的两页之间提供的空间。 在文本列中通常可以看到排水沟。
  • Orphan :Orphan 是新段落的第一行,在页面末尾穿线。 这不是您希望在项目中拥有的东西,因为它被认为是一种不好的做法。
  • Pica :Pica 是衡量列宽的单位。 一个 pica 中有 16 个像素或 12 个点。
  • 可读性:它被称为易于阅读,包括使用可以通过眼睛轻松扫描的文本块。
  • Serif :它是带有衬线的字体。 这种字体中字母的笔画结尾源于罗马倾向。
  • 无衬线:没有衬线的字体是无衬线或无衬线。
  • Spine :它是主要的弯曲笔划,出现在大写字母“S”的小写字母中。
  • Spur :它是一个小凸起,出现在字母形状的曲线上。 它也被称为胡须或喙。 例如 - 字母“G”。
  • 词干:全长笔画在直立字中称为词干。 它是垂直的。
  • X-height :给定字体中小写字母“x”的高度是 x-height。

7 排版理念和最佳实践

Typography Ideas and Best Practices

以下是您可以在工作中使用的最佳排版实践。 在您的项目中使用这些技巧来创建您自己的杰作。

选择正确字体的重要性

每个设计师都有一个他最喜欢的字体列表。 但是,这并不意味着您必须始终只从您最喜欢的列表中选择一种字体。 每一种字体都有自己的风格、个性和情绪。 因此,您必须决定哪种字体最适合您的设计。 字体选择很重要,因为它可以帮助您向观众传达信息。

牢记你的听众

在选择与您的设计理念相得益彰的字体后,您应该考虑它是否适合您的受众。 一组目标受众可能会觉得你的字体很时髦,而有些人会认为它们过时了。 因此,您必须了解您正在为谁设计项目。 在确定字体决定之前,应考虑受众的年龄、性别、位置和其他因素。

设置层次结构

如前所述,层次结构在排版中起着重要作用。 您的图形应该井井有条,并且应该易于导航给读者。 排版层次结构对于制作大量文本的设计非常有用,例如书籍、通讯、杂志和其他传统印刷出版物。

注意间距和对齐

间距和对齐可能听起来不那么重要,但它肯定不是。 如果没有适当的间距和对齐方式,您的设计会显得混乱、杂乱和普通。 间距包括前导、边距、跟踪和空白的使用。

在需要时使用 Kerning

许多设计师对跟踪和字距调整感到困惑。 但是,它们都是不同的术语。 字距调整使您的排版看起来专业而优美。

不要超过字体、粗细和样式的使用

我们都喜欢使用不同的字体并自定义它们以看起来优雅。 然而,在一个设计中使用不同的字体会让你的作品看起来很业余和凌乱。 您应该避免在一个设计中使用超过三种字体,以使其具有专业的外观。

观察与实践

一种尝试和测试提高您的排版技能的方法是研究其他设计师如何在他们的工作中使用排版。 这是一项需要练习和关注细节的技能,以了解某人如何在他们的项目中使用排版,以及您将如何在您的项目中使用它们。

这是排版的终极指南。 希望本指南可以帮助您了解不同的概念和实践,从而提高您的排版技能。