综合网站规划指南（第 3 部分）

在第 2 部分中，我介绍了评估计划、选择网络专业人员和确定网站结构的详细信息。 为什么网络规划与规划与您的业务相关的任何其他事情一样重要的问题已在第 1 部分中讨论过，因此请继续阅读该部分，以防您错过了它。 在本指南今天的最后一部分中，我将从任何初始设计中最常见的一些方法开始。

初始设计：三种常用方法

当然，还有其他的，包括结合每个元素的混合体，每个设计团队和每个项目都是不同的，但有创建网页设计的核心方法。

1. 经典的 Photoshop 样机方法

通常在 Adob​​e Photoshop（行业标准）或 Sketch 等其他设计软件中创建，初始设计将包括主页的视觉准确图像（“模型”）和至少一个内部页面。

您的企业的视觉品牌元素应该在这里应用。 如果除了徽标之外还有定义明确的图形，它们将决定网站的设计。 但是，如果您的品牌缺乏细节，设计师将尽最大努力创建准确反映业务的作品，并以您现有的图形作为起点。

以下是成功模型的关键点的简短列表。 我们假设设计师在 Photoshop 中工作，但是，这些指南也适用于其他设计程序。

• 从带有预先绘制的像素精确参考线的预制网格开始。 一些设计师创建自己的，而其他人可能会坚持预设的网格系统。 无论如何，有一个干净的模板开始是很重要的。 使您的画布比您设计的宽度更宽，这样您就可以在一侧添加注释并感受网站在宽浏览器窗口中浮动时的感觉。
• 在画布的边缘添加调色板和基本品牌元素（即字体），以便您在屏幕上或打印时查看它以供参考。
• 将所有内容绘制到精确的像素，并围绕设计元素绘制清晰的参考线和/或切片。 当前端开发人员稍后从模型创建 HTML 时，这一点变得至关重要，但是，您的设计只有在“大屏幕”设备上显示时才能达到像素精度。
• 使用逻辑文件夹/子文件夹结构组织所有设计元素，并清楚地标记每个项目。
• 如果设计人员将他们的文件交给 HTML 开发人员，这一点尤其重要。 为其内容命名您的文件夹和图层，这样以后就不会混淆。 例如：“Sidebar - events header”是明确的，“Layer14 Copy Copy Copy”不是。

• 明确说明字体、对齐方式、重复背景元素、渐变以及任何需要使用 CSS 技术实现的内容。 在 Photoshop 中，便签功能对此很有用。 如果不清楚，请询问将您的设计转换为工作页面的人员。
• 如果对整个站点中出现的标题、导航或其他设计元素使用通用样式，请考虑为它们制作单独的 Photoshop 文档。 一些设计师发现“分块”更容易，尤其是在大型项目中。
• 使用真实的内容。 设计师经常使用希腊语（“lorem ipsum”）来填充空间，这对于正文来说是可以的。 但是，对于标题、标题、事件等，尽量使用逼真的文案。 考虑以下两个标题。 布局注意事项各不相同：
  • “Widgets, Inc. 荣获绿色制造奖”
  • “Widgets, Inc. 员工赢得具有里程碑意义的法庭案件，确认员工有权在培训与工作角色相关时申请大学学费报销”

这种方法的问题

当您设计像素完美的模型时，您可以放心，该网站的外观在桌面网络上将非常接近 - 但仅此而已。 一旦你切换到不同的设备，它就会改变。 因此，至少，您需要通过显示具有相似布局的网站向企业传达设计在较小屏幕（平板电脑、智能手机）上查看时将如何变化，或者设计其他常见屏幕尺寸的模型。 正如您可以想象的那样，这是很多额外的设计工作，如果您在以桌面为中心的模型上更改一个元素，您也必须在其他模型上进行更改。 这是智能手机视图。

2. 在浏览器中设计

随着响应式网页设计的兴起，一些设计师正在远离 Photoshop 模型方法，转而使用像 Bootstrap 或 Foundation 这样的响应式框架，或者像 Froont 或 Typecast 这样的工具。 这些工具允许非常快速的迭代设计，让您可以看到网站在不同设备上的外观。

