一切都是关联的，更全面的思考将会带来更成熟的产品。

Google 所提出的「整体网页设计」最近被越来越多地提起。对于设计师和开发者而言，它所涉及到的内容并没有表面上看起来那么粗犷简单。

用最简单的方式来解释，所谓的整体网页设计是将整个项目视为一个整体来审视，来看待和处理，深入理解和洞悉整体中每个环节之间的关系，把控全程。如果视觉设计不理想，再好的内容都无法脱颖而出，它们应当是一体的。同样的，如果世界上视觉设计最优秀的网页却缺少可用性，那么它也难以在用户面前立足。这些都是没有借助整体网页设计的方法而出现的常见问题，也是绝大多数网页设计项目所亟待解决的问题。

以下是「整体网页设计」的工作原理：

一、整体设计理念

整体网页设计的核心是设计的过程。在借助整体网页设计方法来推进项目的时候，设计和开发团队的执行流程和之前可能会截然不同，不过在内容和细节处还是有许多共通之处的。

从设计师的角度上来看，设计、技术、性能表现和业务影响是主要的影响因素。策划和研究等阶段通常是由其他人来进行，但是如果项目是由一人负责那么通常也就得由设计师一人包揽了。这些环节还可以继续往小了分解：内容和信息传达，UI设计，UX设计，视觉设计，测试，培训和反馈等等。

所有的这些步骤看起来都不尽相同，具体执行则取决于谁来规划。WebdesignerDepot 曾经出过一个详细的清单列表，其中包含了详细的注意事项。其中有六个问题，在你做任何决策的时候，最好先问问你自己这六个问题。

在网页的设计和开发过程中，前后因果关系通常是非常明晰的。你所做的每一个决策都会影响到你的用户，你自己，你的同事或者员工，你的股东，以及一些你甚至还没考虑到的人。最终整个产品都会作用于你的生活，无论这种作用是好还是坏。

二、规划和研究

在网页设计项目的规划和研究阶段，你应该做三件事情：

• 确定项目的目标
• 定义项目的范畴
• 定义受众和目标用户的角色形象

这些要素将决定了项目中各个环节要如何结合到一起，并且确定了各个部分之间要如何推进。如果项目中的组件不符合目标或者超出了范围，那么就需要重新调整或者评估。

三、设计

设计阶段通常是整个设计项目当中最有趣的部分，设计师在这个环节通过线框图勾勒框架，填充内容，并且最终定义视觉效果，慢慢将内容和视觉统一到一个体系当中。

这一过程，设计师的任务包括：

• 绘制网站地图和线框图（基于项目的界定范围）
• 创建和搜集所有的内容，包括图片、文本、视频和动画等
• 创建视觉元素，从情绪板到配色方案等
• 设计清晰明确的布局、层次结构和高效的信息架构

四、技术和性能

网站最重要的功能和技术紧密关联，而它的极限也同技术相关。你设计的网站功能是否能够最终实现出来？用户能否完全理解这些功能，并且能够正确地使用它们？

而影响网站的打开速度和性能的技术问题，可以列出一个长长的列表，想要达成你计划中的效果，可能需要整合再整合才行。根据以往的经验，网站需要真正服务于网站的所有者（以他们理解的方式搜集正确的数据）和用户（网站必须快速且易于理解和使用）。

说到性能，就绕不开搜索这个问题。由于用户获取信息的方式通常和搜索引擎紧密关联，绝大多数网站的流量和搜索引擎的协助是分不开的。在设计和开发的过程中，一定要将 SEO 的策略纳入到整个环节当中，在一开始就要考虑到它的存在。

这样一来，就要求你根据项目的目标和范畴来权衡使用哪些工具和服务来进行开发，CMS系统的构建过程中采用哪些技术或者插件。总之，你需要明白，技术和性能相关的问题从来都没有一个通用的解决方案，灵活机变是必不可少的。

五、业务影响

当你拥有了一套堪称完美的设计之后，你的工作并没有完成。一个良好的网站项目，在战略上不仅要着眼于设计和功能，还要帮助公司和团队实现业务目标。这也是为什么要将网站首先就视作为整个产品战略的一部分。

网站设计是如何影响整个业务的？它是否有帮助人们找到有用的信息并且了解这个公司？它是否牵涉到销售或者电商？

除此之外，还需要考虑这个问题：在客户端的另一头是谁在使用或者维护它？有哪些信息反馈、投资说明或者分析图表，能够表明当前项目是可行的，甚至是成功的？

你需要一开始就考虑这个问题的答案。你可能需要为电商平台设计一个完全不同的界面，而不是单纯只依靠一个信息化的网站。根据总体目标，你可能需要基于差异化的策略设计出完全不同的品牌频道。

这当中，最重要的可能是反馈机制的建立。当用户在点击网站的时候，每一个点击都在传递一些关键性的信息。你可以使用这些信息来辅助设计，让用户「正确」地同内容进行交互，也可以借此针对网站内容进行更为有效的调整。

千万不要忘记那些忠实的用户。对此，WebdesignerDepot 给出了如下的建议：

许多修改和调整可能意味着完全抛弃现有的用户，汤恩比是当你去除或者隐藏之前他们所喜爱的旧有的功能。如果你的用户每天都会使用你的网站，那么你一定要考虑修改和调整对他们的工作和生活所产生的影响。

六、结语

当你使用全面网页设计的方法来推进网页项目的时候，你需要同时考虑和规划更多的事情，上一步和下一步之间的影响，经常针对每一个步骤来衡量它们是否符合目标和整个项目的范畴。

一切都是关联的，更全面的思考将会带来更成熟的产品。

原文作者 : CARRIE COUSINS 

译者/编辑 : 陈子木

译文地址：https://www.uisdc.com/what-is-holistic-web-design

本文由 @陈子木 授权发布于人人都是产品经理，未经作者许可，禁止转载。

题图来自 Pexels，基于 CC0 协议