奉化网站建设:14个针对网络/移动应用程序的最新和最佳404错误页面设计

2019.07.26 mf_web

184

这里将说明14个最新和最具创意的网页或移动应用程序404错误页面设计,以便您获得灵感并丰富您的界面设计。

一个404错误页面,通常用于提醒网络/应用程序访问者他们试图访问的页面不存在,通常被视为丢失用户/访问者的最可能的元素之一,无聊和枯燥的登录/退出/加载/引导网页/应用中的页面。但是,这并不意味着此类错误页面在所有情况下都将成为一场噩梦。

实际上,一个富有创意,酷炫,有趣或信息丰富的404错误页面不仅可以平稳地引导客户访问您网站/应用程序的其他部分,还可以减少客户的挫折感,让他们更长时间地留在网站/应用程序上。

那么,您如何创建这样一个很酷,有趣和有创意的错误页面来吸引用户的注意力并让他们作为网络/应用程序界面设计师或产品经理留在网站/应用程序中?让我们继续阅读这篇文章,享受14个最新和最好的404错误页面设计,以获得灵感,并学习如何制作一个美丽,有趣和有吸引力的404错误未找到页面设计:

首先,404错误页面中使用的常见错误消息是什么?

在这些日子里,越来越多的设计师意识到文案在他们的网络/应用程序设计中的重要性,并仔细选择每个文本,使他们的设计更人性化,更独特和更清晰。因此,考虑到这一点,在介绍和享受404错误的14个最佳实践之前,我们最好先了解404错误页面中常用的常见错误消息,这样您也可以为错误页面设计独特的创意文案基于这些常见错误消息:

* 在此服务器上找不到请求的URL

* 404文件或目录未找到

*未找到HTTP 404 /找不到404页面

* 404错误/错误404 / HTTP 404

*无法找到该页面

当然,在某些情况下,UI / UX设计师还特别添加一些带有“404”徽标的自定义单词/句子,以使其错误页面更令人印象深刻和有趣。

404找不到页面错误消息

14个最新和最具创意的404错误页面设计的Web /应用程序

1. 迷失在树林里

*设计师:Tajana Barac

*亮点:颜色对比,颜色渐变,形状和阴影

在这个错误页面中,经典的蓝色和白色,颜色渐变和阴影形状的颜色对比,所有这些都给人一种平静和宁静的感觉。这实际上是一种很好的策略,可以有效减少因突然弹出的404错误警告而导致的负面情绪。

此外,其完美的配色方案和插图风格也非常引人注目,可以自然吸引用户的注意力并减少他们在那里的不愉快体验。

*你能学到什么?

使用各种设计趋势优化错误页面设计。

近年来,混合不同的设计趋势,如颜色收缩,颜色渐变,形状,阴影,图层等,帮助设计师创建出色的UI / UX设计永远不会是一个坏主意。因此,您还可以将各种设计趋势结合使用,以优化404错误页面设计。(点击此处查看2018年移动应用程序的前9个UI设计趋势)

迷失在伍兹

2. 通缉

*设计师:来自limpfish.com

*亮点:显示404错误消息的唯一表单

与一些仅以无聊的方式显示错误消息的令人沮丧的错误页面不同,这个404错误页面的设计者采用了一种独特的形式,它非常类似于通缉的海报,直观地解释错误并提供多个选项链接到其他本网站的部分内容。这真的很有创意和有趣。

此外,这个“通缉海报”也有意设计为非常陈旧,甚至破碎,这使它更加真实和引人注目。

*你能学到什么?

自定义404错误页面的特殊表单。

还可以为404页面自定义特殊表单。有足够的时间,您甚至可以创建一系列具有不同表单的404错误页面,并将它们全部添加到您的设计日志中。当然,在有用的原型工具的帮助下,它们也会变成直观的原型,以便您将来可以自由地检查和使用它们。(阅读本文以了解如何为您的设计选择最佳原型设计工具)

通缉

3. Shinobi

*设计师:来自cssninjas.com

*亮点:逐步披露

除了给出404页面未找到错误的一般解释外,该错误页面的设计者采用了一种名为“Progressive Disclosure”的设计技术来扩展页面功能。人们可以轻松点击链接的单词/短语,轻松切换到其他页面。

*你能学到什么?

在页面设计中也使用渐进式披露技术。

在您的错误页面设计中,还采用渐进式披露技术并添加链接,按钮,侧边栏菜单或隐藏菜单栏以扩展404错误页面的功能。

忍者

4. 错误页面Switex

*设计师:Ash Rahal

*亮点:重叠,情感元素和有趣的照片

这个404错误页面的设计者使用文字,照片和阴影的重叠来创造空间感。此外,为了减轻由404错误页面引起的负面情绪,设计师还添加了许多情感元素,例如幽默的解释和显示令人沮丧的男人的有趣照片,以获得用户的理解和共鸣。

*你能学到什么?

添加情感元素以改善您的设计的情感体验。

情感元素,如一些幽默的单词,有趣的表达图标,有趣的照片,更智能和更流畅的交互设计和可让用户冷静等的配色方案,能够使您的错误页面设计更加人性化并让他们留在您的页面更长。

错误页面Switex

5. 404页

*设计师:Alana Brajdic

*亮点:选项和简洁性

正如这个错误页面的设计者写道:“404需要有意义。告诉用户发生了什么,为什么以及他们可以做些什么来解决它“,设计师会显示简单的单词和照片来清楚地解释404错误,并为他们提供各种选项以跳转到本网站的其他部分。这对于为网站访问者提供更好的用户体验也很有用。

当然,这个页面的简单设计风格也符合近年来日益简化的设计趋势。

*你能学到什么?

采用简单的设计风格,具有更多功能选项和更好的用户体验。

