如何创建一个聪明的 404 错误页面设计?

已发表: 2021-12-23

每个网站管理员都知道,用户在屏幕上看到的最烦人的词是“出错了”,尤其是 404 错误页面。

当用户正在查找在服务器上找不到的特定页面时,会发生 404 错误。 这是您不希望访问者遇到的一种登录页面,但不幸的是,它发生了。 没有任何网站 100% 的时间都是零问题,随着网站的发展,识别每个损坏或过期的链接变得越来越困难。 这就是为什么您需要一种用户友好的方式来确认这个问题。

巧妙的 404 错误页面提供了改善用户体验的绝佳机会。 它可以帮助您展示您的品牌个性,并让您的观众知道您关心他们。 因此,通过在您的 404 页面设计上投入一些时间和精力,您可以确保即使用户可能没有找到他们正在寻找的信息,这也不是坏事。

什么是好的 404 错误页面? 你应该包括什么,你怎么能抓住你的信息? 好吧,让我们向您展示。

404 错误是……

这种类型的错误页面响应标准 HTTP 错误代码,告诉用户他们试图访问的网站或网页在服务器上找不到。

404 是客户端错误,这意味着该人输入了错误的 URL,网页已被移动或删除,或者 URL 未相应更新。

本质上,当出现 404 错误页面时,这意味着出现问题。 这里要记住的重要一点是错误会发生,重要的是你如何处理它们。

404 页面设计的两种主要方法

根据 JustInMind 的说法,错误页面设计有两种主要方法。

  • 裸骨页面。 一个带有简单错误消息的简单页面,通知用户他们请求的页面无法找到。
  • 软页。 一个更具创意和详细的页面,旨在向用户展示即使出现问题,最终一切都会好起来的。

裸骨VS。软页

404 错误页面是一个重要的品牌机会

理想情况下,每个网站管理员都希望他们的用户完全看不到 404 错误页面。 但是,当网站更新时,可能会发生错误,并且某些链接可能不再有效。

即使您可以尽最大努力减少出现 404 错误的次数,但您无法完全消除对它的需求。 因此,最好是主动并创建一个可以将糟糕的用户体验转变为愉快的页面设计。

这将增加用户继续浏览您网站的机会,从而帮助您增强品牌形象,降低营业额并改善您的 SEO。 此外,它还可以让您与访问者建立信任,同时减轻丢失页面的打击。

聪明的 404 错误页面的 6 个关键要素

聪明、经济、简单的 404 页面设计是您应该追求的目标。 您不需要花费数千小时和金钱来制作一个理想情况下没有人应该看到的页面。 然而,你仍然应该付出适当的努力来充分利用它。

以下是您应该包括的六个关键错误页面设计元素(加上一个奖励),以确保您的 404 很好地发挥其作用。

1. 清晰的错误信息

尽管我们的社会具有数字素养,但不要假设每个人都知道 404 错误是什么。 如前所述,这不是用户应该经常看到的页面,因此他们不应该习惯它。

为了帮助用户立即认识到他们已经登陆了 404 页面,请包含明确的错误消息。 以简单、简单和有用的方式让他们知道问题所在。

谨慎选择单词。 不要去找类似机器的“404 错误:找不到页面”消息。 取而代之的是:“对不起! 我们找不到您要查找的页面”或“哎呀! 您要查找的页面已消失。 ” 然后,简单解释一下消息的原因。

提示:即使这不是你的错,也要说对不起。 它将向访客表明您在乎。

2.品牌外观

您的自定义 404 错误页面,即使“隐藏”仍然是您网站的一部分。 因此,它应该包含与您的其他在线媒体相同的视觉和品牌元素。 – 标志、字体、颜色、标题,它应该保持相同的整体独特品牌标识和风格。

3. 指向您网站的功能链接

