出错的艺术:如何设计过目不忘的404页面

本文作者杰里·曹(Jerry Cao)是UXPin的用户体验内容策略师。

出错的艺术:如何设计404页面

氧分子网讯 许多时候,404出错页面会令人感觉厌烦。但有趣的是,在一些情况下,这些页面可以给用户带来乐趣,使用户不再介意页面本身的问题。

出现这种差异并不是偶然。你的404页面应当与其他网页有着同样的风格和设计。这一点很重要,因为404页面的弹出已经给用户体验带来了干扰。不过,如果能加以适当的处理,你可以扭转这种不利局面,给用户带来意外惊喜。

情绪连接的力量

网站的功能、可用性和服务很重要,但用户与网站之间的情绪连接最能影响他们对网站的评价。对于许多日常决定,人类的决策机制通常是“跟着感觉走”,而用户与网站的互动也是如此。换句话说,用户对网站的感觉比他们对网站的看法更重要。

出错的艺术:如何设计404页面

因此,在试图访问某一网页时看到404出错页面给人的感觉很不好。这种出错有可能拖累整体体验,而如果网站还存在其他小缺陷,那么404页面将会是毁灭性的。因此,网站开发者必须非常谨慎地对待404页面。

不过从好的一面来看,404页面也带来了逗乐的机会。网站没有按正常机制工作,但你也可以借此机会给用户带来惊喜,因为用户通常不会想到404页面会带来有趣的消息。以下是我们欣赏的几个404页面设计,以及为何这些页面使我们更喜欢相应的网站。

搞笑

创造情绪连接的最古老方式之一在于搞笑,搞笑将使用户很难形成不满的情绪。

出错的艺术:如何设计404页面

Magnet的404页面正是如此。页面上的维恩图令人觉得好笑,这很清楚地创造了情绪链接。

出错的艺术:如何设计404页面

一些404页面则参考了流行文化,因为如果你自身无法搞笑,那么可以借鉴能搞笑的人。来自Worrydream的404页面很经典。请注意,“404”的字样以烟斗烟雾的形式出现。

漂亮的视觉效果

如果无法令用户感到有趣,那么请尝试利用你的艺术天分去吸引他们。这样的404页面看起来很酷,在很多情况下能改变用户的观感。

出错的艺术:如何设计404页面

忍者的形象是大众明星,而Huwshimi的404页面利用了这样的形象。框架设计、绘制技巧和配色使这一页面看起来就像是艺术作品,而我们并不介意看到这一页面。

出错的艺术:如何设计404页面

类似地,来自Audiko的404页面也很有意思。这一页面会让人忘却最初打开页面是为了寻找什么信息。尽管不像Huwshimi的页面一样精致,但这幅图片更容易吸引用户的注意力。

互动功能

既不是很有趣,也没有精美的艺术感?那么可以试试利用游戏。

出错的艺术:如何设计404页面

来自Blue Fountain Media的404页面非常聪明地利用了吃豆人游戏。有时,你可能会故意访问这一404页面,以消磨时间。

出错的艺术:如何设计404页面

另一个可以用于打发时间的404页面来自Hot Dot。用户可以点击页面上的点,观看这些点的运动。这一互动功能比你想象中可能更有趣,而用户很可能会长时间注视这一页面,忘了他们最初打开页面的意图。

出错的艺术:如何设计404页面

并非所有具备互动功能的404页面都令人上瘾。GitHub的404页面很简单,不会占用你很多时间,但这一页面同样能带来乐趣。这一页面的互动功能不是很强大(前景上的对象会随着鼠标而移动),但可爱的动画会吸引用户。

出错的艺术:如何设计404页面

创造情绪连接并不一定需要走可爱路线。Hakim El Hattab的404页面上有着令人毛骨悚然的眼球,会随着你的鼠标而转动,并有节奏地眨眼。页面下方的文字会提示,在几秒钟之后,网站将自动跳转至主页。

以巧妙的方式去宣传品牌

一些情况下,只要引入一两个其他元素,404页面也会是推广品牌的良机。马斯洛的“情感需求层次理论”可以作为参考。你需要确保,你的品牌能对页面的功能和个性化实现良好的补充。

出错的艺术:如何设计404页面

例如,乐高的404页面采用了具有幽默感、有趣的视觉效果,但也使用了该品牌标志性的形象。这一形象很简单、很可爱,能够提高品牌认知度。仅仅看着这一页面就可以给你带来一些回忆。可以发现,他们给前景角色选择了红色配色,从而更好地表达出错的信号。

出错的艺术:如何设计404页面

类似地,来自eHarmony的404页面集成了有趣的视觉画面,同时推广了该网站关于“爱”的主题。对交友网站来说,开玩笑可能并不是很合适,但这一页面做得很好。他们还将页面出错转化成了与用户展开对话的机会,推动用户注册服务。

赢家

出错的艺术:如何设计404页面

我们认为,Nouveller的404页面具备了以上所有元素。这一页面最开始是电影《侏罗纪公园》中央公园控制台的DOS输入窗口,但在几次尝试(交互元素)后,你会看到丹尼斯·纳德利(Dennis Nadry)在电影中的台词(流行文化和幽默感)。此外,这一页面也会令你感到惊讶。

当然,这样的消息并未失控,因为你可以通过“重启并重试”选项返回至主页。这一404页面拥有所有必要元素:乐趣、互动性,以及帮助用户返回至正确页面的基本功能。

实用的建议

让你的404页面有趣只解决了问题的一部分,你还需要记住其他原则。最后,让我们来回顾一些通用的小技巧:

– 链接至热门文章。如果用户并不知道下一步要怎么做,那么这是一个不错的方式。在用户愿意接受建议的情况下,推荐你最好的内容。

– 集成搜索栏。与上一条建议类似,集成搜索栏将帮助用户继续浏览,而不会受到太大的干扰。

– 提供选项,帮助用户报告损坏的链接。推动用户参与将使网站变得更好,同时也将给用户带来满足感。你至少可以向他们提供技术支持邮件的地址,让他们发出自己的声音。

– 像普通人一样解释状况。告诉用户,究竟是什么出现了错误(用门外汉的语言),并将404页面当作信息门户。如果设计能够实现,那么你甚至可以同时集成搜索栏和推荐内容链接。请不要用技术语言来说明这样的问题。

总而言之,对于404页面,你应当给予与其他页面同样多,甚至更多的关注。通过适当的设计,你可以获得意料之外的粉丝,这样的人群会在社交媒体上分享聪明的设计。

您可能还喜欢…

发表评论

邮箱地址不会被公开。 必填项已用*标注

您可以使用这些HTML标签和属性: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>