您仍然可以使用 Photoshop 或其他图形设计工具来创建风格化元素以放置在设计中，但大部分设计将在这些工具之外进行。 没有好的方法可以“准确地展示业务的外观”，因此对于习惯于为桌面网络制作像素完美模型的设计师来说，浏览器内设计可能不是最好的方法。 对于许多人来说，这种方法也代表了他们流程的重大变化，可能需要一段时间才能掌握。 大多数人认为这是一种必要的演变，因为 Photoshop 模型只能代表显示您网站内容的众多“框架”之一，而网络世界从一开始就迅速朝着为多个平台设计的方向发展。

当需要编写构成网站的 HTML、CSS 和 Javascript 时，您可以坚持使用最初用于创建设计迭代的框架，调整其代码，或者从头开始编写自己的框架，使用您的框架设计作为指引。

3.元素拼贴（也称风格拼贴、风格拼贴）

使用这种方法，设计师将组装构成网站的一系列元素，包括标题、导航、图标、示例照片、插图、表格、交互元素以及任何其他认为必要的东西，以更好地了解网站的外观和感觉. 此外，根据设计工具的不同，这些元素的布局方式可能会显示它们的外观将如何随着屏幕尺寸的变化而变化。 这通常与至少主页和一些内部页面的某种图形模型相结合。 （企业很难仅根据元素拼贴来想象网站中页面的外观。）

注意：这些示例图像不是按比例绘制的——我们的 Photoshop 版本的元素拼贴是一页长的，1500X4500 像素，所以我们不能把它放在一起。

对于长期使用 Photoshop 模型方法的设计师（和企业）来说，这也是一个新领域，需要改变视角。 使用样式原型，您不是试图准确地布局页面，而是显示网站的关键部分并获得关于总体外观和感觉的反馈。 因为响应式网站的外观必须随着屏幕尺寸的变化而发生根本性的变化，所以这种方法更多地是关于网站的各个部分，并了解设计的方向。 您没有将网站作为一个整体进行展示，更不用说对每个页面的外观做出像素完美的表示了。

这可以节省大量时间，但同样，如果业务不够舒适（或信任），无法让设计师稍后做出结构性决策，那么这种方法可能很难卖。 也就是说，它确实可以创建一个灵活的环境，在其中为无数平台快速创建网页设计。

虽然平面设计的原则是永恒的，但用于网站设计的方法会随着时间的推移而改变和发展。 我强烈建议您观看“后竞争时代的设计交付物”，以发现这种方法的价值。

当使用这种元素拼贴方法时，企业必须接受给定页面没有准确、精确、最终的草稿，只有同意的布局指南。 响应式站点的本质是使其内容适应每个设备的功能，因此企业不能期望在开发阶段之前批准固定布局。 使用经过批准的样式原型，设计师可能希望返回线框或工作原型来制定项目所需的所有布局。 然后在构建网站时，您会将拼贴画的元素组合到每个独特布局的视觉结构中。

设计界有很多关于创建网页设计的最佳工具、方法和流程的讨论和辩论。 设计师往往对哪种方法是“最好的”方法有非常强烈的感觉，虽然这是可以理解的，但使用最适合项目和业务的流程很重要。 对于设计师来说，在项目允许的情况下熟悉使用一系列方法和系统并拓宽视野是很明智的。

作者注
我非常犹豫是否要包含以下一些内容，因为它突出了业务设计师关系中的严重紧张局势。 虽然它似乎对企业主过于挑剔，但我相信它对企业来说具有很大的价值，因为在网站项目中存在如此多的时间和金钱风险。
出于外交和维护客户关系的利益，设计师可能不会向企业主表达这些挫败感，但以下问题可能并且确实会使项目脱轨。

设计批准和修订

无论为项目选择哪种设计方法，当设计完成时，结果都会与业务部门共享以供批准，并且通常会有一个（希望是简短的）修订过程。 修订过程涉及设计师和主要利益相关者来回几次，尝试对设计进行不同的编辑，直到设计获得批准。

委员会设计：不要这样做。

在这个阶段，一个常见的（并且完全可以避免的）问题是考虑了太多的意见，只是在数字厨房中有太多的厨师。

为了帮助确保流程顺利进行，企业必须指定一个人作为设计团队的联系人。 该人负责与设计师沟通并就设计方向做出最终决定。

