404ページとは、存在しないURLにアクセスしたときに表示されるエラーページです。URLの打ち間違いや、削除・移動したページへのリンクからたどり着いた読者は、ここで何もなければそのまま離れてしまいます。結論から言うと、404ページには「ページが見つからないこと」「次に行ける場所」「探す手段」の3つを載せ、サーバーが正しく404のステータスコードを返すように設定するのが基本です。この記事では、404ページの作り方を、載せる要素・デザイン・技術的な注意点に分けて解説します。
404ページ作りの要点
この記事の要点
- 404ページは、迷った読者をサイト内に引き戻すための案内ページ。
- 状況の説明、トップや主要ページへのリンク、サイト内検索の3つを載せる。
- 見た目だけでなく、サーバーが「404」を返しているかを必ず確認する。
404ページとは
404ページとは、サーバーが「指定されたページが見つからない」ことを示すステータスコード404を返すときに表示するページです。何も用意していない場合は、サーバーやCMSの標準の画面が表示されます。
標準の画面は英語の短いメッセージだけのことが多く、読者は自分が何を間違えたのか、どこへ行けばよいのかが分かりません。独自の404ページを用意すると、サイトのデザインのまま状況を伝え、次の行動を案内できます。
404ページが必要な理由
どれだけ丁寧に運用していても、404は必ず発生します。主な原因は次のとおりです。
- 読者がURLを打ち間違えた。
- ページを削除したり、URLを変えたりした。
- 他サイトやSNSに、古いURLや誤ったURLが載っている。
- サイトのリニューアルで、転送の設定が漏れた。
原因の多くはサイト側で完全には防げないため、たどり着いた読者を受け止める仕組みが必要です。404ページは、問い合わせ完了後に表示するサンクスページと同じく、見落とされがちですが読者の体験を左右するページです。
404ページに載せる要素
404ページには、次の要素を載せます。上から順に優先度が高いものです。
- ページが見つからないことを伝える見出し。「お探しのページは見つかりませんでした」のように、平易な言葉で書く。
- 考えられる理由の短い説明。「URLが変更されたか、削除された可能性があります」など。
- トップページへのリンク。最も分かりやすい戻り先として、目立つ位置に置く。
- 主要ページへのリンク。サービス一覧、ブログ、お問い合わせなど、読者がよく探すページ。
- サイト内検索。目的のページが分かっている読者が自分で探せるようにする。
- 問い合わせ先。どうしても見つからない場合の連絡手段。
読者にとって404ページは「行き止まり」です。謝罪の言葉よりも、次に行ける場所を分かりやすく並べることを優先します。
404ページのデザインの考え方
404ページのデザインは、サイトのほかのページと同じヘッダー・フッターを使い、同じサイトの中にいることが分かるようにするのが基本です。
- ヘッダーとフッターを残し、通常のナビゲーションから移動できるようにする。
- リンクやボタンは、ほかのページと同じ見た目にする。
- イラストやひと言のユーモアを入れる場合も、案内のリンクより目立たせない。
- スマートフォンでも、リンクやボタンが押しやすい大きさで表示されるようにする。
ブランドらしさを出す場としても使えますが、目的は読者を案内することです。作り込みすぎて読み込みが重くならないようにします。
ステータスコードとソフト404の注意点
404ページは、見た目だけでなく、サーバーが返すステータスコードが正しいことが重要です。
見つからないページでは404（または410）を返す
Googleは、404や410などの4xxを返すURLのコンテンツを使わず、インデックスにも登録しません。すでに登録されていたURLが4xxを返すようになった場合は、インデックスから削除されます（Google検索セントラル、2026年3月更新）。存在しないページで正しく404を返していれば、検索結果に不要なページが残りません。
ソフト404に注意する
ソフト404とは、画面には「見つかりません」と表示しているのに、サーバーが正常を意味する200を返している状態です。内容のない空のページやエラーメッセージだけのページも、Search Consoleでソフト404として報告されることがあります。
存在しないURLをすべてトップページへ転送する設定も、読者を混乱させるうえ、ソフト404と判断されることがあります。転送するのは、移転先がはっきりしているページだけにします。
確認の方法
- 存在しないURL（例：/test-not-found）にアクセスし、独自の404ページが表示されるかを確認する。
- ブラウザの開発者ツールの「ネットワーク」タブで、ステータスコードが404になっているかを確認する。
- Search Consoleのページのインデックス登録レポートで、ソフト404や見つからないページが出ていないかを定期的に見る。
ページを移動したことが原因の404は、404ページで受け止めるより、旧URLから新URLへ転送するほうが適切です。転送の設計はサイト移行のURL設計で、Search Consoleの見方はSearch Consoleの使い方で解説しています。
まとめ
- 404ページは、存在しないURLにたどり着いた読者をサイト内に引き戻すための案内ページ。
- 状況の説明、トップや主要ページへのリンク、サイト内検索、問い合わせ先を載せる。
- デザインはサイト共通のヘッダー・フッターを使い、案内のリンクを最も目立たせる。
- サーバーが404を返しているかを確認し、ソフト404やトップへの一括転送を避ける。
サイトの制作やリニューアルとあわせてエラーページまで整えたい場合は、サービス一覧からご確認いただけます。
