如何利用 404 页面？

您是否曾经在任何网站上遇到过 Not Found (404) 错误？ 您知道您有机会转换那些登陆未找到页面的访问者吗？ 本文将帮助您利用 404 页面。

如果您没有设置 Google 分析来跟踪 404 页面。 这是一个为您的网站设置的官方博客。

如果您正确地知道网络在 HTTP 协议上工作。 Web 服务器将为您的每个资源请求返回适当的 HTTP 状态代码。

您可能需要知道四个基本的 HTTP 状态代码，它们是200 – 找到、 301 – 永久移动、 404 – 未找到、 500 – 内部服务器错误。 404 - 未找到和 500 - 内部服务器错误是显示最多的两个状态代码。

404 和 500 之间的唯一区别是 web 服务器将在未找到 404 错误的情况下显示分配的错误页面，而在 500 的情况下不显示服务器生成的输出，因为 web 服务器遇到一些配置错误。

404 可能由于各种原因而发生，例如访问者请求您网站上从未存在的资源，请求您已删除的页面/资源，或请求 URI 中有错误或拼写错误的资源。

在某些情况下，您想要删除那些过时的页面、帖子和媒体资源。 在这种情况下出现 404 错误是一个自然过程。 没有什么问题。

如果您进行一些研究，您会发现大多数网站都有静态 404 页面。 在任何未找到错误的情况下，都会显示相同的页面。 如果设计师有足够的经验，他/她可能会放置一个小的导航到主页链接/按钮。

用你的 404 页面多跑一英里怎么样？ 如果让你的 404 页面有点互动呢？ 让我们探索可能性。

以下是您可以将静态 404 页面转换为更具交互性的四种方法：

1. 404 页面与用户搜索的最相关链接
2. 404 页面，提供您最好的免费优惠
3. 带有链接助手的 404 页面
4. 带有您要推广的链接的 404 页面

01. 404页面与用户搜索的最相关链接：

了解访问者在您的网站上搜索的内容是关键。 为用户提供指向最佳匹配资源的正确链接可能是您可以为访问者提供的最佳用户体验。

可能会出现问题，您如何知道用户在搜索什么，以及如何根据他的搜索建议链接？

嗯，这个解决方案一开始可能看起来很复杂，但开发起来并没有那么复杂。 如果您是开发人员，您会知道您可以提取请求的资源字符串并对您网站上的资源进行正则表达式检查。

例如，您为所有大多数音频制造品牌提供扬声器维修服务。 例如，Bose X1 扬声器就在您的列表中。 但是访问者使用 Bose X10 作为请求资源访问您的站点。 没有名为 Bose X10 的扬声器，所以它自然不会在您的列表中。

404 页面上可能显示的内容是列出您维修的所有 BOSE 扬声器。 如果可能的话，将那些 BOSE X 系列扬声器放在第一位。

这可能是用户导航到正确页面的最佳方式，尽管该页面已登陆 404 页面。 转换该 404 页面的机会非常高。 您帮助他导航到实际页面。

此外，这也将帮助您降低网站的跳出率。 如果您不显示指向最佳匹配页面的建议链接，访问者很有可能会返回或离开您的网站。

02. 404 页面提供您最好的免费优惠：

让我们考虑一下，对于您的网站来说，显示最相关的链接是不太可能的。 或者你不想涉及太多编码的东西。 这可能是开始的最佳选择。

当访问者登陆您网站的 404 页面时，向他们显示一条消息，表示您很抱歉他/她正在寻找的资源不可用。

就在道歉文字向他们展示您网站上运行的最佳报价之后。 这可能就像为您最热门的运行产品提供 5% 或 10% 的折扣，或者免费为他们提供有价值的东西以换取电子邮件。

这可能是让所有访问者与登陆 404 页面的其他产品或产品保持互动的最佳方式！

03. 带链接辅助的404页面：

虽然您始终可以在 404 页面上显示导航。 但是访问者很有可能会转到您的导航面板，确定他想要访问的页面并登陆该页面！ 他们中的大多数人只是离开。