当然，征求对设计的反馈很重要，项目利益相关者可以提供有价值的评论，帮助指导设计过程，使最终结果准确地代表他们的业务。

此外，在某些情况下，需要法律和/或技术人员进行审查。 然而，让整个公司都提供意见，并对所有反馈给予同等重视，很快就会导致没有人感到满意。 确保设计混乱、没有重点的最佳方法是让每个人都参与进来，然后四处奔波进行所有提议的更改。

一般而言，在小型企业或组织中，提供设计反馈的人数超过五人会导致僵局。 越少越好，最多五个。 这五个（或更少）人将征求他们的下属或部门同事的反馈，但该输入应由每个利益相关者汇编并作为统一的单一意见提出。 换句话说，不要邀请十五个人参加设计评审会议。 在您向设计师提供输入之前，先排除所有的来回。 区分客观设计关注点（“这种配色方案真的适合我们的面包店吗？”）与个人设计偏好（“我喜欢蓝色 - 让我们使用更多的蓝色”）也非常重要。

设计不是一种武断的追求。 设计有好有坏。 有要遵循的规则，要遵守的最佳实践，而且只要规划得当，设计决策几乎从来都不是品味问题。 也就是说，设计师在那个确切的位置使用那个确切的蓝色或那个大小的那个字体是有充分理由的。 所有这些小选择都会向用户传达信息。 他们可能会觉得微不足道，但实际上，设计师所做的所有这些选择都很重要。 它们会极大地影响网站的运作方式和接收方式。 不幸的是，许多企业无法理解，仅仅因为他们喜欢它并不意味着其他人都会，而做最能传达企业灵魂的事情就是聘请设计师做的事情。 除非绝对必要，否则不应发表意见。

当自我统治

任何有经验的设计师都曾与具有强烈自我意识和低劣设计感的可怕结合的决策者打过交道。 在最坏的情况下，设计师将被要求使用 CEO 在 Microsoft PowerPoint 中开发的标志，或者完全不适合企业形象的颜色和字体。 不幸的是，这伴随着成为设计师的领域。 有时，可以通过将有问题的艺术品与业内竞争对手或类似公司的专业设计材料放在网格中来消除这种情况——Pinterest 是一个很好的工具。

如果竞争性评论是您的需求评估的一部分，您可能需要参考他们的品牌以供参考。 希望企业能够看到他们的版本在竞争中看起来多么糟糕，并重新考虑他们对这个坏主意的承诺。 然而，最终，决策者可以并且确实通过坚持，与所有可用的证据相反，他们的设计意识应该优先于既定的设计原则，从而毁掉项目。

帮助！ 他们不会让步！

本书早期版本的读者询问处理自我问题的方法。 我希望我有一个聪明或有用的答案给你。 可以说这是人的问题，而不是技术的问题。 为优秀设计的价值做出最好的证明，打出最好的战斗，然后准备好让它休息。

设计张力：设计师与业务

设计师经常处理他们知情的设计概念和企业不知情的设计批评之间的紧张关系。 “坏主意”难题最能说明这一点。 企业将要求设计功能要么丑陋、不可行，要么只是一个坏主意。 （这很常见，以至于有许多网站记录了无能的业务以及导致这种动态¹的头痛。）设计师会在“这太可怕了，我们不会这样做”和“好吧，如果那是你喜欢的……”。 这种反应取决于各种不断变化的因素，包括：

¹ https://clientsfromhell.net, https://theoatmeal.com/comics/design_hell

• 当设计师希望得到报酬时。
• 设计师在项目中的投入程度。
• 设计师在设计阶段投入了多少时间，以及实施这个坏主意会导致多少延迟。
• 风险有多大——这个坏主意会对整个网站造成多大的损害。
• 个性，企业愿意就他们的想法采取建设性的建议。

每个项目都是不同的。 当设计师与不断要求不明智的功能的企业打交道时，有时他们可能会完全取消项目。 在某一点上，不断地解释为什么居中、粗体的红色段落、全部大写、疯狂的 Flash 动画或低质量的摄影会导致网站无效²实在是太累了。 设计师的态度迅速从“让我们做出让我们引以为豪的真正伟大的东西”转变为“让我们完成它，这样我们就不必再看这个了”。

