サイトマップ（構成図）の作り方【エクセルで簡単に作れる】

ユーザーと検索エンジンにとって利便性の高いWebサイトに仕上げるためには「サイトマップ」が必要です。

Webサイト運営者の目線に立ってもサイトマップが役に立つ場面は多いので、早めに作成しておきましょう。

とはいえ、

『サイトマップでどうやって作成するの？』
『Webサイト全体の構造図を作るのは難しすぎる』

そんな声も聞こえてきます。

今回のコラム記事では、Webサイト全体の構造図(サイトマップ)の作り方について詳しく解説します。

サイトマップ（構成図）を作るメリットから事前準備、初心者でも簡単にサイトマップ（構成図）を作成できる便利なツールまでご紹介します。

また、コラム記事の後半ではエクセルで作ったサイトマップ（構成図）のテンプレートを無料ダウンロードできるようにするので、必見です！

サイトマップ（構成図）とは？

サイトマップ(構成図)とは、Webサイトにある各Webページの階層をわかりやすくまとめたものです。

構成図は名前の通り、Webサイトの地図のような役割があり、構成図をみるだけでどこにどんなコンテンツ・Webページがあるのか分かります。

通常、構成図はホームページ（Webサイト）制作を外注依頼したときに、制作会社が構成図を資料の一つとして用意してくれることがほとんどです。

Webサイトの制作開始から完成にいたるまで、この構成図をもとに作業を進めていくので、構成図が悪いと効果や成果がでにくい中途半端なWebサイトができる可能性があります。

サイトマップ（構成図）のメリット

サイトマップ（構成図）を用意することで以下のようなメリットがあります。

1. Webサイトの成功につながる
2. 自社ホームページを制作会社に依頼しやすくなる
3. ホームページの管理を複数のスタッフで共有できる

Webサイトの成功につながる

サイトマップ（構成図）があることで、Webサイトの成功につながります。
ここでいうWebサイトの成功とは、主に集客のことを指します。

Webサイトの設計（ディレクトリ構造）はSEO対策において大事な要素の1つです。

Webサイト内の構造が乱雑だと、検索エンジンが各Webページを正しく評価できず、結果的にSEOによる集客効果が期待できません。

また、Webサイト内の構造が乱雑の状態は、検索ユーザーからみても使い勝手が悪くて目的の情報がみつけづらいです。

サイトマップ（構成図）があることで、Webサイトの構造を整理整頓にすることができ、検索エンジンや検索ユーザーに使いやすいWebサイトになります。

つまり、サイトマップ（構成図）があることは、Webサイトの成功につながるのです。

制作会社に依頼しやすくなる

依頼者側がサイトマップ（構成図）を用意して制作会社に提出するのは、メリットがあります。

サイトマップ（構成図）があれば、制作会社に何を依頼するべきかが具体的にわかるため、制作会社は予算を立てやすかったり、見積もりが出しやすくなります。

ただ何となく『弊社のWebサイトのSEO対策をしてください』と依頼するよりもサイトマップと一緒に提出し、取り組むべきことをハッキリとさせた方がいいでしょう。

また、サイトマップがあれば制作会社が進めている内容がリアルタイムで把握できる点も大きなメリットです。

Webサイトの管理を複数のスタッフで共有できる

サイトマップ（構成図）があることで、Webサイトの管理を複数のスタッフで共有できます。

Webサイト内の状況を明確に把握できるので、SEOに効果が見受けられた場合もすぐに対応できるのです。

また、サイトマップ（構成図）を作成するツールにもよりますが、リアルタイムで連携を取りながら一つのWebサイトを複数人で操作することもできます。

Webサイトは作成したら終わりではなく、コンテンツの修正や追加が必要不可欠ですので、今後も複数のスタッフで管理し続けられるサイトマップ（構成図）を作っておくといいでしょう。

サイトマップ（構成図）の作り方【3つの手順】

ここからは、サイトマップ（構成図）の作り方を具体的に解説していきます。

1. 重要なWebページを書き出す
2. コンテンツをカテゴリごとに分類する
3. Webページの階層（ディレクトリ）を決める

