ECサイトのサイトマップといっても、実は用途別に3種類あります。
この記事では主なECサイトのサイトマップの概要やメリット、作り方などをご紹介します。
サイトマップって何…？必要なの…？
そんなに難しく考えなくても、ツクル君もサイトマップを見たことがあると思いますよ。改めて今日はサイトマップについて学んでいきましょう。
ECサイトのサイトマップは主に3種類ある
ECサイトのサイトマップは、「どのような対象に向けた・何のためのサイトマップなのか」という観点から考えると、主に以下の3種類あります。
- ・サイト制作者向けの構成図としてのハイレベルサイトマップ
- ・ユーザー向けの案内図としてのHTMLサイトマップ
- ・検索エンジン向けのSEO対策としてのXMLサイトマップ
次の章からは、3種類のサイトマップの特徴やメリット、具体例について説明していきます。
【制作者向け】構成図としてのハイレベルサイトマップ
まず1つ目のハイレベルサイトマップとは、ウェブサイト全体の構造を大まかに示した図のことです。
ECサイトの制作者や運営者が、サイト全体の構造を把握し戦略立案や分析を行うために作成する設計図（構造図）といえます。
ページやコンテンツの階層関係を可視化しているので、コンバージョンに向けた導線を考えながらサイト設計を進めることができ、後の運営やマーケティング施策の検討にも役立ちます。
構成図としてのハイレベルサイトマップのメリット
ハイレベルサイトマップは、サイト全体の構造や階層を可視化したものなので、サイトのコンテンツ構成を一覧で把握でき、設計時にコンテンツの重複や不足を発見しやすくなります。
また、ページ間の階層関係や導線が明確になるため、ユーザビリティの改善に役立つでしょう。
つまり、ハイレベルサイトマップがあれば、制作者がサイト全体の骨格をイメージしやすく、ユーザーにとってより良いサイト設計につながるといえます。
構造図としてのハイレベルサイトマップの例
下記はECサイトのハイレベルサイトマップの例です。
大まかにコンテンツを配置して、全体像がわかるようになっています。
構造図としてのハイレベルサイトマップの作り方
Webサイト全体を把握するためのハイレベルサイトマップはどのように作るのでしょうか。
ここからは、作り方をご紹介します。
1.必要なコンテンツを洗い出す
ハイレベルサイトマップ作成の第一歩は、サイトに必要なコンテンツを全て洗い出すことです。
この段階では本当に必要なのかどうかはまだ考えず、できるだけ多くのコンテンツ案を列挙することが大切です。
例えば、ECサイトでは以下のようなコンテンツが挙げられます。
- ・トップページ
- ・商品ページ
- ・特集ページ
- ・会員登録ページ
- ・ショップの紹介ページ
- ・利用ガイド（支払い・配送について）
- ・お問い合わせページ
- ・利用規約 など
まずはこうしたコンテンツを、他社のECサイトを見るなどして漏れなく書き出しましょう。
この後の段階で、不要なものは削除していきます。
2.コンテンツをカテゴリ分けし階層化する
洗い出したコンテンツをリストアップするだけでは、ハイレベルサイトマップの役割であるサイト全体の構造はまだ把握できません。
そのためコンテンツを機能別や目的別にカテゴリ分けしたうえで、上位カテゴリの下に下位カテゴリを設けて階層化する必要があります。
ECサイトであれば以下のようなカテゴリ分けが考えられます。
- ・商品関連のページ
- ・購入関連のページ
- ・ショップ情報関連のページ
- ・その他 など
カテゴリを決めたらコンテンツをカテゴリごとに振り分けていき、さらにカテゴリ内で「どのコンテンツ（ページ）の下にどのコンテンツ（ページ）が来るのか」といった階層をツリー状で考えます。
このようにカテゴリ分けと構造の階層化を行うことで、サイト全体の構成をわかりやすく整理できます。
3.主要なCV(コンバージョン)ページを明確化
CV(コンバージョン)とは、サイト運営者側がユーザーに望んでいる行動のことで、ECサイトにおけるCVは商品購入といえます。
手順1でコンテンツを洗い出し、手順2でカテゴリ分けと階層化を行ったら、次にCVにつながるページを特定していきます。
CVページを明確化するとは具体的に、以下のような作業です。
- ・洗い出したコンテンツ（ページ）の中から、CVに必要なコンテンツや関連のものを選別する
- ・ツリー状のサイト構造図の中で、CVページとその関連ページの位置関係を明示する
手順1と2で整理した内容を基に、CVページとその関連ページを特定することで、スムーズなCVにつなげるサイトを設計していきます。
CV候補ページへの導線を検討する
CVに関連する候補ページを特定できたら、次はどのような導線でユーザーを誘導するかをハイレベルサイトマップ上で検討します。
ユーザーがWebサイトにアクセスしてから、CV候補ページに行き着くまでの最短経路を示しつつ、補助的な経路も含めて考えましょう。
例えば、CVが「商品購入ページ」の場合の主な導線:は「トップページ」→ 「カテゴリページ」→ 「商品ページ」→「購入手続きページ」というのが最短経路とされる主な導線です。
補助的な導線として、「特集ページ」→ 「関連商品ページ」→ 「商品ページ」→ 「購入手続きページ」というパターンも考えられます。
メインの導線だけでなく、CVにつながるような導線をできる限り挙げてみましょう。
CVページへの主要な導線と補助的な導線を明確化することで、ユーザーの行動を予測しやすくなり、サイト構造の検討が進められます。
ハイレベルサイトマップを作ったらディレクトリマップも必要
全体像であるハイレベルサイトマップを作成したら、ページの詳細が把握できるようなディレクトリマップを作成します。
ディレクトリマップとは、ハイレベルサイトマップで決まった大まかなサイト構造に基づき、さらに詳しい各ページの内容を書いた資料のことです。
エクセル（スプレッドシート）で一覧表を作成するのが一般的でしょう。
例えば「会社概要」ページについてディレクトリマップを見れば、ページのURLや会社の沿革・組織図といったページコンテンツの内容、ページタイトルといった詳細が把握できます。
ハイレベルサイトマップで全体の骨格を決め、ディレクトリマップでさらに肉付けをしていくというイメージで、この2つの資料はセットで用意する必要があります。
【ユーザー向け】HTMLサイトマップ
HTMLサイトマップとは、ECサイトの訪問者に向けて、サイト内の商品カテゴリやページの一覧を分かりやすく表示するコンテンツです。
サイトマップだけのページを別途用意するパターンや、トップページのフッター（ページの一番下）で表示するパターンが多いです。
サイトを訪れたユーザーにサイト内のコンテンツの全体像を伝える案内役の役割であるため、HTMLサイトマップは訪問者目線で作成する必要があります。
案内図としてのHTMLサイトマップのメリット
ECサイトにHTMLサイトマップを設置することで、訪問者は商品カテゴリやサービスの全体を一目で把握することができます。
ユーザーが目的のページへスムーズにアクセスできるようになるため、ユーザビリティの改善に役立つでしょう。
また、ユーザーが目的のページに訪れやすくなることでサイト内の回遊率が上がり、結果として購入のための導線強化につながります。
もしHTMLサイトマップがない場合、訪問者は目的のコンテンツを探すのに手間取ってしまい、見つからないことで離脱率が高くなる恐れがあります。
ユーザーがサイト上で迷子にならないためにも、購入などのコンバージョンを向上させるためにもHTMLマップの設置は必須といえます。
案内図としてのHTMLサイトマップの例
下記が実際のHTMLサイトマップの例です。
サイトの主なコンテンツが一覧になっているので、ユーザーは自分の目的とするページに辿りつきやすくなります。
案内図としてのHTMLサイトマップの作り方
HTMLサイトマップを作成する手順はおおよそ以下の通りです。
- 1.表示するページ・コンテンツを選定する
- 2.カテゴリ分けとサイトツリーを作成する
- 3.わかりやすいデザインを心がける
HTMLサイトマップの作成では、まず表示するコンテンツを選定します。
その際、ユーザーが重視するのはどのようなコンテンツなのか、ユーザーの目的も加味しながら考えます。
サイトにあるすべてのページを網羅する必要はないので、ユーザーが目的のページに辿り着きやすくするため、主要なページや代表的なコンテンツのみを選定しましょう。
その後、選定したページをカテゴリ分けし、コンテンツの階層構造(ツリー構造)を考えます。
ユーザーが自然な流れで目的のページに辿り着けるよう、親子関係を明確にすることが大切です。
どのような階層がいいのかわからない際は、他社のサイトマップを参考にしましょう。
その後、デザインを決める際は、わかりやすいデザインを心がけることが大切です。
読みやすいフォントにしたり、階層によって文字の太さを変えたりなど、一目で構造がわかる直感的なデザインにしましょう。
【SEO対策向け】XMLサイトマップ
XMLサイトマップとは、GoogleやYahoo!といった検索エンジンが、Webサイト内の各ページを見つけやすくなるためのXMLファイルです。
検索エンジンはクローラーと呼ばれるプログラムが、インターネット上のさまざまなWebサイトを巡回してページの内容を収集しています。
そのためXMLサイトマップにWebサイトの「各ページのURL」や「最終更新日時」などを記載することで、クローラーがそのサイト内の新しいページや更新されたページを確実に発見できるようになります。
クローラーが情報を取得すれば、ユーザーの検索結果に反映されるようになる仕組みです。
ECサイトでは商品ページが頻繁に追加・更新されるため、検索結果に反映されるためにもXMLサイトマップの設置が強く推奨されています。
SEO対策としてのXMLサイトマップのメリット
XMLサイトマップを作成することで、検索エンジンがサイト内のコンテンツを確実にクロールできるようになります。
具体的には、Webサイト側に以下のようなメリットがあります。
- ・新規作成したページを素早くクロールしてもらえる
- ・コンテンツの最終更新日を記載しているので、更新頻度の高い質の良いコンテンツとして検索エンジン側に評価してもらえる
- ・ページの重要度合いを数値化して設定できるため、重要なページを優先的にクロールしてもらえる
XMLサイトマップがない場合、検索エンジンがサイト内の一部のページしかクロールできず、新しいコンテンツが適切に評価されない恐れがあります。
自社のWebサイトが適切に評価されないと、上位表示されるためのSEO対策にも影響が出てしまうでしょう。
特に大規模サイトの場合、内部リンクだけではすべてのページをクロールしきれない可能性があるので、XMLサイトマップを設定するのが望ましいです。
SEO対策としてのXMLサイトマップの作り方
XMLサイトマップは、主に3つの作り方があります。
カラーミーショップのようなサービス（ECプラットフォーム）を利用してECサイトの構築をしている場合は、簡単に作成ができます。
ECプラットフォームの生成機能で作る
最も手軽な方法は、利用中のECサイト作成サービス(ECプラットフォーム)に備わっているXMLサイトマップの自動生成機能を活用する方法です。
カラーミーショップなどの主要なサービスには、この機能が標準で搭載されていることが多いでしょう。
自動生成機能を利用することで、初心者でも簡単に最新のXMLサイトマップを作れます。
また、プラットフォーム側でサイトマップの仕様に沿った適切な出力が可能なので、ミスが起きにくいという利点もあります。
専用ツールで作る
利用中のECサイト作成サービスに生成機能が無かったとしても、XMLサイトマップを作れる専用ツールがあります。
例えば「Xml-SiteMaps.com」というツールであれば、無料で最大500ページ分のXMLサイトマップが、ワンクリックで自動生成できます。
英語表記ですが、簡単な操作なので試してみるのがおすすめです。
他にも日本語に対応しているツールなど、さまざまなXMLサイトマップ作成ツールがあるので、使いやすいものを探してみましょう。
手動で作成する
XMLサイトマップは、テキスト形式のファイルであるため、手作業でXMLサイトマップを作成し、サーバーにアップロードすることも技術的には可能です。
ですが、手動でXMLサイトマップを作成・更新する場合、更新を忘れたり人的ミスが発生したりといったデメリットがあります。
そのため、Googleの公式アナリストからも大規模なサイトにおいて手動によるXMLサイトマップの作成は推奨されていません。
できるだけツールを使って、サイトマップを自動生成するのが望ましいでしょう。
まとめ
ECサイトを適切に運営するには、制作者・ユーザー・検索エンジンの3つの観点から、サイトマップを作成する必要があります。
3種のサイトマップを作り分けることで、制作者・ユーザー・検索エンジンの3方向に向けてECサイトを適切に構築・運用できるようになります。
サイトマップの重要性を理解し、欠かせない3つの種類を押さえることが、ECサイト運営の第一歩となるでしょう。
▼こちらの記事も読まれています▼