²其他情绪杀手包括儿童书籍中最常使用的自动播放视频和字体。

在考虑上述情况的同时，还要意识到这枚硬币还有另一面。 人的问题也可能出现在设计师的末端。 一些设计师的技能可能达不到标准，他们可能拒绝听取对其工作的有效批评，或者可能不重视业务的知情投入。 避免这种情况的一个好方法是从设计师过去的客户那里获得好的参考。

考虑内容

考虑扩张。 例如，您可能有一个新闻部分。 首先，您有六个新闻项目。 没关系。 您将创建一个带有摘要的主要新闻页面，并将摘要链接到详细信息页面。 但是当你有 10 条、20 条或 50 条新闻时会发生什么？ 现在还有其他考虑。 你想存档旧新闻吗？ 创建分页？ 只显示最近的十项？ 这应该在设计过程中加以考虑。 在设计过程中尽可能多地规划内容，并尽可能提前考虑——规划你将拥有的内容，而不是你现在拥有的内容。

网页风格指南

风格指南是适当规划的亮点。 样式指南将包含在一个位置在整个站点中使用的所有设计、布局、交互（即 JavaScript）和类型元素。 这通常在 HTML 中完成，因此如果您是不编码的设计师，您需要为您的样式指南创建一个模型，并将其与您的其他设计一起交付给您的前端开发人员。 如果您使用过前面介绍的元素拼贴方法，则可能不需要在单独的 Web 样式指南中重复自己。 如果您使用的是经典的 Photoshop 模型方法，您将需要一个。 风格指南的元素包括但不限于：

• 导航样式
• <h1> 到 <h5>，也称为标题标签
• 段落
• 列表
• 块引用
• 斜体、粗体、下划线
• 链接，包括活动、悬停和访问状态，即链接的外观，包括鼠标悬停时的外观
• 图标
• 图像和图像风格的使用
• 使用背景图像或“水印”
• 形式。

Canva 的这篇文章探讨了 10 种知名公司的 Web 风格指南。 您还可以使用 Frontify 等在线工具。

使用模式库

对于更大范围的网站，您可以将 web 样式概念扩展到更强大的模式库，它解释了各种元素如何出现以及如何处理它们。 这些元素的示例代码通常是库的一部分。 这不仅仅是它的图片，而是事物本身。 例如，表单是什么样子，出现错误时视觉上会发生什么，提交评论的过程是什么等。

经批准的模型、元素拼贴和线框，以及样式指南，被用作下一步开发的构建块。

HTML/CSS 创建

使用设计和样式指南，HTML/CSS 专家（前端编码器）将创建 HTML 模板，准确地表示已批准的设计。 在某些情况下，模板看起来与模型相同，但是，在使用 Photoshop 制作模型的情况下，可以预期会有细微的差异。

您的前端编码人员可能还需要与设计相关的其他指南和资产，例如调色板、特定图像、图标，以及（如果尚未明确指出的话）设计规则，例如边距和填充。 在开始发送文件之前，请确保您知道所有可交付成果。 如果设计和风格指南是在非常注重细节的情况下创建的，那么在这个阶段应该很少有问题或猜测； 工作应该伴随着嗡嗡声。

交互式元素创建

交互元素可以像下拉菜单一样简单，也可以像饼图创建器一样精细。 这些元素通常使用 JavaScript 开发，通常使用 jQuery 之类的脚本库。 在最一般的层面上，这包括组装（和编写）一组与您网站上的页面交互的指令。 站点和服务器之间也可能需要考虑交互性。 您可能正在连接 API ³ 、制作预订或日历系统等，或者使用来自第三方服务的小部件。

³本质上是一个或多个系统之间的桥梁。 例如，Facebook 提供了一个 API，允许您将帖子从墙上拉到不相关的网站。

终于，您出色的设计已转换为代码，并准备好集成到内容管理系统 (CMS) 中。 它正在成为一个网站！

负责将代码“拼接”到 CMS 的个人或团队将为您提供 CMS 控制面板的登录名，允许您输入内容，包括文本、照片、视频和文档。 大多数作家更喜欢从 Microsoft Word 中剪切和粘贴。

