「分かりそう」で「分からない」でも「分かった」気になれるIT用語辞典

「404エラー」は「ホームページを見てるときに出てくるエラーで『そんなページは無いよ』なエラー」ね。
変なURLを指定した場合などに出てくるエラーです。

当たり前ですが、この404エラーが発生するとエラー画面が表示されます。
そして、そのエラー画面は元々用意されている画面です。

ところがですね。

ちょちょいのちょいとやると、404エラーが発生したときに、自分の用意したエラー画面を表示できるのです。
このときに表示される「自分で用意した404エラー画面」を「カスタム404ページ」と言います。
「カスタム404ページ」という表現自体は俗称ですけどね。「オリジナルの404エラーページ」や「独自の404エラーページ」などと言う場合もありますが、一番通りが良いのは「カスタム404ページ」だと思います。

例えば、わわわIT用語辞典（https://wa3.i-3-i.info/）で存在しないURLを指定すると、元々は以下のようなエラー画面が表示されていました（Google Chromeの場合）。



現在はカスタム404ページを設定してあるので、以下のようなエラー画面が表示されます。



そっけなかった404エラー画面が少しだけピヨった感じになりましたよね？

このようにエラー画面をサイトの雰囲気に合わせたり、あるいはメニューや人気のあるコンテンツを表示することによって、（例えURLの指定を間違えるようなおっちょこちょいが相手だとしても）せっかく見に来てくれた人を「もう少しだけ見てやっか」な気分にさせる効果が期待できます。

実際のカスタム404ページの設定は「.htaccess」という名前のファイルを使います。
やり方はそんなに難しくありません。

まずは404エラーのときに表示させるページを作って、サーバ上に置きます。
例えば「err404.html」という名前のページを作ったことにしましょう。



次に以下の内容を記載した「.htaccess」ファイルを用意します。

ErrorDocument 404 【表示させるエラーページ】

「err404.html」をカスタム404ページにしたい場合は

ErrorDocument 404 /err404.html

もしくは

ErrorDocument 404 https://wa3.i-3-i.info/err404.html

のように指定します。



最後に「.htaccess」ファイルをサーバ上に置きます。



これで完成です。
存在しないURLを指定して、自分の用意したエラーページが表示されるかを確認してください。

ちなみに「.htaccess」の記述には1つ注意事項があります。
先程

ErrorDocument 404 /err404.html

もしくは

ErrorDocument 404 https://wa3.i-3-i.info/err404.html

と書きました。
サーバ上にあるファイル（/err404.html）を指定するか、URL（https://wa3.i-3-i.info/err404.html）を指定するかの違いですが、実はこの2つは違う動きをします。

前者の

ErrorDocument 404 /err404.html

で指定した場合、カスタム404ページが表示されるURLは入力したURLそのままです。
例えばURLを「https://wa3.i-3-i.info/not-found.html」と入力していた場合、表示されるカスタム404ページのURLは「https://wa3.i-3-i.info/not-found.html」になります。

一方

ErrorDocument 404 https://wa3.i-3-i.info/err404.html

の指定は、ページが転送されるイメージです。
「https://wa3.i-3-i.info/not-found.html」を指定していた場合でも、あるいは「https://wa3.i-3-i.info/not-found2.html」を指定していた場合でも、表示されるカスタム404ページのURLは一律「https://wa3.i-3-i.info/err404.html」になります。

前者は指定ファイルが読み込まれて表示されるイメージ、後者は指定URLにリダイレクト（転送）されるイメージですね。
個人的には前者の、入力したURLがそのまま表示されている方が親切な気はしますが、お好みに合わせて使い分けてください。