オリジナルデザインの404ページを作成する方法
404ページ とは
404ページとは、ユーザーがWebサイト上で存在しないページにアクセスしようとした（無効なリンクをクリックした、ページが削除されている、URL を間違えて入力したなど）ときに表示されるページです。
bingo!CMSでは、デフォルト以外にオリジナルデザインの404ページを作成できます。
オリジナルデザインを用意することで、Webサイトの世界観を損なうことなくユーザーを適切なページへ誘導できます。
なお、Googleが推奨する、404ページのカスタマイズに関するガイドラインは下記の通りです。
〜（略）〜
404 ページをわかりやすくカスタマイズすることにより、探している情報の場所をユーザーに知らせることができます。また、役に立つ他のコンテンツを提供して、サイト内をさらに探すよう促すこともできます。有用なカスタム 404 ページを設計するためのヒントは次のとおりです。
- ユーザーに対して、探しているページが見つからないことを明確に伝えます。親しみやすく平易な言葉を使用します。
- 404 ページを、サイトのその他の部分と同じデザイン（ナビゲーションを含む）にします。
- 最も人気のある記事や投稿へのリンクの他、ホームページへのリンクを追加します。
- 無効なリンクを報告する方法をユーザーに提供することを検討します。
カスタム 404 ページは、ユーザー専用に作成されます。このようなページは検索エンジンの観点からは役に立たないため、サーバーはページがインデックスに登録されないように、404 HTTP ステータス コードを返す必要があります。
bingo!CMSでの実装方法
ディレクトリ「404」を作成する
ディレクトリに「404」（http(s)://サイトURL/404/）を作成するとそのページは404ページとして認識されます。
別途.htaccess等を記述しなくても、ユーザーが存在しないページにアクセスした際に404ページを表示するよう処理されます。
まずは「404」というディレクトリ名のグローバルメニューを作成します。
bingo!CMS管理画面の メニュー&ページ管理 にある、 メニュー操作 ▼ のプルダウンから メニューを追加する をクリックします。
以下を除く設定は任意です。
前述のGoogleのガイドラインを踏まえた設定をおすすめします。
設定のポイント
- メニュー表示（PC・スマートフォン）
- 404ページをグローバルメニューに表示する必要はないので「非表示」にします。
- サイトマップ表示（PC・スマートフォン）
404ページはサイトマップ（HTMLサイトマップ）に表示する必要はないので「非表示」にします。 - sitemap.xmlへの出力
404ページはGoogle検索など検索エンジンの検索結果一覧に表示する必要はないので「出力しない」にします。 - ディレクトリ名
必ず「404」と入力してください。 - 初期テンプレート選択（PC・スマートフォン）
任意のテンプレートを選択します。
設定後は、確認画面へ進む から 保存 をクリックします。
ディレクトリ「404」が作成されました。
続いて、404ページのコンテンツを作成します。
404ページのコンテンツを作成する
まずは404ページの基本情報を設定します。
404ページの 基本情報 をクリックし、設定画面に入ります。
以下を除く設定は任意です。
設定のポイント
- NOINDEX,NOFOLLOW設定
404ページはGoogle検索など検索エンジンの検索結果一覧に表示する必要はないので「設定する」にチェックを入れます。
設定後は、確認画面へ進む から 保存 をクリックします。
404ページの基本情報が設定できました。
続いて、404ページのコンテンツを作成します。
ページ編集 をクリックし、ページ編集画面に入ります。
404ページのコンテンツは任意です。
前述のGoogleのガイドラインを参考にデザインしてください。
一例として、サイトマップユニットの設定方法をご紹介します。
ユニットモードのプルダウンから 機能ユニット を選択し、サイトマップユニット をドラッグ&ドロップでページに配置します。
サイトマップユニットのポップアップメニューから、ユニット編集 をクリックします。
サイトマップユニットの編集画面が開くので、そのまま何も設定せず 保存 をクリックします。
グローバルメニュー設定の『サイトマップ表示』で、「表示」を選択したメニューが自動的に出力されます。
タイトルやテキストなどを任意で設定し、404ページを完成させます。
最後にページを公開すれば完了です。