404ページを上手に利用して、サイト訪問者を逃すな！

404ページは上手に利用すること

皆さんは、404ページを利用されているでしょうか？

404ページを上手く使うことは、サイト訪問者を逃さないようにして、
ユーザーを獲得するチャンスにもなります。

「404 Not found」や「お探しのページは見つかりません。」
と一行だけ表示させるようなシンプルなページにするのではなく、
サイト訪問者を自サイトへ留まらせて、サイト内の別ページへ誘導できるような404ページ作りを意識しましょう！！

404ページとは？

まず、404ページとは、
■存在していたページを削除した場合
■URLを間違えてアクセスしてきた場合
に、そのURLへの訪問者に対して、ページが存在していないことを伝えるページになり、
同時に404というステータスコードを返します。

多くの方が、
「404 Not found」や「お探しのページは見つかりません。」と表示させただけのシンプルなページを作成されています。

中には、404ページを作成すらされていない場合もありますが、
必ず作成されることをおすすめします。

この404ページも、上手に使えばサイト訪問者を増やすきっかけにもなるので、
地味なページですが、サイト訪問者を自サイトに留まらせる為に、効果的な404ページの作成をおすすめします。

効果的な404ページの設計方法

まず、404ページを作成する上で押さえておくべき点は、
Search Console ヘルプ > 404 ページのカスタマイズのページを参照して頂くのが早いです。

• ユーザーに対して、探しているページが見つからないことを明確に伝えます。親しみやすく魅力的な言葉を使用します。
• 404 ページを、サイトのその他の部分と同じデザイン（ナビゲーションを含む）にします。
• 最も人気のある記事や投稿へのリンクの他、ホームページへのリンクを追加します。
• 無効なリンクを報告する方法をユーザーに提供することを検討します。
• この 404 ページがどれほどきれいにデザインされ、役に立つものであっても、Google 検索結果に表示したいとは誰も思わないでしょう。404 ページが Google や他の検索エンジンのインデックスに登録されないようにするため、存在しないページがリクエストされたときにウェブサーバーが実際の 404 HTTP ステータス コードを返すことを確認します。

参照：Search Console ヘルプ > 404 ページのカスタマイズ

大まかには、こちらの内容で問題ないですが、
さらに、ページの検索機能があれば、ユーザビリティも上がり、よりおすすめです。

おすすめの404ページ事例3選

GitHub

GitHubの404ページです。

シンプルな作りですが、GitHubのような技術者寄りのサイトであれば、
検索機能のみの404ページの方が使い易くて、おすすめです。

神戸大学

神戸大学の404ページです。

お問い合わせ先や目的別に分けてリンク先を設定しています。

ユーザーを目的ページに導き易い構造になっており、
この作り方が一番おすすめです。

それいけ！アンパンマン

それいけ！アンパンマンの404ページです。

キャラクターを利用した404ページも、ユーザーの目を引くので、効果的です。
普通は、バイキンマンやドキンちゃんのような有名キャラクターを持っている会社はないので、
素材サイトなどでユーザーの目を引くようなキャラクターのイラストを探すといいでしょう。

.htaccessを使って404エラーページへリダイレクト

404ページを作成したら、
必ず.htaccessで404エラーページへリダイレクトさせるようにしましょう。

具体的には、.htaccessに以下の記述を追記します。