错误页面不必复杂。如果您无法完美地平衡网页/应用页面的功能和外观,那么具有更多功能选项和更好的用户体验的简单直观的页面也可以成功。

404页

6. UI 404页面

*设计师:Mario Sestak

*亮点:强烈的视觉效果和完美的图像和内容回声

具有强烈视觉效果的黑色背景照片不仅可以突出显示404错误页面的白色文本,还可以在网站/应用程序访问者进入此页面后迅速吸引他们的注意。

此外,图像和内容的完美回声也使其文本更具说服力和有效性,以减少用户的负面情绪。

此外,带有额外链接的侧边栏,如“帮助”,“关于”和更多选项,也有效地增强了用户体验。

*你能学到什么?

还可以使用强大的视觉效果来改善您的错误页面设计。

您可以采用许多视觉效果来创建出色的404错误页面,例如高质量的照片,正确的配色方案,创意主题等。

*还可以使用侧边栏来扩展页面功能并改善用户体验。

UI 404页面

7. 404页Hossein

*设计师:Hossein Mahmoodi

*亮点:电影海报风格和科幻主题

此错误页面设计功能适用于电影海报风格和选择科幻主题。“404”字样被完美地设计到“科幻电影海报”中,这可以使网站/应用程序访问者自然陷入遐想。这真的很有创意和有趣。

*你能学到什么?

同时为页面设计选择合适的主题。

404错误页面的正确主题可以使您的工作增加两倍,并使其更具吸引力。因此,您还可以为页面设计选择正确的主题,例如上面提到的电影,动画,卡通,节日和不同的文化等。

404页Hossein

8. 找不到404页面

*设计师:Nayab Fatima

*亮点:生动的动画和可爱的插画风格

404错误页面设计中最独特的部分是两只动画猫头鹰,它们不断地眨着大而干净的眼睛,让人感到平和和舒适。此外,可爱的插画风格和白色空间也使页面更加美丽和梦幻。当你进入这个页面时,它就像落入了设计师精心设计的童话世界。这也是缓解网站访问者挫败感的有效方法。

*你能学到什么?

还要在404错误页面中添加一些动画/交互。

插图风格也使您的设计更加美观。

404页面不存在

9. 每日用户界面 - 404页

*设计师:Carlos Pariente

*亮点:幽默动画和电影相关元素

看到这个错误页面时忍不住笑出来了?好!无论是否符合一些常用的界面设计原则,它至少在吸引用户注意力和创造更愉快的用户体验方面非常成功,对吧?此外,这个错误页面中有着名电影相关人物的幽默动画不仅与其显示的404错误信息完美匹配,而且对于非常喜欢电影的人来说也很有吸引力。

*你能学到什么?

还可以为您的设计添加众所周知或时尚的元素。

还可以为您的设计添加幽默或有趣的元素。

每日UI 404页面

10. 每日UI挑战 - 404页

*设计师:Andrea Hock

*亮点:结合网络/应用程序的功能很好的镜头

除了添加相关动画和高质量照片以改善您的错误页面设计外,您还可以轻松组合目标网站,应用和推广产品的功能。例如,这个404错误页面很好地结合了其推广产品的功能,并被用作展示各种珠宝首饰的另一个好平台。通过这种方式,即使人们在浏览不同的珠宝时突然被这个错误信息打断,他们也可以继续预览他们喜欢的珠宝。这确实是降低页面跳出率的好方法。

*你能学到什么?

还结合了Web / app的功能来丰富错误页面内容。

每日UI挑战404

11. 每日UI-8 404错误页面

*设计师:Deanna Lam

*亮点:风景优美的照片

在404错误页面设计中,添加生活或美丽的风景图像真的是一个好主意,让用户感觉更放松和舒适。

*你能学到什么?

还可以在404错误页面中添加舒适的生活或风景照片。

每日UI 8 404错误页面

12. 冬宫朋友的404页

*设计师:Anton Borzenkov

* 亮点:有趣的油画风格和周到的搜索框

本页设计师采用独特而有趣的油画风格吸引网站访客。此外,为了创造更愉快和更流畅的用户体验,设计师还在404错误消息后面添加了一个搜索框,以便每个用户在遇到404错误问题后可以尽快自由搜索并跳转到他们喜欢的链接/页面。

*你能学到什么?

还采用独特的油画或中国水墨画风格。

404冬宫之友

13. 大卫404页

*设计师:David Kovalev

*亮点:3D技术

该页面的设计者使用先进的3D技术来显示404错误,这非常有趣且直观。

*你能学到什么?

还可以使用先进的技术来改进您的设计。

在这些日子里,还有许多可用于错误页面设计的高级技术,例如视频/音频媒体,3D技术等。

大卫404页

14. Shremal 404

*设计师:Shremal

*亮点:使用错误页面讲述故事

这个错误页面的设计者使用形状,颜色,阴影,文本和所有其他元素来讲述一个故事:“你的搜索页面不能在地球上建立”或“页面将你带到另一个星球”。这真是令人印象深刻和有趣。

*你能学到什么?

用你的想象力在你的页面设计中讲述一个故事。

Shremal 404

总的来说,希望您可以轻松获得这些最新的404错误页面设计灵感,并学习一些有用的改进页面设计的东西。

结论

将这样的404错误页面作为您的网站/应用程序的噩梦进行比较,您最好将其作为一个很好的机会,为用户提供更好的指导,让他们受理并让他们在这个网站/网站上停留更长时间。此外,酷/搞笑/有趣/创意404错误页面也可以使整个网站/应用程序更具吸引力,出色和独特。总的来说,希望这14个最新和最好的404错误页面设计无论如何都会帮助你。

寒枫总监

来电咨询

18868949445

微信咨询

寒枫总监

TOP