普段Webサイトを閲覧している時に、真っ白な背景に「お探しのページは見つかりませんでした」「404 not found」と表示されたことはありませんか？
これらは、通称「404エラー」と呼ばれます。かなりメジャーなエラーなので、Webサイトを運営している人なら、エラーの原因と解決方法について詳しく知っておいた方がよいでしょう。
また、404エラーページをデザインしておくと、ページの離脱率を下げることができます。理想的な404エラーページのデザインについても事例を用いてご紹介致します。
404エラーとは？
404エラーとは…
リクエストされたページが存在しない時に表示されるサーバーエラーのことです。
別名では「404 Not Found」と称されることもあります。
サーバーエラーについて理解するためには、まず、Webページが表示される手順を知っておきましょう。手順は、下記のようになっています。
▼Webページが表示される手順
①ページのデータの保存先であるサーバーに、Webブラウザがリクエストを送信
②サーバーがリクエストに応えてWebブラウザにデータを送信
③ページが表示される
404エラーは上記の②の手順において、サーバーから「そんなページのデータはありません」と返答された場合に起こるエラーです。
404エラーが起る主な原因
では、実際にどんな時に404エラーが起るのでしょうか。主な原因は2つあるので、それぞれについて紹介します。
誤ったURLでリクエストしている
これはよくあるミスですが、URLを手入力して検索する際に、1字でもスペルが誤っていると404エラーになります。
手入力ではない場合でも、貼られたリンクがそもそも誤っているケースがままあります。
まずは落ち着いて、正しいURLであるかどうかを確認しましょう。
すでにページが削除されている
すでに削除されたページにアクセスしようとすると404エラーになります。これは404エラーとして正常な反応です。
ドメイン移管やページの削除をした後に、ユーザーを別のURLに移動させたい場合は、301リダイレクトなどの対応をしましょう。
301リダイレクトでの詳しい対象方は今回は割愛させて頂きます。
404エラーページをデザインして離脱防止
あなたのサイトは404エラーページをデザインしていますか？TOPページのデザインは細部までこだわったけど、404エラーのページがデフォルトのままという方も多いのではないでしょうか。
404エラーページは頻繁に表示されるものではありませんが、真っ白で無機質なページが表示されると、ユーザーの離脱率が高くなる傾向にあります。
ユーザーの閲覧意欲を落とさないようにするためには、404ページをデザインしておくと良いでしょう。「TOPに戻る」や「サイトマップ」などのリンクが貼られていると、ユーザビリティが上がるのでおすすめです。
デザインされた404エラーページの実例
ここで、デザインされた404ページの実例をご紹介します。Webサイトを運営している方は、ぜひ参考にしてみてください。
日本コカ・コーラ株式会社
https://www.cocacola.co.jp/404
数字の水滴や缶の口が自社製品の「コカ・コーラ」を連想させる、技ありの404エラーページです。ユニークかつ、製品のアピールにもうまく繋げています。
ヤマト運輸
http://www.kuronekoyamato.co.jp/ytc/404error.html
複数のダンボール箱の中から黒猫を探すゲームで遊ぶことができます。つい楽しくなってしまい、404ページの滞在時間が伸びても許せてしまうでしょう。
タカラトミー
https://www.takaratomy.co.jp/404
キーワード検索が404エラーページに設置されているので、簡単に目的のページに移動することができます。
HONDA
https://www.takaratomy.co.jp/404
HONDAの404エラーページは問題点を指摘できるようになっています。「ユーザーと一緒になって問題を解決していきたい」という姿勢が伺るため、目当てのページが見つからなくても、嫌な気分になる人はいないでしょう。
404エラーの対応次第で機会損失が減る
404エラーは放置しておくと、サイトの流入数に影響を及ぼす危険性があります。他のページにユーザーを移動させたい場合は、301リダイレクトなどの対応をきちんと行いましょう。
また、404エラーページをデザインすることで、ページの離脱率を下げることができます。Webサイトを運営するのなら、なるべく機会損失は避けるように努めましょう。
関連記事
モバイルフレンドリーとは？順位を下げないための基礎知識と対応方法
突然ですが、あなたのサイトはモバイルフレンドリーテストに合格していますか？
Webサイトがモバイルフレンドリー化されていないと、検索順位の低下など、深刻な影響を受ける可能性があります。
今回はモバイルフレンド […]
canonicalとは？正しい使い方、NGな使い方を一挙に解説
canonicalって聞いたけど今一よくわからない、そんな悩みにお応えすべく簡単な概要から詳細な使い方までを紹介いたします。前半は概念を理解するための概要、後半はNGな使用方法や他の正規化タグとの違い […]
コメントアウトの便利な使い方と注意点についてご紹介します
コメントアウトは単なるメモだと思われることも多いですが、「誰でも読みやすいコード」を書く際には必須のスキルです。誰でもコードの変更がしやすい状態を作っておくことで、サイトの「保守性」も高まります。
今回はコメントア […]
h1とは？基礎知識と注意事項をご紹介します
h1が適切に設定されていないと、クローラーにWebページの内容をきちんと把握してもらえず、せっかく作ったコンテンツが低評価になる可能性があります。
ｈ1の基礎知識と設定方法について詳しく紹介するので、適切なh1を設 […]
【初心者向け】パンくずリストの意味と効果を解説【Webサイトの基本】
「パンくずリスト」についてご存知でしょうか。普段閲覧しているほとんどのWEBサイトには、このパンくずリストが設定されています。
パンくずリストにはユーザビリティとクローラビリティを向上させる効果があります。今回は、この […]
筆者紹介
株式会社doubLe ソリューション事業部 SEO部門 部門長
2017年4月新卒として株式会社doubLeに入社。
WEBデザイン、リスティング広告運用、SEO内部対策と幅広い分野の業務を経験し、2019年6月SEO部門の部門長に就任。
ファイナルSEOブログの運用を担当し、「効果の出るSEO対策」を追及している。ソリューション事業部の元気印として日々奮闘中。
