重新设计网站的 8 个步骤 2023 年网站顺利改造的清单

已发表: 2022-11-15

Tooltester 受到像您这样的读者的支持。 当您通过我们的链接购买时,我们可能会赚取联属佣金,这使我们能够免费提供我们的研究。

您的网站是否看起来陈旧、丑陋、笨重? 无法正常工作? 那么网站可能需要重新设计。

当然,这说起来容易做起来难。

完美的例子是我们最近改版的 Tooltester 网站。 重新设计工作花了我们1.5年的时间。 毫不夸张。

在您奔向山丘之前,我们应该提到,作为重大品牌重塑活动的一部分,我们重新设计了我们的网站。 这可能使重新设计过程比一般的网站重新启动工作更加复杂。

不过,在此过程中,我们获得了有关尽可能顺利地重新设计网站的宝贵见解。 我们将所学到的知识整理成一个可靠的 8 步网站重新设计路线图,如果您计划重新设计自己的网站,您会发现该路线图很有帮助:

分析

  1. 分析您当前的网站
  2. 分析您的竞争对手

规划

  1. 设定重新设计的目标
  2. 检查您网站的技术设置
  3. 委派网站重新设计的责任

实现

  1. 为重新设计做好准备
  2. 发射日!
  3. 不断改进您的网站

我们还将分享如何将这些步骤应用到我们自己的网站重新设计项目中。 但首先,让我们解决一些基本问题。

即:为什么您需要重新设计网站以及需要花费多少费用?

为什么要重新设计网站?

重新设计网站的原因包括:

  • 您的网站设计已经过时:您最初可能喜欢您网站的外观。 但现在,您发现它的视觉元素难看或与最新的网页设计趋势不同步。 或者您的网站可能没有响应式设计,导致移动设备上的用户难以浏览您的网站。
  • 您的网站基于过时的技术构建:如果您网站的内容管理系统 (CMS) 陈旧且很少更新,则可能存在严重的安全缺陷。 在这种情况下,您实际上是在邀请黑客窃取您的数据或关闭您的整个网站。
  • 您需要新的网站特性和功能:随着时间的推移,您可能需要网站做比最初构建它更多的事情。 例如,如果您要在博客中添加在线商店,那么您需要重新设计您的网站以包含此类商店功能。
  • 薄弱的网站设计会影响您的搜索排名:例如,自 2019 年 7 月以来,Google 采取了移动优先的方法对网站页面进行索引和排名。未针对移动设备进行优化的网站可能会导致搜索排名较低,因此需要重新设计。 确保您使用的网站构建器或 CMS 非常适合 SEO。
  • 您正在重塑品牌:您的公司正在进行重大品牌重塑,并彻底改变其品牌价值、徽标、颜色等。 作为此过程的一部分,您需要重新设计您的营销材料 - 其中包括重新设计您的网站。

最后一个原因尤其引起我们的共鸣。

我们决定重新设计我们的网站,因为我们觉得我们的设计不再代表我们作为一家公司的身份。 作为上下文,我们的旧主页如下所示:

websitetooltester 旧主页

我们之前的网站设计

我们的旧网站看起来好像是由 3 人操作的,这在我们历史上的某个时刻是准确的。 但现在,Tooltester 由一支超过 10 人的出色团队运营!

因此,我们希望我们的网站更加完善,并传达经验丰富的团队如何运营该网站,致力于帮助小型企业找到满足其需求的完美工具。

网站重新设计需要多少钱?

如果您正在聘请专业人员来为您处理整个工作,您可以预期花费以下费用来重新设计网站:

  • 设计页面模板(包括移动网站的模板):每页 100-300 美元
  • 编写 8 页 WordPress 网站主题: 1,500 美元–3,000 美元
  • 获取虚拟主机、域名和电子邮件地址:每月 10-30 美元,具体取决于您每月的网站流量

或者,您可能更喜欢 DIY 网站创建方法,并使用网站构建器从头开始构建新网站。 在这种情况下,您的重新设计成本可能仅为每月 10 至 25 美元,具体取决于您选择的网站构建器。

