标准化设计的网页通常具有系统的网页样式指南。 如果要确保您的Web设计可以更加一致，并且每个参与者和用户都可以在标准化框架内进行设计，开发和使用，那么样式指南的存在就非常有意义。 由于我们要设计样式指南，因此应包含哪些信息？ 如何确保其他人可以遵循其标准并保持设计和体验的一致性？ 今天我们将讨论这个话题。 至 品牌说明 如果您从未制作过样式指南，那么从头开始创建完整的样式指南绝对是一项艰巨的任务。 新手最好找到自己喜欢的样式指南作为参考模板，MailChimp的样式指南非常好，并且还符合CC许可证。 大多数样式指南由两部分组成： 至 文案写作规范 视觉指南 指南的两个部分实际上同样重要，并且贯穿于样式指南。 将不同元素整合在一起可以建立足够知名度的品牌形象。 实际上，每个品牌和网站都会有所不同。 当您准备为文本和视觉选择色调和样式时，还应该在整个系统中考虑您和您的用户。 进行品牌识别时，应考虑用户和利益相关者。 他们当前想要的品牌设计是他们所期望的吗？ 是否考虑了所有因素？ 用户是否希望与之互动？ 至 语调与语调 尽管视觉在样式指南中占最大比例，但副本的色调和色调也非常重要。 它们是品牌和网站“身份”的一部分。 他们确定与用户交流的方式。 是正式的还是随意的，冗长而准确的，还是直截了当的？ 您的风格指南应与网站的广告文字和风格相一致。 这可以使您的团队对设计的期望更加明确，并且对表达方式对品牌形象的影响有更清晰的了解。 因此，您可以与外界交流的每个单词都应保持一致的语调。 返回到MailChimp案例，如果您仔细阅读，它将被发送现在，他们还试图通过语言建立独特的品牌形象。 当他们在样式指南中提到自己的吉祥物时，他们说：“弗雷迪是我们的吉祥物。我们不会让他与我们的徽标结合。弗雷迪总是向右看，并且总是眨眼。” 至 规则和用途 样式指南是您设计的“脚本”。 与强调“规则”相比，“脚本”一词是否更亲切？ 样式指南应详细概述何时何地应使用哪些字体，颜色和样式，并以简洁和可移动的方式表达它们。 这是清单： 配色方案，包括每种颜色的特定参数以及其他可接受的色调 字体和布局计划，包括字体类型，大小，粗细和每个部分的特定用法 LOGO，包括其样式，变体，大小和位置的描述 拼写，关键字选择，文案风格（包括按钮，社交媒体等） 图片使用规范，包括颜色，裁切规则和视觉性能标准 SEO信息，例如可选标签和关键字 网格标准（主要用于网页布局和打印） 空格和空白的说明（设计紧密度等） 关键点的解释（团队成员可能提出的问题或需要澄清的问题） 简单而具体的概念 下一步是进入关键链接。 当您最终收集上述所有信息时，需要将它们分解，重新组织，然后将它们组织成简单，具体和可执行的概念。 内容表达不要过分限制，毕竟这是样式指南，重点是视觉指南，设计是核心； 将相关的和相关的项目整合在一起以进行快速指导：在一页上介绍颜色，在另一页上制定布局规格，等等。 使用图片示例来显示界面的外观，而不是简单地引入无聊的文本。 提供可用的特定说明。 例如，在配色方案中提供了RGB或CMYK的特定值，以确保颜色的使用可以保持一致; 分解并解释设计案例的一部分，以确保每个元素的功能性能和使用规则很明确； 示例和代码片段 无论您的样式指南是印刷的，电子的还是基于Web的，它都应包含可用的工具和材料。 其中最关键的是用例，可以做什么和禁止什么。 您可以专注于品牌的视觉呈现。 以后，您可以将易于访问的零件放入列表中，并创建一个材料库，所有团队成员都可以根据使用频率对其进行访问。 该材料库最好存储在本地，以方便访问，并且其中的材料和文档可以随着项目的进行而更新。 之后，提供一系列基于云的软件列表（提供链接，登录信息等），向云提交材料，并包括相应的字体包，徽标和图像材料。 这些文件和材料应合理组织，当其他成员访问时，他们可以根据组织逻辑找到相应的文件，工具或材料。 （本地，云和备份应有序组织） 当涉及样式和特定功能的开发时，应创建代码片段列表，以确保前端人员可以快速呼叫，尤其是最常用的部分，该部分应该位于每个人都可以访问的最易访问的共享位置 然后打电话。 最后一点是要记住要更新。 当确定要更改文档和材料时，请确保本地和云文档和材料完整且即时更新。 实施样式指南 最后一个问题终于来了。 那么人们如何完全遵循样式指南中的规则？ 如果您的样式指南井井有条，概念清晰，需求明确且组织清晰，则此样式至少在规则中具有坚实的基础。 简单明了的语言可以使读者更容易理解和遵循。 设计网站时要谨慎对待样式指南，以使其易于使用。 这样，用户将不知不觉地遵循您的规则前进。 作为网站的样式指南，它本身不是静态的。 您应该为团队的其他成员留出足够的空间来改进和添加内容，以确保其灵活性。 同样，样式指南还应该有一个“管理员”，用于批准和控制更改以及协调整个系统。 至