“404錯誤”傳說是假的,但你一定猜不到哪家網站的404頁面最好玩

關於「 404 錯誤」的起源,互聯網上一直流傳著一個傳說。

在歐洲核研究組織的 404 號房間內,存放著互聯網第一臺服務器,萬維網的發明者 Berners-Lee 就在這裡辦公。如果你要訪問網頁,必須向這個房間提交申請,如果找不到這個網頁就會提示你「404 not found 」。

當人們讓 Berners-Lee 就 「 404 錯誤」發表意見時, Berners-Lee 以這是無關緊要的瑣事為由拒絕置評,讓這段傳說更加撲朔迷離。

而開創了超文本結構的另一位互聯網發明者 Robert Cailliau,在最近接受《連線》雜誌採訪時再次否認了這則傳說的真實性,並解釋了 「 404 錯誤」的真正來源:

「 404 錯誤」就是程序員為了讓用戶在網絡連接錯誤時,可以知道自己錯在哪而設置的。

“404錯誤”傳說是假的,但你一定猜不到哪家網站的404頁面最好玩

(你對這個頁面也許不陌生)

這樣的說法讓「 404 錯誤」的傳奇色彩蕩然無存,可能會讓很多人失望吧。

不過自從互聯網誕生以來,設計師們為了讓你不會因為錯誤訪問而對網站失望,在 404 頁面上花了不少功夫,而 404 頁面的變化也是互聯網交互形式發展的一個剪影。

下面愛範兒帶你來看看中外網站那些有趣的 404 頁面。

國外篇

Twitter 的宕機鯨魚

“404錯誤”傳說是假的,但你一定猜不到哪家網站的404頁面最好玩

這大概是互聯網歷史上流傳最廣和最受歡迎的 404 頁面之一了。

「宕機鯨魚」的最早是華人設計師為慶祝朋友生日創作的一幅插圖。一頭鯨魚被幾隻小鳥用線拉拽著在天空翱翔,寓意「我的祝福像鯨魚一樣重」。

“404錯誤”傳說是假的,但你一定猜不到哪家網站的404頁面最好玩

(圖自:硅星人)

而當年只有 200 萬用戶的 Twitter 買下了這幅畫作為自己的宕機頁面,雖然早年 Twitter 宕機頻繁,但這隻「宕機鯨魚」卻深受網友喜愛,在全球引發了無數網友的二次創作。

“404錯誤”傳說是假的,但你一定猜不到哪家網站的404頁面最好玩

不少網站的 404 頁面也借鑑了這一設計,其中 Google 圖書的 404 頁面就採用了擱淺鯨魚的設計。

Facebook

“404錯誤”傳說是假的,但你一定猜不到哪家網站的404頁面最好玩

相比起 Twitter,流量更大的 Facebook 的 404 頁面似乎沒這麼走心,這個設計來源於自家的「點贊」圖標。

Google

Google 在不同節日的 Logo 設計一直別出心裁,而它的 404 頁面也不例外。

“404錯誤”傳說是假的,但你一定猜不到哪家網站的404頁面最好玩

你最熟悉的,可能就是這幅手繪風格的機器人。

但更有趣的是 Google Chrome 的 404 頁面,這是一個操控恐龍躲避障礙物的小遊戲。


這個頁面由 Google 設計師 Sebastien Gabriel 設計, Chrome 瀏覽器中眾多經典的 404 頁面 icon 都出自他手。

“404錯誤”傳說是假的,但你一定猜不到哪家網站的404頁面最好玩

吃豆人

“404錯誤”傳說是假的,但你一定猜不到哪家網站的404頁面最好玩

同樣是把 404 頁面做成小遊戲,這家公司選擇了經典了的街機遊戲《吃豆人》( Pacman) 。

皮克斯

“404錯誤”傳說是假的,但你一定猜不到哪家網站的404頁面最好玩

皮克斯的 404 頁面採用了《頭腦特工隊》中的「憂憂」在哭泣的畫面,並配上「噢……別哭。」(Awww…Don’t Cry.)的文字。

IMDB

“404錯誤”傳說是假的,但你一定猜不到哪家網站的404頁面最好玩

影評網站 IMDB 則把不同電影中的經典臺詞用在了自己的 404 頁面上。

彭博社


Bloomberg 的 404 頁面一段無厘頭的動畫,一個西裝男拍散一部屏幕顯示 404 的電腦,然後自己原地粉碎……

Airbnb


網頁找不到的心情,和冰淇淋球掉了有點像?

MiKandi

MiKandi 是世界上第一個 Android 成人應用商店,它的 404 頁面是一個金髮裸體女郎在說「自己的衣服不見了」。

最憂鬱的 404 頁面


這是伊利諾伊州香檳分校計算機機械協會網站的 404 頁面,頁面中會陸續打下一段段文字,告訴你對於它找不到頁面十分沮喪,甚至想「爬進垃圾桶分解自己」。

“404錯誤”傳說是假的,但你一定猜不到哪家網站的404頁面最好玩

這一大段話都喪得不行,口吻跟《銀河系漫遊指南》那個換上抑鬱症的機器人 Marvin 很像。

給「404 not found 」加點特效


下一站,404


這個 404 頁面是個地鐵站臺,每隔一段時間就有一班地鐵靠站,畫面可以隨著鼠標移動,戴上耳機聽更有感覺。

讓鼠標動起來


404 頁面也是一個很好的用戶交互界面,這個頁面讓幽靈的眼睛跟著鼠標動。


同樣是讓眼睛跟著鼠標動,這個頁面對密集恐懼症患者就很不友好。

由你來設計

“404錯誤”傳說是假的,但你一定猜不到哪家網站的404頁面最好玩

(網友作品)