上記の3つの手順でサイトマップを設置するまでの下準備が整います。

それぞれ順を追って解説するので見ていきましょう。

重要なWebページを書き出す

まずは、Webサイト内に入れるWebページを書き出すことから始めます。

具体例として、パーソナルトレーニングジムのポータルサイトを想定した構成図を作ります。

▼スマホの場合は横にスクロールしてご覧ください

上記のようにWebサイトに必要と思うWebページをあるだけ書き出します。

どのようなWebページが必要であるのか検討もつかない場合は、競合他社のWebサイトを参考にするといいでしょう。

コンテンツをカテゴリごとに分類する

続いて、さきほど書き出したWebページをカテゴリごとに分類していきましょう。

▼スマホの場合は横にスクロールしてご覧ください

大きくカテゴリ分けをしたあとは、それぞれ適したWebページを分類します。

Webページの階層(ディレクトリ)を決める

最後に、Webページの階層(ディレクトリ)を決めてまとめるとサイトマップ（構造図）の完成です。

第1階層であるトップページの下の第2階層に「会社について」「ボディメイクコラム」「入会の流れ」「店舗紹介」「トレーナー紹介」「価格」の6つの大まかなカテゴリがあります。

第2階層の下の第3階層に料金プラン内容だったり、ボディメイクコラムだったりそれぞれ並びます。

もちろんカテゴリに属しないWebページがあっても問題ありません。

「よくある質問」や「問い合わせ」などのWebページはカテゴリに属しておらず、1ページで成り立っているWebサイトも良くみかけます。

サイトマップ（構成図）を作る際の注意点

サイトマップ（構成図）を作る際に気を付けるべきポイントをまとめました。

• 階層を深くしすぎない
• ユーザー目線で考える
• ページの優劣をつける

それぞれ詳しく解説するので、サイトマップ（構成図）を作成する前に押さえておきましょう。

階層を深くしすぎない

サイトマップ（構成図）を作成する際に、階層を深くしすぎないことも重要なポイントです。

階層が深ければ、自分が知りたい情報にたどりつくまでに何度もクリックをしなければならないので、検索ユーザーが面倒に感じて離脱してしまうでしょう。

検索ユーザーが求めている情報を最低でも3クリックでたどりつくように、階層を浅めに設定しておくことが大切です。

先ほど例として挙げたパーソナルトレーニングジムのWebサイトは「3階層」です。

大規模なWebサイトでなければ「3階層」が理想だといえるでしょう。

Webページの優劣をつける

Webページに優劣をつけることで、読者をWebサイト内の「見て欲しいWebページ」に誘導できます。

たとえば、商品を販売するECサイトであれば、商品一覧ページを読者に見て欲しいはずです。

しかし、読者が検索結果に表示されたコラム記事などを観覧している場合、見て欲しいページにはたどり着かずに離脱してしまうケースも少なくありません。

そのようなときに、Webページに優劣をつけて商品一覧ページが目に入りやすい構造にすれば、読者を誘導できる可能性が高くなります。

商品一覧ページは、格下の階層に設置するのではなく、トップページの次の階層に設置するといいでしょう。

商品を販売するECサイトだけに限らず、企業のWebサイトであれば、求人募集のWebページを目立つ場所に設置するなどの工夫が大切です。

ユーザー目線で考える

Webページの優劣をつけることで、Webサイトの運営者が観覧してほしいWebページに誘導することができますが、それを第一にサイトマップ（構成図）を作ってしまうと、ユーザーの離脱率が高くなりやすいです。

『このページを見たあとは、どのような情報を知りたいのだろうか？』といったユーザーの思考になって考えるといいでしょう。

たとえば、ハンバーガーショップのWebサイトでハンバーガーを選択したあとに、ドリンクやサイドメニューが選べると便利なはずです。

企業の公式サイトであれば、運営者側としては「企業理念」や「実績」などを観覧してもらいたいはずです。

しかし、検索ユーザーは求人募集ページの内容をくわしく見たかったり、社員の1日の流れなどのWebページが気になったりしているかもしれません。

Googleのアクセス解析ツールを使用すれば、ユーザーの検索ニーズに応えられるWebサイトに仕上がるでしょう。

ツールを使ってサイトマップ（構成図）を作成する方法

ツールを使用すると簡単にサイトマップ（構成図）を作成できます。

ここでは、サイトマップ（構成図）を作成する際に使えるツールをご紹介します。

• エクセル
• パワーポイント
• Cacoo
• Adobe XD
• Xmind

それぞれの特徴やおすすめのポイント、どのようなWebサイトに適しているかを解説するので見ていきましょう。

エクセルで作成する

エクセル（Excel）は、セルを上手く活用すると図形なしでも構成図が完成します。

カテゴリを追加したり削除したりしやすい点が最大の魅力です。

また、構成図に加えてWebページのURLやコンテンツの概要、ページタイトル、メタディスクリプションなどの情報もまとめて管理できます。

パワーポイントなどのツールでは、Webサイトの規模が大きくなると扱いづらくなりますが、エクセルならば100ページほどであれば問題なく管理できる点もうれしいポイントです。

エクセルは、操作に慣れている方が多いメリットもあります。

パワーポイントで作成する

パワーポイント（Power Point）は、図形を用いるため視覚的にWebサイト全体の構造を把握しやすくなります。

プレゼンテーションの際に使用されるツールですので、使い勝手のよさも魅力の一つです。

パワーポイントはエクセルと同様で、制作会社にWebサイトの制作依頼する際に共同編集や情報の共有をしやすくなります。

ただし、図形を用いるため大規模なWebサイトをひとまとめにするのは至難のワザです。

50ページ以内の中規模なWebサイトにパワーポイントを使用すると良いでしょう。

Cacooで作成する

Cacooは、サイトマップ（構造図）にピッタリなテンプレートを使用できるツールです。

SlackやGoogleドライブなど、Cacoo は他のツールと連携をとれる機能が搭載されています。

Cacooにしかない魅力は下記の通りです。

• リアルタイムで共同作業ができる
• メンバーの編集履歴を残せる
• リアルタイムで会話ができる

なお、Cacooは無料版と有料版が用意されており、無料版では6シートまでしか作成できないので、大規模なWebサイトを運営している方は有料版を使用するといいでしょう。

Adobe XD

Adobe XDは、ホームページ関係者と連携を取りながら作業を進められるツールです。

Adobe XD はWebデザイン専用のツールですので、視覚的にクオリティの高いサイトマップ（構成図）を作成できます。

同じサイズの形を複数作るサイトマップ（構成図）向きの機能が整っているので、ストレスなく作業ができると好評です。

• パスワードによる保護
• ビデオを録画
• ドキュメントの履歴管理
• デザイントークン
• コメントとメンション

Adobe XD は上記通り機能性に優れているので、サイトマップ（構成図）以外の作業にも活躍します。

Xmind

Xmindは、自動でバランスを微調整してくれるので、初心者でも作成しやすい点が最大の魅力です。

『パワーポイントでは上手くサイトマップ（構成図）を作成できなかった』という方は、Xmindを使用するといいかもしれません。

構成図用のテンプレートが複数そろっているので、あとは文字を入力するだけで完成します。

ハイクオリティのツールを完全無料で使用できることもXmindの魅力のひとつです。

まとめ

今回のコラム記事では、サイトマップ（構成図）について詳しくまとめました。

サイトマップ（構成図）は、Webサイトの完成度に大きく関わってくる重要なものです。

一度、作成しておけば自社サイトを複数のスタッフで管理するときにも連携がとれます。

最後に、サイトマップ（構成図）についておさらいをしましょう。

• ユーザー目線に立ってサイトマップ（構成図）を作ること
• 階層は浅くして検索ユーザーにとって利便性の高いWebサイトにする
• サイトマップ（構成図）を作るツールはエクセル・パワーポイントがおすすめ
• ハイクオリティなサイトマップ（構成図）を作るにはAdobe XD・Xmindなどのツールを使用する

リアルタイムで共同作業ができたり、デザイン性が高く、視覚的にWebサイトの構造を理解しやすかったりといった優れたツールもあるので使用してみましょう。