首页

源码搜藏网

首页 > 开发教程 > Web前端 >

30个出色的404错误页面设计

创建时间:2016-02-17 14:38  

点击了损坏的链接是一种痛苦,而是一种机智和精心设计的错误页面至少熏香了避孕药。这里有一些设计来激励你。

如果你在工作如何启动一个博客网站,不要忘了所有重要的404页-在HTTP,告诉用户一个标准的响应代码,实际上,他们已经点击了损坏的链接。

它历来是无奈的一个巨大来源,但近年来,广告已经采取了设计,至少甜头找到你在错误的地方是的药丸定制404页面的挑战。

当做得非常好,他们成为小大使网站本身,在Twitter和博客被共享的网站或服务对客户服务和设计独特的方法敏锐的一个例子。我们在座的30个已经实现这一切多,所以来看看,并得到启发,创建自己的定制404页!

01. Bluegg

30个出色的404错误页面设计
这嘈杂的第一章规定,你在错误的地方是一个热闹的通知

404页的创意和数字设计机构简单,但很有效。加载后,你被一只山羊,谁可以让出最全能的高亢的尖叫声,提醒你该页面不存在迎接。在我们内部出现了孩子,我们必须承认反复玩这个,一会儿哭一点点笑声。布拉沃,家伙。

02. Hot Dot Production

30个出色的404错误页面设计
热狗的404页是严重上瘾

热卖点制作团队已经应用于它的'在哪里设计满足技术“的口号,以令人印象深刻的404页,其特点由数百个,在响应鼠标移动改变方向的小点的三个数字。认真冷静。

03. Airbnb

30个出色的404错误页面设计
如果你在地板上滴的冰淇淋,清理,对不对?

从沙发冲浪巨头制作的Airbnb这404页的功能,它包含有关冰淇淋和删除你的冰淇淋的inadvisability为我们所有的经验教训令人愉快的动画。这也让我想起故事,记者对谁租出去家园的Airbnb住宿,只回来到灾区人民。你看,如果你在地板上滴的冰淇淋,清理,对不对?

04. Lego

30个出色的404错误页面设计
乐高不会有错在我们的眼前 - 我们喜欢它的网站的404页面,这个可爱的小画面

一般情况下,乐高不会有错在我们眼前,我们都很喜欢它的网站的404错误页面,这证明你不需要很多技术冠冕堂皇的文字来阐述你的错误消息,这个可爱的小画面。

05. MAGNT

30个出色的404错误页面设计
MAGNT的聪明之处404页演示机智既敏锐,并明确呼吁采取行动

MAGNT使您能够在几分钟内创建一个名片为主题的网页。其巧妙的404页演示机智既敏锐,并明确呼吁采取行动,带你到你需要的人。

06. GitHub

30个出色的404错误页面设计
什么更好的方式来吸引怪才比视差效果的简单星球大战模仿秀

编码的网站GitHub上是极客们的家,有什么更好的办法来吸引怪才比当您移动鼠标的视差效果的简单星球大战模仿?GitHub上也有一个漂亮的500页服务器中断时。

07. Blue Fountain Media

30个出色的404错误页面设计
要玩双打,伙计?

这是很难克服来面对一个404页的必然失望,但是蓝泉媒体有东西,可能只是你开心的吃豆人的游戏形式在404形迷宫发挥出来。我们会说实话,404外形不工作那么好(尽管它没有比谷歌的吃豆人涂鸦更糟糕),但它并没有从给这个彻底的研发阻止我们。

08. CSS Ninjas

30个出色的404错误页面设计
CSS忍者忍者是的网页设计世界的爱的另一个例子

忍者的网页设计世界的爱的另一个例子,这404页的功能一个不错的简单的例子,反映了网站的设计一般方法。

09. Daniel Karcher Film Design Studios

30个出色的404错误页面设计
这404页采用了呈现精美的地铁站完成,在推出空列车

这个网站使优秀的使用动画,包括声音,它的404页,采用了一种呈现精美的地铁站完成,在推出空列车。与这里的许多例子,页面从网站的整体美观有很大的影响发散。

10. MailChimp

30个出色的404错误页面设计
不要让猴子生气...

在超时尚的电子邮件通讯服务MailChimp设计师已经演变该公司的著名的猴子变成绿巨人型性格,完整的动画烟雾,来表示断开的链接。404页的风格适合网站设计的其余部分很好,反映了同样的轻松方式,让原本枯燥的任务分解成一些有趣和可爱。

11. Hakim El Hattab

30个出色的404错误页面设计
这些令人毛骨悚然的眼睛跟随你的光标页面各处

404页专为.NET杂志,这次Hakin厄尔尼诺Hattab,这HTML5实验功能令人毛骨悚然的眼睛下面的页面在你的光标闪烁偶尔和光圈变窄。出色的执行,并很好地互动。

12. Tin Sanity

30个出色的404错误页面设计
这种舞蹈杯和秸秆尖叫它的方式在页面中的文本

锡理智设有一个令人难以置信的动画,涉及舞蹈杯,吸管,尖叫它的方式在页面中的文本:“你刚刚404'd”。尖叫是加剧了击鼓声和质朴的低音配乐,所有这些都留下一个极好的印象(虽然网站本身目前是空的)。

13. Audiko

30个出色的404错误页面设计
这404页是值得只是艺术品的访问!

免费的铃声决策服务的404页的功能伦敦的呈现精美的插图,包括强制性的红色巴士和电话亭,以及大笨钟的塔,福尔摩斯和塔桥的暗示。该网站的价值只是艺术品的访问!