這個 404 頁面就是一個佈滿空白像素點畫布,你可以根據自己喜好在上面隨意塗鴉。

“404錯誤”傳說是假的,但你一定猜不到哪家網站的404頁面最好玩

(圖: Reddit Place 界面)

這有點像今年愚人節 Reddit 發起的一個活動,讓全球網友在一塊空白的巨大畫布著色。

總有一張動圖能表達你的心情


每次打開都有不同的動圖,看著都疼。


同樣是不斷變換的動圖,風格更加多變。

貨不對板的 「404 網頁」

“404錯誤”傳說是假的,但你一定猜不到哪家網站的404頁面最好玩

這家網站叫「404 page found」,主要為了給那些已經從服務器中刪檔的舊網頁存檔,讓用戶可以瀏覽那些消失在互聯網歷史的網頁。

“404錯誤”傳說是假的,但你一定猜不到哪家網站的404頁面最好玩

(一個麥當勞最想屏蔽的網站)

在這裡可以找到 1993 年到 2009 年間的不同網站的歷史版本,是個小型的互聯網歷史博物館。

國內篇

在中國,「404」是個舶來品。在中國的互聯網語境, 「 404 錯誤」有了更多含義,它可以是網頁不存在,可以是內容不符合法規,也可以是發佈者主動刪除了內容。正如《連線》雜誌那篇文章所說:

「 404 錯誤」提醒著人們,網絡技術,由人類創造,受人類控制,並非完全可靠。

下面來看看國內互聯網的公司的各種「404 頁面」。

騰訊、百度和網易的 「404 頁面」都是失蹤兒童信息,這些 404 頁面可以讓用戶在的 404 頁面中嵌入一段簡單的代碼,通過這個頁面傳播失蹤兒童信息,體現了一家企業對公益事業的態度。

“404錯誤”傳說是假的,但你一定猜不到哪家網站的404頁面最好玩

“404錯誤”傳說是假的,但你一定猜不到哪家網站的404頁面最好玩


“404錯誤”傳說是假的,但你一定猜不到哪家網站的404頁面最好玩

淘寶的 404 頁面提醒著用戶,淘寶是姓馬的,馬雲的馬。

“404錯誤”傳說是假的,但你一定猜不到哪家網站的404頁面最好玩

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

網易嚴選走了性冷淡風。

“404錯誤”傳說是假的,但你一定猜不到哪家網站的404頁面最好玩

新浪和新浪微博放在一起,對待 404 頁面 ,感覺還是新浪微博的產品經理更上心。

“404錯誤”傳說是假的,但你一定猜不到哪家網站的404頁面最好玩

“404錯誤”傳說是假的,但你一定猜不到哪家網站的404頁面最好玩

知乎的 404 頁面可以說很符合知乎的調性了。

“404錯誤”傳說是假的,但你一定猜不到哪家網站的404頁面最好玩

A 站的 404 頁面有著濃烈的二次元風格,前段時間 A 站無法訪問的幾天相信很多人都看過略帶憂傷的 AC 娘。

“404錯誤”傳說是假的,但你一定猜不到哪家網站的404頁面最好玩

論二次元,B 站家的 22 娘與 33 娘也毫不遜色。

“404錯誤”傳說是假的,但你一定猜不到哪家網站的404頁面最好玩

騰訊視頻跟 IMDB 類似,用了不同電影中的電影臺詞,還配上了劇照。

“404錯誤”傳說是假的,但你一定猜不到哪家網站的404頁面最好玩

優酷則抖了個機靈。

“404錯誤”傳說是假的,但你一定猜不到哪家網站的404頁面最好玩

愛奇藝順手給你推薦一個視頻。

“404錯誤”傳說是假的,但你一定猜不到哪家網站的404頁面最好玩

一看就知道是外賣平臺的 「404 頁面」,這是餓了麼的。

“404錯誤”傳說是假的,但你一定猜不到哪家網站的404頁面最好玩

美團的風格則和 AB 站有點像。

“404錯誤”傳說是假的,但你一定猜不到哪家網站的404頁面最好玩

大麥網的「404 頁面」大概很容易能觸到粉絲的淚點。

“404錯誤”傳說是假的,但你一定猜不到哪家網站的404頁面最好玩

“404錯誤”傳說是假的,但你一定猜不到哪家網站的404頁面最好玩

“404錯誤”傳說是假的,但你一定猜不到哪家網站的404頁面最好玩

「404 頁面」是互聯網中的一個錯誤,被稱為「互聯網的最後一頁」。它的存在除了提醒人們訪問的頁面不存在,也悄悄成為了各個企業品牌宣傳的廣告位。

雖然超文本結構發明者 Robert Cailliau 認為對於「404 頁面」的創意毫無必要,但那些創意十足的「404 頁面」確實成了互聯網中有趣的一角。

“404錯誤”傳說是假的,但你一定猜不到哪家網站的404頁面最好玩

對於產品經理和設計師來說,「404 頁面」也是 UI 設計中不可忽略的一部分,Google 設計師 Sebastien Gabriel 曾表示:

設計錯誤提示 icon 是一件有意思的事情,你希望用戶最好永遠不要看到它們,而一旦他們看到了,你就要避免他們產生更多掃興的感覺。

至於該如何設計「404 頁面」,負責騰訊產品視覺和交互設計的 CDC 團隊認為體驗良好的 「404 頁面」應該遵循以下幾個原則:

提供簡明的問題描述,用輕鬆的話語消除訪客的挫敗感,使得訪客轉到某個地方而不是後退。提供合理的解決方案,輔助訪客完成訪問目標。提供個性化的友好界面,提升訪問體驗。

話雖如此,但願你的互聯網歷程中不會遇到太多的 404。


分享到:


相關文章: