toj:广告印刷_了解印刷术：10个有用的工具和资源

在我的上一篇关于理解印刷术的文章中，我写了关于印刷术设计的内容，以及如何操纵印刷术来改善您的网站布局并增强用户体验。 在本文中，我列出了我最喜欢的10种网络排版工具 。

这些可以帮助构建HTML网格和内容区域，创建CSS样式，生成字体名称以及许多其他有趣的东西。 查看下面的一些链接，并确保在讨论区中让我们知道您的想法。

该在线指南由24ways设计博客发布。 它具有一个矩阵表，其中包含您可以从各种软件供应商处默认找到的所有标准Web字体。 热门标题包括Windows，Mac OS X，Microsoft Office和Adobe Creative Suite程序。

当您冒险使用标准黑白模型之外时，颜色对比度通常是个问题。 当您找到匹配项时，感觉就像是设计的完美。 然而，糟糕的颜色组合选择看起来非常糟糕，并且会对整体设计产生负面影响。 这个小型的网络工具可以帮助您挑选出一组颜色，以使任何样式的布局相互匹配。

您是否需要一个Lorem Ipsum工具，它不仅可以输出文本，还可以做更多的事情？ 这个在线HTML生成器将为最常见的页面元素创建代码块。 一些示例包括无序列表，定义列表，Web表单，表格以及许多其他解决方案。

作为CSS开发人员，Typechart是我最喜欢的工具之一。 我经常希望将系统上的特定字体与Web项目相匹配，但是我没有时间浏览整个收藏集。 这个强大的工具使您可以筛选字体家族的流行选择，甚至下载正确CSS代码！

除非您重置默认的浏览器文本大小，否则您可能会遇到将em与像素匹配的问题。 此浏览器内应用程序同时提供了px到em的转换表和用户界面。 当然，这是一个非常简单的工具，但是它提供了具有非常简单功能的便捷指南-而且您无法击败免费价格标签。

我不建议您坚持使用CSS类型集太久，因为它确实是一个初学者的工具。 它允许您根据所选的特定字体属性生成CSS代码。 尽管起初非常有用，但随着时间的流逝，它变得越来越难依靠。 而且您将无法主动掌握CSS属性。 但是，如果您需要节省项目时间，则不能忽略此工具。

这是字体预览库的一个非常独特的示例。 典型的翻转包括一些操作系统固有的字体。 它会自动扫描您的字体目录，以选择最安全的网络解决方案。 您可以并排比较它们，并轻松在自己喜欢的选项之间进行选择。 这是您节省时间的又一个节省时间的好方法，直到最后一分钟才考虑。

关于在HTML和CSS中围绕网格进行设计的讨论很多。 您可能会了解网格工作原理的概念，以像素为单位衡量网站也没有什么不同。 CSS-Tricks编写的此网格教程更像是一个引导性的工作，旨在介绍数字时代的印刷术基础知识。 这是Web设计领域中更为高级的主题。 但是，如果您有耐心，我建议仔细阅读详细信息，以查看这些网格属性如何真正影响您的页面布局。

我们所有人都找到了带有某些非常酷的无法识别字体的徽标或图像。 WhatTheFont在互联网上已经走了几年了，它仍然是我的最爱。 您选择要上传的图像，其脚本将分析图片中的文本以匹配任何相似的字体。 该应用程序甚至会将您链接到外部产品，您可以在此方便地购买每种字体。

最终，这是一个非常强大的工具，用于生成线高和节奏属性。 只需输入基本字体大小和行高的值，或在侧面添加您自己的自定义CSS代码。 该应用程序将以几种不同的样式生成预览，以便您可以了解这些属性在您自己的网站上的外观。

翻译自: https://www.hongkiat.com/blog/typography-tools-resources/