根据所选 CMS 的具体情况，您可以毫无问题地执行此操作，保留简单的格式，如粗体、斜体和列表。 但是，CMS 可能会在您剪切和粘贴时删除此格式，需要您将其添加回来。 虽然有时很乏味，但这可以确保您的内容保持整洁有序，从而使其更容易被搜索引擎索引，更容易打印、引用和转换为其他格式。

尽管实际上这个过程非常复杂，但我忽略了细节，因为每个 CMS 的确切过程都是独一无二的，并且要做好这件事依赖于 Web/CMS 开发人员的专业知识。

培训和文档

虽然现代 CMS 可以非常用户友好，但为负责输入内容的人员协调培训非常重要。 如果可能，现场培训是最好的，网络会议是第二选择。 培训在非常小的团体中效果最好——5 人或更少。 此外，让人们真正按照自己完成任务所需的步骤（而不是让他们看着培训师并在他们独自一人时尝试记住如何去做）会更有效。

培训应有文件支持，文件可以采取多种形式：

• 分步视频（“截屏视频”）
• 带有屏幕截图的 PDF
• 印刷指南
• 上下文帮助（内置于 CMS）。

有时文档结合了上述部分或全部内容。 无论您选择什么，请记住输入内容的人员的技能水平。 许多在办公室工作的人都能胜任 Microsoft Word 和电子邮件，但可能会受到基本但必要的“设计”任务的挑战，例如调整图像大小和裁剪图像。 还要记住，企业可能没有使用与设计师相同的一组专业设计工具，因此也要考虑到企业的技术问题。

将文档的编写保存到尽可能接近项目结束时是个好主意。 请记住，如果您在 CMS 中期项目中更改某些内容，您可能必须更新文档以匹配。 这可能非常耗时（并且也令人困惑），因此请尝试协调项目的各个部分，以便在内容输入过程完成后编写文档。

把这一切放在一起……

在这一点上，按照前面的步骤，您现在应该坐在一个非常可靠的网站上。 无论您的项目规模如何，现在都是执行以下操作的好时机：

再次检查您的内容，对照上面为网络编写的内容中列出的要点进行检查。

请第三方校对您的所有内容。 这不是设计师或原作者的任务。 最好引进一个有新观点的人。 不要校对自己的工作。

Beta测试

当您觉得您的网站几乎可以让公众看到时，就该进行 Beta 测试了——这是一个遍历网站各个方面的过程，确保所有内容都按预期显示和运行。 至少考虑这个清单：

• 该网站是否在所有目标 Web 浏览器中都符合预期？ Web 浏览器包括常见的 Internet Explorer、Firefox、Safari 和 Chrome，以及常见的移动设备附带的浏览器。 如果您到目前为止一直在桌面浏览器上查看该网站，那么当您切换到平板电脑或智能手机时，您可能会发现意外的故障。 现在是时候在各种设备上彻底审查您的网站，然后才能将其视为可供公众使用。 请记住——您网站的受众将使用各种设备来查看您的网站，并且它需要在所有设备上都能正常运行。 您不必在所有可能的手机或平板电脑上对您的网站进行物理测试，但您应该在少数常用设备上进行尝试。 请勿出于测试目的购买 5 年的黑莓手机。
  “仿真”网站和 Spoon.net 等服务将在几乎所有人类已知的浏览器或设备上生成您网站的预览，让您很好地了解它在大多数情况下的外观。
• 交互功能运行顺畅。
• 联系方式或其他形式可预测地工作，并对所提交信息的用户和接收者产生正确的响应。
• 错误消息很有帮助且人性化。
• 内部和外部链接功能。
• 图像大小合适。
• 所有占位符内容已被最终副本/图像等替换。
• 内部和外部链接，包括电子邮件链接，都可以正常工作。
• 与第三方软件（例如电子邮件服务提供商）的集成正在发挥作用。

在这一点上，征集迄今为止没有参与该过程的人是非常明智的，并要求他们有条不紊地浏览网站中的每个页面和功能，并注意他们发现的任何错误或故障。 不要使用已经盯着该网站数月的人。 需要注意的问题可能包括拼写错误、错误链接、图像大小、特定移动设备上的故障或内容丢失或不完整。 （请务必告诉您的测试人员，此时网站的设计已经确定，因此他们不会浪费时间查看非内容方面的考虑。）

发射前协调