14. Bret Victor

30个出色的404错误页面设计
这不是一个页面。这东西的照片,这不是一个网页。或者是什么?

布雷维克多的404页,由马格里特标志性的绘画,“形象的叛逆”,灵感当然面临与一些具有挑战性的哲学问题的观众。如果这不是一个网页,又是什么呢?什么是“页面”?是不是可以说真正存在的事情呢?什么是“本”,这显然非页面是指?什么是真正的真实?让你觉得,不是吗?

15 Home Star Runner

30个出色的404错误页面设计
这404页的功能有趣的人物,下载并呼喊“404'd”你

当网页上的视觉效果相结合的音频可以非常有效的,特别是我们仍然在可靠的音频在一个页面初期。此错误页面首页少年阿虎,设有有趣的人物,下载和游戏,呼喊“404'd”你当你第一次在页面上到达。和手绘插图适合网站的其余部分以及在风格和主题方面。

16. Duoh!

30个出色的404错误页面设计
Duoh!采用明亮的色彩和负空间在其404

Duoh是插画之间的合作伙伴关系Veerle Pieters的和合作伙伴吉尔特Leyseele。他们的业务是基于强大的设计原则,所以你会期望一个良好的实现404页,他们没有让人失望。在特色鲜明的色彩和负空间,这个页面看上去并与网站的其余部分保持感觉。

17. Bit.ly

30个出色的404错误页面设计
Bit.ly的可爱生物响应鼠标的移动

链接缩短服务Bit.ly需要一个特殊的URL为它的404页作为bit.ly.com/404已经被用作缩短链接!网页本身设有一个可爱的小动物在回应你的鼠标移动的交互式海上下摆动。

18. ApartmentHomeLiving

30个出色的404错误页面设计
这404页的功能一个奇怪的室内拍摄与衰落羊坐在厕所

这又让代理网站的404页,配有奇怪的室内拍摄与衰落羊坐在方便。创意,并在同一时间古怪,它是如何做到这一点也很大(如果抽象)的例子。

19. DropBox

30个出色的404错误页面设计
投递箱有一个非常简单而有效的404页为特色的埃舍尔式的不可能箱

投递箱有一个非常简单而有效的404页为特色的埃舍尔式的不可能的盒子。您可以按面值借此,或者把它看作标志着已经浏览到一个不存在的页面内而外的性质。一个漂亮的简单的手绘插图横跨得到消息很好。

20. Wufoo

30个出色的404错误页面设计
Wufoo项目上的404页是使用品牌有效传达的信息简单的静态的事

建筑形式工具Wufoo项目上的404页是使用品牌有效传达的信息简单的静态的事情。干净的方法来处理错误的一个很好的例子。

21. Mike Kus

30个出色的404错误页面设计
迈克·库什的404页,采用了经典的太空侵略者为主题对他的404页

领先的设计和插画师麦克库什的404页,采用了经典的太空侵略者为他的404页的一个主题。他曾通过了错误页面同样复古电视与静态的GIF动画设置为背景图片。

22. eHarmony

30个出色的404错误页面设计
是eHarmony的404提示你应该只得到贴满了?

你想,当你寻找爱情找到的最后一件事是,它不能被发现,但eHarmony的404页软化与这个可爱的形象和你注册了它的约会服务的建议打击。或者,也许这暗示你应该只得到贴满了?这为我们工作了。

23 Dailymotion Cloud

30个出色的404错误页面设计

这种互动式的404页就用动画雨和云站点的名称一个很好的发挥。效果是简单而有效的,并且是被用作视觉隐喻的标志的更好的例子之一。

24. Walk with You

30个出色的404错误页面设计

一个网站推广生活教练这个简单的说明性设计采用从整体网站设计现有的资产,包括瀑布,传达404消息。大胆的排版使得这一页工作做好。

25. LimpFish

30个出色的404错误页面设计

一个报纸隐喻的最好的例子,戴夫·巴顿的个人网站管理注入一点幽默到其错误消息。

26. Starbucks

30个出色的404错误页面设计

星巴克,像亨氏,很好地利用了它的初级产品来说明404的消息。在这种情况下丢失的咖啡杯该告诉故事标志是用来讲述故事。

27. Huwshimi

30个出色的404错误页面设计

一些最好的404页面是不是交互式可言; 他们只是有美丽的插图充当当你在一个死链接到达一个惊喜。从悉尼的界面设计师Huwshimi这个例子提供了一个简单而有效的草图讲述了一个故事,而输送404消息。

28. Blizzard Entertainment

30个出色的404错误页面设计

视频游戏开发商暴雪需要用原始的方法它的404页,适合于公司的一般风格,采用碎玻璃作为断开链接的隐喻。是什么让这个例子中脱颖而出是玻璃下面的干净的设计美感。

29. NPR

30个出色的404错误页面设计

美国全国公共广播电台网站的404页面显示失踪的人或事物,从埃尔哈特到你的行李一个有趣的维基式的列表。

30. CSS-Tricks

30个出色的404错误页面设计

高超的技巧,教程和建议博客CSS-技巧是所有在网络设计界,因为尽管其干题材的喜爱,它管理excude热情,幽默和个性。而这个厚颜无耻的404页面就是一个很好的典范。

你见过404页的很好的例子?让我们知道在下面的评论!

上一篇:如何简化管理多个WordPress网站
下一篇:窗口调整大小和移动

相关内容

热门推荐