經(jīng)常有看到一些平臺(tái)分享404頁(yè)面的設(shè)計(jì)领迈，但只是丟了一些別人設(shè)計(jì)好的頁(yè)面具被，再無(wú)其它說(shuō)明奔誓。畢竟設(shè)計(jì)師都清楚設(shè)計(jì)404頁(yè)面并不是只是單純地畫一幅插畫而已琢锋。于是花了一些時(shí)間搜集和分析了404頁(yè)面的設(shè)計(jì)蛤迎，思考和整理了相關(guān)的設(shè)計(jì)思路确虱。
在此之前先簡(jiǎn)單明確一下404頁(yè)面的定義：
404頁(yè)面是客戶端在瀏覽網(wǎng)頁(yè)時(shí)，服務(wù)器無(wú)法正常提供信息替裆，或是服務(wù)器無(wú)法回應(yīng)校辩，且不知道原因所返回的頁(yè)面。
自定義404頁(yè)面是處理空白狀態(tài)的一種情況辆童，其在用戶體驗(yàn)上的作用通常是：1.告知用戶錯(cuò)誤所在宜咒，緩解用戶焦慮。2.提供解決方案把鉴，如返回上一頁(yè)或首頁(yè)故黑，提升用戶留存率。3.影響用戶對(duì)網(wǎng)站的印象庭砍。同時(shí)百度百科還提到“峰終定律”在404頁(yè)面的運(yùn)用：
對(duì)一項(xiàng)事物的體驗(yàn)之 后场晶，所能記住的就只是在峰與終時(shí)的體驗(yàn)，而在過(guò)程中好與不好體驗(yàn)的比重怠缸、好與不好體驗(yàn)的時(shí)間長(zhǎng)短诗轻，對(duì)記憶差不多沒(méi)有影響。404錯(cuò)誤頁(yè)面應(yīng)該作為頁(yè)面瀏覽的一部分揭北，看到“出錯(cuò)”或者“抱歉”頁(yè)面之類404頁(yè)面的時(shí)候扳炬，用戶會(huì)對(duì)網(wǎng)站的信任度迅速降低，有種挫敗感搔体。
下面是一些相關(guān)的設(shè)計(jì)思路：
1.直接表示出現(xiàn)了錯(cuò)誤恨樟。（通常可用搞砸的事物表示疚俱，如斷線風(fēng)箏劝术、斷了的鉛筆、撕碎的書頁(yè)呆奕、下雨天沒(méi)傘养晋、破碎的玻璃、機(jī)器人故障等等）
2.表示抱歉登馒，沒(méi)能找到頁(yè)面匙握。向用戶道歉，而不是責(zé)備用戶（用戶心軟陈轿，哈哈）圈纺。
3.用幽默詼諧的方式提示用戶到了一個(gè)錯(cuò)誤的頁(yè)面秦忿。
(啊啊啊啊啊啊，頁(yè)面不存在蛾娶！就像是從圖片中的動(dòng)物口中說(shuō)出來(lái)的一樣灯谣。)
4.轉(zhuǎn)移用戶注意力，如可以在404頁(yè)面玩一會(huì)小游戲蛔琅、展示公益廣告胎许、甚至傳播正能量：
(類似的還有為人所熟知的谷歌404的跳跳龍游戲。)
5.頁(yè)面的去向罗售。腦洞下沒(méi)有找到的頁(yè)面的下落(如頁(yè)面正在休息辜窑，頁(yè)面消失了，頁(yè)面被吹走了)寨躁。
6.表示訪客迷失穆碎。（如表示訪客迷路了，迷失在茫茫宇宙职恳，到了不正確的地方等示意用戶這是錯(cuò)誤頁(yè)面所禀。）
7.如果你的網(wǎng)站受眾是年輕人，你也可以選擇賣個(gè)萌放钦，討個(gè)喜色徘。
關(guān)于404頁(yè)面的設(shè)計(jì)注意事項(xiàng)有許多，覺(jué)得百科上已經(jīng)寫得很詳細(xì)操禀，就搬過(guò)來(lái)了：
1.不要將404錯(cuò)誤轉(zhuǎn)向到網(wǎng)站主頁(yè)褂策，否則可能會(huì)導(dǎo)致主頁(yè)在搜索引擎中消失。
2.404頁(yè)面不要自動(dòng)跳轉(zhuǎn)床蜘，讓用戶來(lái)決定去向辙培。
3蔑水、不使用專業(yè)術(shù)語(yǔ)：“404錯(cuò)誤”這個(gè)詞的使用一直非常規(guī)范邢锯，但這并不是你使用專業(yè)術(shù)語(yǔ)嚇跑訪客的理由〔蟊穑“找不到網(wǎng)頁(yè)”這個(gè)說(shuō)法相比來(lái)說(shuō)更準(zhǔn)確也更易于接受丹擎。
4、不要責(zé)備訪客
5歇父、提示訪客檢查拼寫（常出現(xiàn)在搜索引擎中）：還有一個(gè)可能是訪客看到404錯(cuò)誤頁(yè)面是由于他們自己在輸入U(xiǎn)RL網(wǎng)址時(shí)出現(xiàn)了拼寫錯(cuò)誤蒂培。提示訪客檢查他們的拼寫，但不要失禮榜苫。
6护戳、明確表明404：清楚地向訪客聲明他們正在搜尋的頁(yè)面無(wú)法找到，且不要讓錯(cuò)誤頁(yè)面看起來(lái)與正常的內(nèi)容頁(yè)（如加入過(guò)多的文本和鏈接）太過(guò)相似垂睬。你是想要表明這是一個(gè)錯(cuò)誤頁(yè)面媳荒，所以就不要羞于向訪客們聲明這一點(diǎn)抗悍。
7、放置網(wǎng)站主頁(yè)鏈接：不要讓訪客無(wú)處可去或是無(wú)法找到你的網(wǎng)站信息钳枕。至少應(yīng)該有一個(gè)鏈接鏈回你的網(wǎng)站主頁(yè)缴渊。這樣一來(lái)，從其他網(wǎng)站鏈接而來(lái)的訪客就可以了解你以及你的網(wǎng)站鱼炒，甚至他們可能在你的網(wǎng)站中找到一些他們喜歡的內(nèi)容衔沼。
8、訪客方便反饋信息：如果訪問(wèn)者點(diǎn)擊了你網(wǎng)站上的一個(gè)錯(cuò)誤鏈接昔瞧，你會(huì)想了解這個(gè)鏈接故障指蚁。如果通過(guò)404頁(yè)面給他們提供一個(gè)反饋信息的便捷方式，讓他們可以報(bào)告這個(gè)故障以便你去解決自晰。這只需要一個(gè)非常簡(jiǎn)短的形式來(lái)提示訪客告訴你他們來(lái)自哪個(gè)頁(yè)面及哪個(gè)鏈接欣舵。通過(guò)這個(gè)方法，你可以獲取到所有你需要的信息缀磕。
9缘圈、保持品牌風(fēng)格：我們都看過(guò)非常酷的“讓訪客發(fā)現(xiàn)一個(gè)巨大的“復(fù)活節(jié)蛋”“的錯(cuò)誤頁(yè)面的設(shè)計(jì)案例袜蚕。但千萬(wàn)不要使這個(gè)頁(yè)面的設(shè)計(jì)與你網(wǎng)站的其他頁(yè)面相差太大糟把，否則會(huì)看起來(lái)這個(gè)頁(yè)面不像你網(wǎng)站的設(shè)計(jì)，會(huì)讓訪客產(chǎn)生疑惑牲剃，誤以為自己已經(jīng)被帶到了一個(gè)外部網(wǎng)站遣疯。
10、語(yǔ)言版本：如果你的網(wǎng)站是多語(yǔ)種的凿傅，404錯(cuò)誤頁(yè)面將從你所有語(yǔ)言版本的網(wǎng)站中獲取錯(cuò)誤信息缠犀。無(wú)論你想要顯示任何信息，都需要將其翻譯成各個(gè)語(yǔ)言版本聪舒，使每個(gè)人都能理解辨液。同時(shí)還需提供一個(gè)鏈接返回到訪客所對(duì)應(yīng)的語(yǔ)言版本的網(wǎng)站。
11箱残、讓訪客搜索想要的：如果訪客正在訪問(wèn)的頁(yè)面已被移動(dòng)滔迈，你可能想給他們一個(gè)途徑來(lái)搜索頁(yè)面被移動(dòng)到了何處，可以考慮在頁(yè)面增加一個(gè)搜索框被辑。
如果只是像下面這樣燎悍，可能會(huì)不太合適：
當(dāng)然，如果你的用戶就是程序員盼理，你也可以這樣啦：
:)
以上只是有限的設(shè)計(jì)思路谈山，然而創(chuàng)意是無(wú)限的，比如這樣：
大大提高好感度呢宏怔。o(^▽^)o