当您接近发布时间时，您需要与公司的其他营销工作进行协调。 如果您在社交媒体上很活跃，请编写和校对新/重新设计网站的公告，并设置发布公告的时间表。 准备更新您发出的语音邮件消息并协调印刷广告——支持网站启动所需的一切。

重定向来自“旧”站点的流量

如果您的新网站正在替换以前的版本，它可能具有不同的 URL 结构，您需要将旧结构映射到新结构。 这样做有两个原因。 首先，搜索引擎已将您旧网站的 URL 编入索引。 这种索引对于搜索贵公司提供的产品的人来说具有很大的价值。 当您启动具有不同 URL 的新站点时，旧站点将中断，用户将收到“找不到页面”消息（404 错误）。 您想在搜索引擎中保留您来之不易的位置。 其次，站点访问者可能在您的旧站点中为页面添加了书签，并希望返回它们。 如果这些页面的 URL 发生变化，您需要确保访问者仍会收到与其需求相关的内容，而不是不再存在的页面。

例如，您的旧网站可能有：

• https://oursite.com/company/history.html
• https://oursite.com/staff/california.html

而新网站有：

• https://oursite.com/company-history
• https://oursite.com/staff/california

差异是微妙的，但计算机是非常真实的东西——对于浏览器来说，“history.html”和“company-history.html”之间的差异可能就是火星和地球之间的距离。 您需要浏览旧站点的结构，并记下新站点中具有等效信息的每个页面及其 URL。 如果您的旧网站有很多页面，您可以使用 Powermapper 之类的工具来帮助自动化该过程。 有时新旧 URL 会排列得很好，就像上面的那些。 其他时候，旧 URL 可能在新站点中没有等效项。 如果您关闭了公司的一个部门、中止了一个项目或重组了一个部门，这通常会发生。 无论出于何种原因，您仍然需要使用准确的 URL 才能进行下一步。 处理旧网址的三种方法：

• 如果它们具有与上述示例类似的等效项，则可以将旧 URL 指向新 URL。 为了暂时脱离技术，这是通过 301 重定向完成的，它告诉搜索引擎和用户的网络浏览器 URL 已永久更改。 它看起来像这样： Redirect 301 /company/history.html https://oursite.com/company-history
• 如果链接没有对应的链接，您可以将网站访问者发送到一个页面，该页面显示“抱歉，我们找不到您要查找的内容。我们已经重新设计和重组了我们的网站，并且某些内容已更改或移动。” 并提供站点地图和搜索选项。
• 您还可以将所有不存在的 URL 指向主页。

旧站点的规模越大，重新指向旧 URL 所需的工作就越多。 如果您在旧站点上运行分析，您可以选择仅将前 10 或 20 个旧 URL 重新指向新 URL，并为所有其余的 URL 设置一个包罗万象，将它们指向“抱歉，我们可以'找不到你要找的东西……”页面或主页。 创建包罗万象的重定向或匹配特定 URL 模式的重定向是一项技术工作，我们不会在此讨论，但您可以轻松找到有关 .htaccess 文件（适用于 Linux 服务器）或 web.config 文件（适用于 NT 服务器）的信息) 在 Stack Exchange 或其他资源中。

永远不要在星期五启动

在星期五或假期前启动网站绝不是一个好主意，尤其是许多人依赖的网站。 如果出现问题，当大多数办公室工作人员、供应商和其他可能能够提供帮助的第三方周末回家时，您可能没有资源来修复它。 星期一最适合启动一个新网站，因为这会给您整整一周的时间来解决可能出现的任何意外问题，并获得大量支持来帮助您解决问题。

发射！

一旦您对网站进行了彻底的 Beta 测试，就该启动了。 具体步骤因项目而异，但通常这意味着要么将站点（文件、数据库、配置）从开发环境移动到公共环境，使其对世界可见，要么只是更新服务器设置以允许访问yourcompany.com的访问者查看新网站。

发布后

网络统计

查看您的网站访问者统计数据可以让您深入了解人们如何使用您的网站。 您至少需要一两个月的数据才能做出任何决定。 不要太拘泥于纯粹的数字——它们都近似于一个程度或另一个程度。 趋势应该是您的主要关注点。 以下是需要考虑的几个关键点：

