Download - Design for 404 error pages
前言
曾經瀏覽網站時出現「找不到網頁」的窘境嗎?當網站出現錯誤
提示時,不僅會降低網友的好感度與信任度,更容易讓網友產生
不好的使用者經驗 (User Experience),我們可以利用網頁設計的方
式,將 404 錯誤頁面 (404 error pages) 搭景成不同風貌,就能預防
網友狠心跳出。因此我們特別整理幾種不同 404 錯誤頁面的設計
風格以及實際網站給大家參考,希望大家都能從中獲得設計靈感。
1 Magnt
利用數學交集概念分享產生 404 錯誤頁面的因果關係。
2 Worrydream
以煙斗的方式,運用 Pop 流行文化與 404 錯誤頁面結合。
點擊圖片能夠瀏覽範例網站!
Design Style # 2
搶眼視覺效果 分散網友注意力
Visualization Style
發揮藝術天分將 404 錯誤頁面加入多元素材,使 404 錯誤頁面看起來獨樹一格。有時候這種些微的改變,就可能改變網友的想法。
1 Huwshimi 2 Worrydream
利用詼諧的元素取悅網友。 忍者表示: 「網頁是我偷的!」
加入色彩繪畫的元素,讓 404 錯誤頁面可以更生動有趣。
點擊圖片能夠瀏覽範例網站!
長時間的互動,使網友消氣與殺時間
1 Blue Fountain Media
小時候的回憶,小精靈遊戲居然出現在 404 錯誤頁面!
2 Hot Dot
點擊 404 就能破壞字體,讓進入 404 錯誤頁面的網友能夠消消氣。
點擊圖片能夠瀏覽範例網站!
短暫互動後,網站將重新指向正確頁面
1 GitHub
移動滑鼠能與使網頁物件跟著移動,有別於其他 404 錯誤頁面。
2 Hakim EI Hattab
網頁陸續出現眼睛,並跟著滑鼠移動方向而變化。
點擊圖片能夠瀏覽範例網站!
1 LEGO
在 404 錯誤頁面加入品牌元素,並告知網友此網頁無法使用。
2 Worrydream
交友網站的 404 錯誤頁面利用修補愛情關係的圖片來加增強品牌傳遞價值。
點擊圖片能夠瀏覽範例網站!
這款 404 錯誤頁面最厲害...(笑)
Nouveller
404 錯誤頁面會出現 DOS 畫面,等網友輸入之後,將以特定的圖片以及語言與網友互動。
點擊圖片能夠瀏覽範例網站!
參考以下建議,讓 404 錯誤頁面更完整!
1 連結至有趣的貼文: 建議網站人員將 404 錯誤頁面重新導向到網站最受歡迎的內容。
2 加入搜尋欄: 讓網友直接搜尋想獲得的相關資訊。
3 新增意見欄或聯絡信箱: 網友回饋、建議最直接,迴響的名單也是企業必須追蹤的重點之一。
添加回報功能: 協助網友可以即時回報錯誤,持續 提升使用者經驗。
6
4
解釋 404 錯誤頁面的原因: 讓 404 錯誤頁面扮演公關發言人,透 過與網友分享網站遭遇的問題,降低 網友的疑慮,成功解決公關危機。
5 提供 Sitemap 的功能:
指引網友能夠在網站中找尋正確的網頁。
圖片及參考資料
The art of error: 12 clever 404 pages http://wis.tw/1AhZYsC
圖片來源
http://wis.tw/1HrVCyI http://wis.tw/1Fus83Y http://wis.tw/1JZocrH http://wis.tw/1Lk54pg