您可以采用这种方式进行 404 页面设计，其中包含指向您网站各种资源的所有重要链接以及明确的 404 错误消息。

这可能有助于用户了解他进入了错误的页面。 它是 404，但他有一个链接列表，其中显示了他可以访问的网站上的所有重要资源。

04. 404页面，带有您要推广的链接：

非常简单，只需在 404 页面上设置您希望访问者访问的链接。 我不建议单独走这条路。 可能是建议 03 和 04 的混合可以工作。

将您真正想要推广的页面的链接保留在 404 页面上肯定会帮助您增加这些页面的访问量。 不利的一面是，您会产生更多不关心的访问，这可能会导致高跳出率。

我在这里提出的唯一建议是，如果沿着这条路走，请至少提供一种免费或非常通用的产品。 这意味着任何人都可以与您提供的产品相关联。 它要么非常实惠，要么免费，可以帮助您改善参与度。

创意 404 页面的流行示例

如果您在为您的网站创建 404 页面时正在寻找一些灵感，这里有一些我个人最喜欢的 404 页面示例。

五福

Wufoo 是互联网上流行的联系表格集成服务之一。 观察页面的整体主题和区别于页面其余部分的绿色按钮！

恐龙代表未找到消息，请查看“创建免费表单”按钮。 它清楚地指示用户按下按钮并对未找到的页面采取一些行动。

他们没有将导航保持在顶部，而是使用 CTA 按钮下的选定导航项。

民宿

从清晰的 404 消息、未找到的插图和小区域下方的导航链接中了解 AirBnB 如何代表所有内容！

在 AirBnB 网站上迷路的用户将登陆此页面，此页面具有所有必要的方向（链接），可将用户送回重要页面并让他参与网站。

邮件黑猩猩

Mailchimp 非常流行的电子邮件营销平台有一个漂亮的 404 页面。 他们将猴子与绿巨人一样的造型应用于似乎迷失在森林中的人。

登陆此 404 的用户会收到带有插图的清晰消息，清晰的消息后跟插图。

最好的部分是他们知道用户已经迷路了，所以他可能会在未找到消息之后立即找到一个搜索栏。 用户可能能够使用搜索来搜索他之前正在寻找的任何资源。

如果搜索不是更喜欢查找或定位资源的东西，它们在搜索栏下方包含一个漂亮的导航！

比特利

Bitly 是最受欢迎的 URL 缩短服务之一，其中包含一些很酷的功能，例如自定义品牌和点击分析。

显然他们有一个漂亮而有意义的 404 页面！ 如果你花几秒钟的时间，你会注意到设计师让海洋保持空旷。 意味着水中没有任何东西，这清楚地说明了没有找到所请求的资源。

标题上没有保留导航面板。 该页面显示错误消息，底部是三个简单且最基本的导航链接。

为了使事情更具交互性，设计团队在鼠标移动事件上制作了波浪效果。 访问页面以体验它。

小锅

Cooklet 空盘子的精美插图清楚地表明您正在寻找的东西并不存在。

哦不！ 连同一个空盘子传达未找到的消息。 有趣的是，他们在未找到消息下提供了 Get Back（javascript 历史记录）操作链接和转到主页链接。

此外，它们使标题与搜索栏保持不变。 这意味着想要导航而不是前一个或主页的用户将能够轻松找到资源。

我测试过这些吗？

上面是我自己网站的404页面的图片。 最初我的 404 页面上没有按钮或链接。 这是一个显示错误消息的普通 404 页面，它！

我添加了一个按钮，以区别于页面的其余元素并激励访问者按下它。 按下它会使用户返回主页。 这个简单的按钮帮助我将访问者带到我网站的主页并让他们参与网站。

我计划在第 1 点中讨论过的页面中添加更多动态内容。

结论

对于任何网站来说，拥有 404 都是很自然的事情。 但是正确利用 404 页面并将这些 404 访问者转化为客户才是真正的聪明。 讨论的技术将帮助您降低跳出率并提高参与度。