• 游客从哪里来？ 搜索引擎，直接流量（即，有人刚刚输入了您网站的。
• 浏览器中的 URL）、广告、来自其他网站的链接等。
• 游客住在哪里？ 它们主要是本地的、区域的、国家的还是国际的？
哪些页面最受欢迎？
• 访客在网站上停留多长时间？
• 跳出率是多少，即有多少用户在完全离开之前只访问了网站上的一个页面？

Google Analytics 是最常用的网络统计软件之一，您可以在它提供的高级数据中轻松找到这些问题的答案。 其他网络统计软件，如 KISSMetrics 或 Clicky 也应该很容易提供这些答案。

技术文档

您还需要详细说明网站的各个部分是如何在 CMS 上实现的。 这与提供给企业的文档不同。 Much of your technical documentation will simply consist of the annotated elements discussed earlier in this document, including wireframes, style guide and Photoshop documents. Think about what information would be needed if you brought new people in to maintain the site, people who were not at all familiar with it. What do they require to pick up the project? They'll need:

• Credentials for the CMS, web server, and other services connected to the site.
• Written or video instructions on how to perform tasks in the CMS: adding news items, blog posts, swapping out photos — everything that someone can do to the site.
• Recommended technical maintenance — how often do the CMS and other services require updating?
• Notes on backups — what is being backed up, how often, and where is it backed up to?

Note: writing documentation of all kinds is one of a web professional's least favorite tasks, but it's very important. Don't slack on it. Think how terrible it would be to inherit a project without any technical documentation. Then use that dread as your inspiration! You don't want to leave anybody in a lurch down the line and doing this right will save time and frustration later on.

备份

This is often overlooked by businesses and designers alike. Schedule regular backups of the site's files and database. Daily is ideal. Your hosting company may provide an automated way to do this, but if they don't, there are plenty of effective services and tools available to facilitate this process. That way, if your files or database get hacked, erased, corrupted or otherwise damaged, you can restore them with copies from the previous day.

Depending on the size of your site, frequency of updates and some technical matters that vary with each site, you may want to schedule more frequent backups. Ideally, your site will be backed up off-site, that is, in a different place than where it is hosted. Services like Amazon S3 or Rackspace Cloud are ideal for this purpose. The idea is that if your website gets irrevocably damaged, a recent copy is stored in a different physical location, allowing restoration of the site to the last undamaged version.

Maintenance plan

Your maintenance plan, which should have been budgeted for before you started, should clarify roles and responsibilities for every aspect of the site. For example, if two articles per week are to be posted, who is responsible for this, and who is that person's backup? If your site requires photos or graphics to be created regularly, make sure this work is assigned and understood by all involved. Determine who will check links, re-size images, write blog posts, etc. Write a simple maintenance plan and share it with everyone involved in the site's care and feeding. Remember, a good website isn't a one-time event, but rather an extensible communication tool that requires regular updates to remain valuable, relevant and compelling to site visitors.

Solicit visitor feedback

After it's been online for a while, a great way to improve the impact of your site is to solicit visitor feedback. There are a variety of ways to do this, from simple online surveys to on-site focus groups. Site visitors often have trouble articulating what they like and don't like about their experience. With this in mind, it's important to craft very clear and specific questions when soliciting feedback. And remember, if you're going to take a significant amount of visitors' time, offer something in return — a product discount, prize, or simply a handwritten note thanking them.

鳍

OK, one more time for posterity: A good website isn't a one-time event, but rather an extensible communications tool. Once you've built a great website, keep the momentum going. Devote resources to regular maintenance, and check in with your site visitors regularly to identify areas for improvement.

推荐阅读

• "Don't Make Me Think, Revisited: A Common Sense Approach to Web Usability" by Steve Krug
  Helps readers understand the principles of intuitive navigation and information design.
• "Content Strategy for Mobile" by Karen McGrane
  Making the case for a mobile strategy, publishing flexibly to multiple channels, and adapting your workflow to a world of emerging devices, platforms, screen sizes, and resolutions.
• "Design Is A Job" by Mike Monteiro
  From contracts to selling design, from working with clients to working with each other, learn why navigating the business of design is just as important as the craft of it.
• "Grow your SEO" by Candy Phelps
  A beginner's guide to SEO.

定义