404 错误页面的主要目的是快速将用户重定向到正确的方向。 因此,为了有效地实现这一点,它必须是功能性的。 这意味着包括以下三个组件:

  • 指向您主页的链接——您不应该忘记的基本元素。
  • 菜单- 帮助导航并保持您的设计一致。
  • 指向您的最佳内容的链接——包括三到四个指向访问者可能会感兴趣的高质量内容的链接。 目标是尽可能避免失去流量,并将访问者指向正确的方向。
  • 搜索字段——这将使访问者有机会搜索他们想到的内容,这将使他们有机会浏览更多内容。

4. 行动号召

如果您将 404 错误页面视为一种登录页面,那么您应该应用相同的逻辑。 这意味着添加号召性用语 (CTA) 以将访问者导航到您网站的其他页面,而不是不离开它。

可能包含的 CTA 包括:

  • 返回”或“转到主页”按钮。
  • 用于输入新关键字的搜索栏。
  • 热门页面或帖子的列表。

这将为您的错误页面增加更多价值,吸引访问者的兴趣并充当引导磁铁。

5.一些轻松的幽默

在通知 404 错误时,总是欢迎有趣的元素,如诙谐的引语、模因或有趣的插图。 它使页面有趣,用户体验不那么令人沮丧。 请注意不要过度使用它。

幽默的错误页面设计将帮助您的访问者微笑,从而使他们在您的网站上停留的时间更长。 更不用说,如果它真的很神奇,用户甚至可能会告诉他们的同行。 提高品牌知名度和保留率的有趣(纽约)方式!

6.简单的设计

巧妙地包含上述所有元素将最终决定您的 404 错误页面的成败。 创建一个充满视觉效果的设计和指向您网站每个可能页面的链接肯定会达到您沮丧的访问者耐心的极限。

少即是多。 最好的设计是那些能够以最简单的方式实现目标的设计。 简约的 404 错误广告将确保此页面更有效地发挥其作用。 此外,它将展示您拥有创建复杂且实用的设计的技能。

[奖金] 7. 特别优惠

利用 404 错误页面的一个额外方法是向访问者展示他们无法拒绝的交易。 例如,通过提供 10% 的折扣,您可以减少潜在用户的失望,鼓励他们返回您的网站,甚至从这种情况中获利。

如果您决定在错误页面上包含特别优惠,请确保以善解人意的方式传达您的慷慨。 例如,您可以添加一条消息,如“对于给您带来的不便,我们深表歉意。 让我们用这个特别优惠来补偿你。”

一些诙谐的 404 页面设计来激发你的灵感

1. Spotify

音乐流媒体平台对其 404 错误页面进行了诙谐和创造性的旋转。 从简单柔和的背景,“返回”按钮,唱机的巧妙设计和“404s and heartbreaks”,是一个精心策划的页面。

Spotify

资源

2.Mailchimp

Mailchimp 的网站是关于品牌和个性的,因此他们的 404 页面并没有让我们失望。 他们清晰的信息和诙谐的品牌插图说明了一切。

邮件黑猩猩

资源

3. 中等

Medium 向我们展示了一个美妙而经典的错误页面,它通过简约的设计、正确的字体和副本以及一个巧妙的信息来安慰用户,让他们只有迷路才能发现新事物,从而提供出色的用户体验。

中等的

资源

4. 爱彼迎

作为一家非常重视品牌个性的公司,Airbnb 的 404 页面非常受欢迎。 使用幽默和闪光,他们知道如何让用户体验不那么令人沮丧。

空中银行

资源

5. 乐高

这是 404 错误页面设计的一个很好的例子,它利用糟糕的用户体验并将其转化为销售机会。 文案清晰,带有轻松的幽默感和强大的 CTA。

乐高

资源

最后的想法

巧妙的 404 错误页面设计是展示您的创造力并鼓励您的用户在您的网站上继续他们的旅程的绝佳机会。 它让人放心,尽管出现了问题,但一切都会好起来的。

出色的 404 页面具有柔和、品牌化和功能性的设计,并带有清晰的错误信息。 为了尽你所能抵消用户的挫败感,你还可以加入一些轻松的幽默,甚至是特别优惠。

您如何看待 404 错误页面设计应该是什么样子? 在下面的评论部分分享您的想法。