如何利用 404 頁面？

您是否曾經在任何網站上遇到過 Not Found (404) 錯誤？ 您知道您有機會轉換那些登陸未找到頁面的訪問者嗎？ 本文將幫助您利用 404 頁面。

如果您沒有設置 Google 分析來跟踪 404 頁面。 這是一個為您的網站設置的官方博客。

如果您正確地知道網絡在 HTTP 協議上工作。 Web 服務器將為您的每個資源請求返回適當的 HTTP 狀態代碼。

您可能需要知道四個基本的 HTTP 狀態代碼，它們是200 - 找到， 301 - 永久移動， 404 - 未找到， 500 - 內部服務器錯誤。 404 - 未找到和 500 - 內部服務器錯誤是顯示最多的兩個狀態代碼。

404 和 500 之間的唯一區別是 web 服務器將在未找到 404 錯誤的情況下顯示分配的錯誤頁面，而在 500 的情況下不顯示服務器生成的輸出，因為 web 服務器遇到一些配置錯誤。

404 可能由於各種原因而發生，例如訪問者請求您網站上從未存在的資源，請求您已刪除的頁面/資源，或請求 URI 中有錯誤或拼寫錯誤的資源。

在某些情況下，您想要刪除那些過時的頁面、帖子和媒體資源。 在這種情況下出現 404 錯誤是一個自然過程。 沒有什麼問題。

如果您進行一些研究，您會發現大多數網站都有靜態 404 頁面。 在任何未找到錯誤的情況下，都會顯示相同的頁面。 如果設計師有足夠的經驗，他/她可能會放置一個小的導航到主頁鏈接/按鈕。

用你的 404 頁面多跑一英里怎麼樣？ 如果讓你的 404 頁面有點互動呢？ 讓我們探索可能性。

以下是您可以將靜態 404 頁面轉換為更具交互性的四種方法：

1. 404 頁面與用戶搜索的最相關鏈接
2. 404 頁面，提供您最好的免費優惠
3. 帶有鏈接助手的 404 頁面
4. 帶有您要推廣的鏈接的 404 頁面

01. 404頁面與用戶搜索的最相關鏈接：

了解訪問者在您的網站上搜索的內容是關鍵。 為用戶提供指向最佳匹配資源的正確鏈接可能是您可以為訪問者提供的最佳用戶體驗。

可能會出現問題，您如何知道用戶在搜索什麼，以及如何根據他的搜索建議鏈接？

嗯，這個解決方案一開始可能看起來很複雜，但開發起來並沒有那麼複雜。 如果您是開發人員，您會知道您可以提取請求的資源字符串並對您網站上的資源進行正則表達式檢查。

例如，您為所有大多數音頻製造品牌提供揚聲器維修服務。 例如，Bose X1 揚聲器就在您的列表中。 但是訪問者使用 Bose X10 作為請求資源訪問您的站點。 沒有名為 Bose X10 的揚聲器，所以它自然不會在您的列表中。

404 頁面上可能顯示的內容是列出您維修的所有 BOSE 揚聲器。 如果可能的話，將那些 BOSE X 系列揚聲器放在第一位。

這可能是用戶導航到正確頁面的最佳方式，儘管該頁面已登陸 404 頁面。 轉換該 404 頁面的機會非常高。 您幫助他導航到實際頁面。

此外，這也將幫助您降低網站的跳出率。 如果您不顯示指向最佳匹配頁面的建議鏈接，訪問者很有可能會返回或離開您的網站。

02. 404 頁面提供您最好的免費優惠：

讓我們考慮一下，對於您的網站來說，顯示最相關的鏈接是不太可能的。 或者你不想涉及太多編碼的東西。 這可能是開始的最佳選擇。

當訪問者登陸您網站的 404 頁面時，向他們顯示一條消息，表示您很抱歉他/她正在尋找的資源不可用。

就在道歉文字向他們展示您網站上運行的最佳報價之後。 這可能就像為您最熱門的運行產品提供 5% 或 10% 的折扣，或者免費為他們提供有價值的東西以換取電子郵件。

這可能是讓所有訪問者與登陸 404 頁面的其他產品或產品保持互動的最佳方式！

03. 帶鏈接輔助的404頁面：

雖然您始終可以在 404 頁面上顯示導航。 但是訪問者很有可能會轉到您的導航面板，確定他想要訪問的頁面並登陸該頁面！ 他們中的大多數人只是離開。

