404 頁面：為網路上的旅人準備的小驚喜

一般我們看到的畫面會是類似以下的狀況：

看起來很眼熟對吧？有時候光是看到這個畫面就會想嘆嘆氣呢。由於404可以說是最常見的一種HTTP狀態碼，因此許多網站都會特地為這個404的畫面做客製化，讓瀏覽者即使從錯誤的連結來訪你的網站，也不會有「連結是壞的，可能這個網站不存在了」或是「網站可能消失了，不再經營了」的感覺而直接 關閉網頁、無形中失去了原本可能來拜訪的瀏覽者。

而一個詼諧有趣的404畫面不僅能讓瀏覽者知道自己來對了地方，要是夠有趣的話，還會讓人會心一笑呢！讓我們來看看各大公司網站為我們這些可能迷路的旅人準備的小驚喜吧

Google的404網頁，相信有不少人看過了，簡單的手繪插畫讓人覺得輕鬆又可愛

www.google.com/404

Dribbble的404網頁，"dribble"在籃球中是指運球的意思（Dribbble的Logo本身就是一顆洋紅色的籃球！），而在dribbble上的404網頁就是一個Air Ball囉。

dribbble.com/404

GitHub的404網頁相當精緻，相信星戰迷一定對這個場景不陌生，記得點進去移動你的滑鼠看看網頁的互動效果。

github.com/404

Dropbox由於具有檔案分享的功能，所以它的404同樣一定也很多人看過：是個衍生自Dropbox Logo的視覺錯視立體方塊圖

www.dropbox.com/404

臉書Facebook雖然是世界網站流量排名第一的網站，但它的404其實不是這麼常見，而自然臉書的404也是從按「讚」設計延伸出來的。

www.facebook.com/404notfoundfortheurl

Lego網站的404畫面做得相當活潑有趣

www.lego.com/404

這是一個諧音梗，壞掉的連結有時候我們稱之為死亡的連結 "Dead Link"，而 Link 又剛剛好是任天堂著名遊戲的主角姓名...

www.pixiapps.com/404/

一樣是老遊戲，紅白機上的小蜜蜂畫面搭配著 "Play again"，將瀏覽者帶回網站的主要頁面。

www.marketingvirtuel.fr/404notfound

老遊戲的梗常常被拿出來惡搞：還記得到處都找不到正牌公主的瑪莉歐嗎？

彩色Bar跟藍色當機畫面讓大家可以回味以往的美好時光？

自定的HTTP 404雖然平常在網頁上看不到、很容易被設計師忽略，但如果你只是讓使用者看到那個瀏覽器預設的404畫面時，往往使用者會直接關閉網頁離開呢。相對的要是可以針對404頁面做適當的設計，即使瀏覽者來錯了入口，也可以提升瀏覽者對你的好印象，進而順利引導瀏覽者回到你的網站中。也記得為你的客人們準備一些小小的驚喜吧！

參考文獻

[1] Wiki HTTP 404

[2] Images via Andrew Stawarz, cc license.

本文獲Desiring Clicks授權轉載，原文連結在此

Desiring Clicks裡面包含了行為心理學、視覺心理學、認知心理學、認知神經學、介面設計、資訊架構學、使用性分析與設計等等不同領域的知識。介紹人機互動的領域，藉由表達人與電腦之間的關係，讓我們能更進一步的設計更容易使用、更貼近人性、甚至是更智慧化的電腦設備。

Desiring Clicks官網、粉絲團