例如,Wix 网站构建器的 Combo 套餐每月收费 16 美元,其中包括 2GB 存储空间和免费 SSL 证书。 另一方面,在 Squarespace 的个人套餐上构建新网站的费用为每月 16 美元,该套餐提供无限带宽、电子商务功能、高级网站分析等。

(我们还提供了完整的网站费用指南,您可以查看!)

在我们的情况下,我们决定聘请一家品牌代理机构来监督我们的网站重新设计过程。 该机构帮助我们为近 20 种页面创建了新徽标和自定义网页设计模板。

他们的服务并不便宜:我们预留了 5 位数的预算与他们合作。 但他们做得非常出色,我们对结果非常满意!

即使您没有这样的预算,您也会发现您网站的重新设计过程将包括与我们非常相似的步骤。

分析

网站重新设计工作可以分为三个主要阶段:

  1. 分析
  2. 规划
  3. 实现

首先,让我们深入分析过程......

1. 分析您当前的网站

您现有的网站有多少需要更改 - 您需要重新设计整个网站还是仅部分网站?

考虑以下事项:

  • 技术设置:如果您现有的网站非常过时或难以使用,也许您需要更改网站构建器或 CMS。 或者,也许您只需要重新编码主题即可提高网站性能。
  • 搜索引擎优化 (SEO):对您的网站进行 SEO 审核,以检查是否存在可能损害其搜索排名的问题。 具有内置 SEO 审核功能的 SEO 工具,例如 Screaming Frog 和 Ahrefs(网站审核,可免费使用),可以帮助您在决定下一步之前识别此类问题。 例如,如果审核报告您的网站上有 404 错误页面,您可能需要将指向这些页面的链接重定向到其他地方。
  • 设计:您网站的设计元素(仍然)现代且专业吗? 它们准确地反映了您的品牌吗? 如果您要添加新的网站功能,您可能还需要重新设计您的网站以适应它们(如前所述)。 这里有一些寻找灵感的技巧。
  • 导航和用户体验 (UX):随着时间的推移,您可能会收到用户抱怨网站的某些部分如何难以导航,或者某些功能如何难以找到。 优先重新设计这些有问题的界面,以改善用户体验。
提示:Screaming Frog 或 Ahrefs Site Audit 等工具对于创建所有网站 URL 的列表也非常有用。 拥有这样的列表将确保您不会忘记支票中的任何页面,并且还可以更轻松地设置重定向(如果需要)。

有多种工具可以在您的网站上执行此类“健康检查”。 以下是一些可以帮助您入门的内容:

  • Google Analytics 用于监控您的网站流量和着陆页指标
  • Hotjar 一种热图工具,用于跟踪用户行为并了解网站访问者如何与您的网页交互
  • Saber 反馈在您的网站上嵌入反馈按钮,供用户针对他们发现的任何网站问题提交反馈

2. 分析你的竞争对手

检查完您的网站后,将注意力转向竞争对手建立的网站。

对您所在行业的领导者及其网站的功能进行市场调查。 他们做对了什么? 您竞争对手的网站可能具有值得窃取的功能 - 咳咳,我们的意思是,适应您自己的网站。 您还可以考虑让您的网站比他们的网站更好。

也就是说,不要将自己限制在您所在空间的网站上。 其他行业可能拥有与您的网站类似的网站,并采用独特的方法来服务目标受众。 将此类方法从其他行业“移植”到您的网站可能是帮助其在您的领域脱颖而出的关键!

当我们分析网站的竞争时,我们的品牌代理机构要求提供我们的竞争对手名单以供他们审查。 他们还从其他行业的网站中获取了很好的重新设计示例。 例如,既然我们帮助用户比较网站工具,该机构还分析了酒店预订平台如何帮助用户比较酒店。

在进行所有这些研究之后,品牌机构根据我们领域的其他品牌制定了我们的定位。

由于我们的许多竞争对手对工具评论采取非个人化的方式,并且不与读者进行太多互动,因此我们决定 Tooltester 将成为我们读者的“数字专家伙伴”,成为权威而友好的评论来源。

这种定位极大地影响了我们网站的重新设计。 例如,我们决定在网页上突出显示 Tooltester 团队的成员,以唤起个人和相关的工具审查方法。

只需查看我们的“关于”页面,您就会明白我们的意思!

新 Tooltester 关于页面

规划

确定您的网站需要改进的部分? 接下来,您将计划如何重新设计它们。 这涉及:

3. 设定重新设计的目标

列出您希望通过重新设计网站实现的总体业务目标。 这些目标将指导您的网站重新设计策略。

总体目标的示例包括:

  • 在明年内将您的自然流量翻倍
  • 刷新博客上的所有内容
  • 减少用户在在线商店下订单时面临的摩擦

接下来,将您的总体目标分解为更小的、可操作的目标。 这些是您为实现总体目标将采取的实际步骤。

例如,为了实现明年自然流量翻倍的总体目标,您可能需要设定子目标,例如:

  • 为您的网站设置关键字跟踪
  • 更新某个博客文章以更好地定位某个关键字
  • 将 Google Analytics 连接到您的网站以跟踪您的每月有机流量

另一方面,为了实现减少电子商务摩擦的总体目标,您的子目标可能包括:

  • 将多页结账表单重新设计为一页表单
  • 构建一个按钮,让用户在将商品添加到购物车后直接进入结帐
  • 添加安全存储客户信用卡信息以供将来使用的功能

最后,计划何时执行每个子目标。

重要的 SEO 建议:作为一般规则,不要一次更改太多内容

例如,不要尝试在同一次更新中更改您的网站域名、URL 结构、CMS设计。 您对网站所做的每项更改都可能会影响您的搜索排名,并且您需要能够确定某个更改是否是导致您的排名下降的原因。

尝试将总体目标分解为尽可能多的单独的子目标,然后将它们分开。 这样,您就可以更好地控制更改(如果有)对搜索引擎排名的影响。

4. 检查网站的技术设置

您的网站需要建立在强大的技术基础上才能实现有效的性能。 借此机会检查您网站的技术规格是否仍然可以很好地为您服务或者是否需要升级。

例如,您可能希望将网站的 CMS 或网站构建器更改为可提供更快页面加载速度的内容。 或者,如果您想扩展网站的功能,请检查安装第三方插件是否可以解决问题,或者您是否需要聘请网络开发团队来为您编写该功能。

对网站技术设置的所有更改都会产生成本(请参阅上面有关网站重新设计成本的讨论),因此请适当预算。

在我们的案例中,我们的网站使用了 WordPress CMS,并打算继续使用它。 因此,我们“简单”地需要创建一个新的 WordPress 主题并激活它,以更改我们网站的外观,而不是迁移 CMS。

(我们在这里用引号表示“简单”,因为创建这个新的 WordPress 模板比听起来要困难得多!)

我们还尝试不对网站的功能进行太多更改。 这是为了避免使我们的网站重新设计项目变得比需要的更加复杂(而且它已经非常复杂)。

5. 委派网站重新设计的责任

您已经制定了完成网站重新设计所需完成的目标。 现在,你会找到执行这些任务的人

将目标分为两类:

  1. 由您的团队内部处理的目标
  2. 由招聘机构或自由职业者在外部处理的目标

如果您的团队拥有处理某些目标所需的知识和经验,那么将这些目标分配给他们是理所当然的。 特别是,如果某些目标涉及处理机密业务信息,您可能希望将某些目标委托给您的团队而不是第三方。

如果您想让局外人对您的网站重新设计项目有新的视角和专家意见,那么引入第三方专业人士可能是一个不错的选择。 这就是我们为网站重新设计所做的:我们聘请了一家品牌代理机构为我们的网站提供新的设计模板。 另外,我们聘请了一名程序员将这些设计实施到我们的新网站主题中。

