解析網(wǎng)站404網(wǎng)頁(yè)設計那些不得不說(shuō)的事發(fā)布者：本站     時(shí)間：2021-12-08 13:12:27

前陣子做我們一淘?xún)?yōu)惠商家統一的報錯頁(yè)面， 整理了一些有意思的404頁(yè)面(后簡(jiǎn)稱(chēng)404)，加之最近網(wǎng)友熱議的QQ空間公益404頁(yè)面，在這里一起拿出來(lái)跟大家分享一下。

閱讀全文

什么是404頁(yè)面?

404是HTTP其中一種的標準回應信息，通俗的說(shuō)，當用戶(hù)瀏覽網(wǎng)頁(yè)時(shí)，服務(wù)器無(wú)法正常提供信息，例如用戶(hù)輸入了錯誤鏈接;或者無(wú)法相應并且找不到原因，這時(shí)候頁(yè)面會(huì )出現這個(gè)404頁(yè)面。404是一個(gè)信息碼，通常之后會(huì )有一個(gè)可讀信息反饋給用戶(hù)：Not Found。它意味著(zhù)網(wǎng)頁(yè)不存在。

為什么叫404?

據說(shuō)在第三次科技革命之前，互聯(lián)網(wǎng)的形態(tài)就是一個(gè)大型的中央數據庫，這個(gè)數據庫就設置在404房間里面。那時(shí)候所有的請求都是有人工手動(dòng)完成的，如果在數據庫中沒(méi)有找到請求者所需要的文件，或者由于請求者寫(xiě)錯了文件編號，用戶(hù)就會(huì )得到一個(gè)返回信息：room 404 : file not found。后來(lái)互聯(lián)網(wǎng)興起后，人們也就習慣了用404作為服務(wù)器未找到文件的錯誤代碼了。(via 百度百科)

為什么要設計404頁(yè)面?

盡管404頁(yè)面被用戶(hù)看到的概率相對全站的其他頁(yè)面要小很多，但頁(yè)面難免會(huì )出錯，無(wú)論是用戶(hù)的誤操作還是服務(wù)器的原因，這是一個(gè)極少數才會(huì )出現的錯誤情況，作為網(wǎng)頁(yè)的設計者或者開(kāi)發(fā)者，有時(shí)候我們無(wú)法控制錯誤頁(yè)面的出現，但我們可以通過(guò)使用一個(gè)定制的404錯誤頁(yè)面將損害降到最低。好的用戶(hù)體驗是我們不能放過(guò)任何一個(gè)小的細節，一我們需要在這個(gè)頁(yè)面很好的把信息傳達給用戶(hù)，二引導用戶(hù)下一步的操作，引導用戶(hù)留在我們的網(wǎng)站而不是沮喪的關(guān)閉窗口。

他們都在404上做了什么?

下面我們先來(lái)看幾個(gè)直觀(guān)形象版的404頁(yè)面：

詳細解析404那些不得不說(shuō)的事,PS教程,

俄文網(wǎng)站，首屏巨大無(wú)比的404和傷心欲絕的小裸男，直觀(guān)的讓用戶(hù)感受到網(wǎng)頁(yè)出了問(wèn)題。但對于不懂互聯(lián)網(wǎng)的用戶(hù)來(lái)說(shuō)，不能明白404的含義，并且圖案下方相關(guān)解釋文字特別小，都是對用戶(hù)無(wú)用的信息，只簡(jiǎn)單的說(shuō)明了可以返回到首頁(yè)。

詳細解析404那些不得不說(shuō)的事,PS教程,

報道點(diǎn)評新聞的網(wǎng)站Retardnews，簡(jiǎn)單“粗暴”的圖片展示。

搞笑版的404頁(yè)面：

詳細解析404那些不得不說(shuō)的事,PS教程,

美國動(dòng)畫(huà)片南方公園的網(wǎng)站，在404上依舊采用了無(wú)厘頭的風(fēng)格，Kyle和胖子Eric以對話(huà)的形式告知用戶(hù)頁(yè)面不存在，延續惡搞風(fēng)格。

詳細解析404那些不得不說(shuō)的事,PS教程,

Jotsai中讓人會(huì )心一笑的404小圖片，頁(yè)面沒(méi)有找到，布偶說(shuō)因為我把它吃了。

詳細解析404那些不得不說(shuō)的事,PS教程,

Acorn Creative的英式幽默。

看完搞笑版的讓我們走一走溫情路線(xiàn)：

詳細解析404那些不得不說(shuō)的事,PS教程,

美女圖片的社交網(wǎng)站Zivity，首先告訴了用戶(hù)頁(yè)面沒(méi)有找到，使用了美女圖片：雖然一些不好的情況，但我們仍然愛(ài)你。最后依舊讓用戶(hù)選擇想要去的地方。

有愛(ài)的404

詳細解析404那些不得不說(shuō)的事,PS教程,

歐洲的一家公益組織Child Focus在去年10月推出了一項名為“NotFound”的計劃，利用網(wǎng)站的404頁(yè)面幫助找回走丟的孩子。

詳細解析404那些不得不說(shuō)的事,PS教程,

同一時(shí)期，在Missing Children Europe和European Federation for Missing and Sexually Exploited Children等公益組織的號召下，益云社會(huì )創(chuàng )新中心將404公益模式引入國內，發(fā)起了“404公益”****。

詳細解析404那些不得不說(shuō)的事,PS教程,

最近，騰訊也利用其自身平臺和廣大的用戶(hù)群體，以新的形式通過(guò)404去承擔社會(huì )責任，發(fā)揮產(chǎn)品的社會(huì )影響力。

最后說(shuō)一下我們這次設計的一淘404頁(yè)面,采用了傳統的提示+相關(guān)推薦引導的形式：

詳細解析404那些不得不說(shuō)的事,PS教程,

1. 向用戶(hù)表示歉意，用戶(hù)不會(huì )主動(dòng)訪(fǎng)問(wèn)404，訪(fǎng)問(wèn)到404讓用戶(hù)很不愉快，道歉可以使用戶(hù)減少對網(wǎng)站的抱怨。并明確提示用戶(hù)想要的信息不存在;

2. 形象的圖片配合文字，讓用戶(hù)直觀(guān)感受;

3. 適當的引導用戶(hù)，并給他們有用的鏈接，自動(dòng)跳轉，秒數倒計時(shí)也是貼心的服務(wù);

4. 其他一些選擇，因為訪(fǎng)問(wèn)到404的不止是個(gè)人，也有可能是商家;

5. 推薦網(wǎng)站內的相關(guān)熱門(mén)商家，不讓用戶(hù)失望而歸。

一個(gè)精心設計的404錯誤頁(yè)可以幫助網(wǎng)站避免丟失用戶(hù)的信任，并正確引導用戶(hù)返回站點(diǎn)其它頁(yè)面，以便用戶(hù)能停留在網(wǎng)站上更長(cháng)時(shí)間，減少客戶(hù)的流失量。設置404頁(yè)面，其實(shí)也是提高用戶(hù)體驗的一種表現形式。

結束語(yǔ)

訪(fǎng)問(wèn)到錯誤頁(yè)面是不愉快的用戶(hù)體驗，但作為設計者我們可以為用戶(hù)想的更多，無(wú)論是像騰訊的公益使404變廢為寶，做有愛(ài)的404，還是一些幽默圖片讓用戶(hù)會(huì )心一笑，我們需要花更多的精力和時(shí)間做更多有創(chuàng )意的事情。