图大明白 | 404错误为什么是Not Found?为什么是404?

“404错误”大家都不陌生吧？

常规来讲

它长这样

或者长这样

艺术一点的

长这样

404 Not Found

意思就是所请求的页面不存在或者已被删除

被称为“互联网最后一个界面”

有很多同学发出疑问：

为什么是404？

不是405 403

或者是996 or 007？

网上流传很多说法，

比较有意思的一种说法是——

404源于一个房间号

404房间

据说在第三次科技革命之前

互联网的形态就是一个大型中央数据库

这个数据库就设置在

404 号房间

那时候所有的请求都是人工手动完成的

如果在数据库中没有找到请求者所需要的文件

或者由于请求者写错了文件编号

用户就会得到一个返回信息

404 Not Found

404错误经常出现在目标页面被更改或者移除

或者客户端输入页面地址错误后显示的界面

后来人们就习惯了

用"404"作为服务器未找到文件的错误代码了

不过404是大家都不愿意看到的

设计师们为让用户们不会因为错误访问对网站失望

在 404 页面上花了不少功夫

一起看看中外网站那些有趣的 404 页面~

国外篇

Twitter 的宕机鲸鱼

这大概是互联网历史上流传最广和最受欢迎的 404 页面之一了。「宕机鲸鱼」的最早是华人设计师为庆祝朋友生日创作的一幅插图。一头鲸鱼被几只小鸟用线拉拽着在天空翱翔，寓意「我的祝福像鲸鱼一样重」。

（图自：硅星人）

而当年只有 200 万用户的 Twitter 买下了这幅画作为自己的宕机页面，虽然早年 Twitter 宕机频繁，但这只「宕机鲸鱼」却深受网友喜爱，在全球引发了无数网友的二次创作。

不少网站的 404 页面也借鉴了这一设计，其中 Google 图书的 404 页面就采用了搁浅鲸鱼的设计。

Facebook

Google

Google 在不同节日的 Logo 设计一直别出心裁，而它的 404 页面也不例外。

大家最熟悉的，可能是这幅手绘风格的机器人。但更有趣的是 Google Chrome 的 404 页面，这是一个操控恐龙躲避障碍物的小游戏。

这个页面由 Google 设计师 Sebastien Gabriel 设计， Chrome 浏览器中众多经典的 404 页面 icon 都出自他手。

吃豆人

同样是把 404 页面做成小游戏，这家公司选择了经典了的街机游戏《吃豆人》（ Pacman）。

皮克斯

皮克斯的 404 页面采用了《头脑特工队》中的「忧忧」在哭泣的画面，并配上「噢…… 别哭。」（Awww…Don’t Cry.）的文字。

IMDB

影评网站 IMDB 则把不同电影中的经典台词用在了自己的 404 页面上。

彭博社

Airbnb

网页找不到的心情，和冰淇淋球掉了有点像？

给「404 not found 」加点特效

下一站，404

这个 404 页面是个地铁站台，每隔一段时间就有一班地铁靠站，画面可以随着鼠标移动，戴上耳机听更有感觉。

让鼠标动起来

404 页面也是一个很好的用户交互界面，这个页面让幽灵的眼睛跟着鼠标动。

同样是让眼睛跟着鼠标动，不过这个页面对密集恐惧症患者有点儿不友好。

由你来设计

（网友作品）

这个 404 页面就是一个布满空白像素点画布，你可以根据自己喜好在上面随意涂鸦。

总有一张动图能表达你的心情

每次打开都有不同的动图。

货不对板的 「404 网页」

这家网站叫「404 page found」，主要为了给那些已经从服务器中删档的旧网页存档，让用户可以浏览那些消失在互联网历史的网页。

国内篇

腾讯、百度和网易的 「404 页面」都是失踪儿童信息，这些 404 页面可以让用户在的 404 页面中嵌入一段简单的代码，通过这个页面传播失踪儿童信息。

淘宝的 404 页面提醒着用户，淘宝属于谁。

京东用了自家的「京东狗」。

网易严选走了冷淡风。

知乎的 404 页面可以说很符合知乎的调性了。

A 站的 404 页面有着浓烈的二次元风格， A 站无法访问的时候相信很多人都看过略带忧伤的 AC 娘。

不过论二次元，B 站家的 22 娘与 33 娘也毫不逊色，还在 404 页面新增了漫画小剧场。

腾讯视频跟 IMDB 类似，用了不同电影中的电影台词，还配上了剧照。

优酷则抖了个机灵。

爱奇艺顺手给你推荐一个视频。

一看就知道是外卖平台的 「404 页面」。

大麦网的「404 页面」大概很容易能触到粉丝的泪点。

虽然超文本结构发明者 Robert Cailliau 认为对于「404 页面」的创意没有必要，但那些创意十足的「404 页面」确实成了互联网中有趣的一角。

ok！

本期的【图大明白】就到这里，

相信你对404也有了一些新的认识~

下一期想让图图为你带来哪些科普，

欢迎大家在评论区告诉图图~

期想让图图为你带来哪些科普，

欢迎大家在评论区告诉图图~

来哪些科普，

欢迎大家在评论区告诉图图~

期想让图图为你带来哪些科普，

欢迎大家在评论区告诉图图~