如果您打算聘请自由网页设计师和程序员来进行网站重新设计项目,您可以在 Upwork、Fiverr 或 LinkedIn 等平台上发布您的请求。 或者,您也可以在此处找到其他网页设计服务。 您还可以向网络中的人寻求建议。

当您寻求外部帮助时,我们的建议是找到专门从事您所需的特定服务的人员。 程序员通常不是优秀的网页设计师,反之亦然

实现

现在,您将亲自参与实际的网站重新设计工作!

6. 准备重新设计

您的团队和您雇用的外部专业人员将开始执行您之前确定的子目标。 他们的任务可能包括:

  • 创建新的网站设计: Figma 是当今首选的标准界面设计平台
  • 在登台服务器上构建新站点:该服务器为您提供测试环境,以便您在新站点上线之前预览新站点的外观并消除任何错误
  • 测试所有内容以确保它们正常工作:单击每个链接和每个按钮。 检查您的网站在桌面和移动设备上的显示方式。 进行测试在线订单。 测试一切!
  • 备份旧网站:不要跳过此步骤。 如果在启动新设计的网站时出现问题,您将需要之前网站的备份以供参考。 您还应该下载旧网站的离线副本。
  • 如果您要更改 URL,请设置 301 链接重定向:这可以帮助用户继续访问您的页面,而不会遇到令人讨厌的 404 错误。 从 SEO 的角度来看,设置链接重定向还可以帮助搜索引擎对新 URL 进行排名,并将旧 URL 页面积累的“链接汁”归因于新 URL 页面。

当您完成每个子目标时,请将它们从您的列表中划掉! 这样做会让您在倒计时时保持动力:

7. 启动日!

在仔细检查一切是否正常后,启动重新设计的网站。 这可能涉及将新站点从登台服务器迁移到生产服务器(即托管实时网站的服务器)。

即使在庆祝发布时,也要密切关注新网站的性能。 访问者如何与您的网站互动? 他们的用户体验是否与您计划的一样好?

如果您从搜索引擎结果页面获得许多访问者,您也可能会遇到暂时的流量损失。 这是因为当您对网站进行重大更改时,搜索排名下降是正常的。 但是,如果运气好的话,您的排名以及流量数字应该会迅速恢复并变得更好。

8、不断完善网站

新设计的网站上线后,您的网站重新设计项目就完成了。 但工作永远没有完成!

网页设计趋势随着时间的推移而变化,因此您可能需要在几年内再次重新设计您的网站,以使其看起来新鲜和现代。

除此之外,监控您的网站以找出更多潜在的改进领域。 分析工具(例如我们上面提到的那些工具)可以帮助解决此问题。

如果您遇到可以快速轻松修复的问题(例如被忽视的损坏链接),请立即解决它们。 相比之下,其他问题可能需要更多的时间和精力来解决。 即使您选择此时不处理它们,也请将它们记下来。

当您决定下次重新设计网站时要做什么时,它们会很有用!

重新设计网站:最后回顾

以下是在重新设计网站时跟踪待办事项的便捷回顾:

分析

  1. 分析您当前的网站以了解需要更改的内容
  2. 分析您的竞争对手以获得网站改进的灵感

规划

  1. 设定重新设计的目标——实施重新设计的总体目标和可操作的子目标
  2. 检查您网站的技术设置以确定是否需要彻底修改
  3. 委派网站重新设计的责任,以便您的团队知道谁将做什么。 如果需要的话也可以聘请外部专业人士

实现

  1. 通过创建所有必要的设计资产、构建新网站等为重新设计做好准备
  2. 启动重新设计的网站并监控其性能
  3. 当您发现需要改进的新领域时,不断改进您的网站

如果您仍然对等待您的工作感到害怕,我们最后的建议是将您的重新设计项目分解为尽可能多的较小的子目标。 当您努力改造您的网站时,所有这些小进步都会加起来!

如果预算允许,并且您希望专家为您监督整个过程,那么聘请每天处理网站重新设计项目的专业人员也没有什么坏处。

最后,如果您想获得有关网站重新设计项目的反馈,我们很乐意捐出两分钱。 请在下面留下您的评论和问题!