您可以採用這種方式進行 404 頁面設計，其中包含指向您網站各種資源的所有重要鏈接以及明確的 404 錯誤消息。

這可能有助於用戶了解他進入了錯誤的頁面。 它是 404，但他有一個鏈接列表，其中顯示了他可以訪問的網站上的所有重要資源。

04. 404頁面，帶有您要推廣的鏈接：

非常簡單，只需在 404 頁面上設置您希望訪問者訪問的鏈接。 我不建議單獨走這條路。 可能是建議 03 和 04 的混合可以工作。

將您真正想要推廣的頁面的鏈接保留在 404 頁面上肯定會幫助您增加這些頁面的訪問量。 不利的一面是，您會產生更多不關心的訪問，這可能會導致高跳出率。

我在這裡提出的唯一建議是，如果沿著這條路走，請至少提供一種免費或非常通用的產品。 這意味著任何人都可以與您提供的產品相關聯。 它要么非常實惠，要么免費，可以幫助您改善參與度。

創意 404 頁面的流行示例

如果您在為您的網站創建 404 頁面時正在尋找一些靈感，這裡有一些我個人最喜歡的 404 頁面示例。

五福

Wufoo 是互聯網上流行的聯繫表格集成服務之一。 觀察頁面的整體主題和區別於頁面其餘部分的綠色按鈕！

恐龍代表未找到消息，請查看“創建免費表單”按鈕。 它清楚地指示用戶按下按鈕並對未找到的頁面採取一些行動。

他們沒有將導航保持在頂部，而是使用 CTA 按鈕下的選定導航項。

民宿

從清晰的 404 消息、未找到的插圖和小區域下方的導航鏈接中了解 AirBnB 如何代表所有內容！

在 AirBnB 網站上迷路的用戶將登陸此頁面，該頁面具有所有必要的方向（鏈接），可將用戶送回重要頁面並讓他參與網站。

郵件黑猩猩

Mailchimp 非常流行的電子郵件營銷平台有一個漂亮的 404 頁面。 他們將猴子與綠巨人一樣的造型應用於似乎迷失在森林中的人。

登陸此 404 的用戶會收到帶有插圖的清晰消息，清晰的消息後跟插圖。

最好的部分是他們知道用戶已經迷路了，所以他可能會在未找到消息之後立即找到一個搜索欄。 用戶可能能夠使用搜索來搜索​​他之前正在尋找的任何資源。

如果搜索不是更喜歡查找或定位資源的東西，它們在搜索欄下方包含一個漂亮的導航！

比特利

Bitly 是最受歡迎的 URL 縮短服務之一，其中包含一些很酷的功能，例如自定義品牌和點擊分析。

顯然他們有一個漂亮而有意義的 404 頁面！ 如果你花幾秒鐘的時間，你會注意到設計師讓海洋保持空曠。 意味著水中沒有任何東西，這清楚地說明了沒有找到所請求的資源。

標題上沒有保留導航面板。 該頁面顯示錯誤消息，底部是三個簡單且最基本的導航鏈接。

為了使事情更具交互性，設計團隊在鼠標移動事件上製作了波浪效果。 訪問頁面以體驗它。

小鍋

Cooklet 空盤子的精美插圖清楚地表明您正在尋找的東西並不存在。

哦不！ 連同一個空盤子傳達未找到的消息。 有趣的是，他們在未找到消息下提供了 Get Back（javascript 歷史記錄）操作鏈接和轉到主頁鏈接。

此外，它們使標題與搜索欄保持不變。 這意味著想要導航而不是前一個或主頁的用戶將能夠輕鬆找到資源。

我測試過這些嗎？

上面是我自己網站的404頁面的圖片。 最初我的 404 頁面上沒有按鈕或鏈接。 這是一個顯示錯誤消息的普通 404 頁面，它！

我添加了一個按鈕，以區別於頁面的其餘元素並激勵訪問者按下它。 按下它會使用戶返回主頁。 這個簡單的按鈕幫助我將訪問者帶到我網站的主頁並讓他們參與網站。

我計劃在第 1 點中討論過的頁面中添加更多動態內容。

結論

對於任何網站來說，擁有 404 都是很自然的事情。 但是正確利用 404 頁面並將這些 404 訪問者轉化為客戶才是真正的聰明。 討論的技術將幫助您降低跳出率並提高參與度。