ホームページ制作会社の依頼・相談・比較ならWeb幹事

お急ぎの方は電話で相談 (平日10時〜21時)

03-6457-3550

メールでのご相談は24h対応!!

無料でHP制作の相談をする

まずは制作会社に見積もりを依頼

お見積もりを依頼

お急ぎの場合はお電話でもご対応!

03-6457-3550

サイトマップ(構成図)をエクセルで簡単に作成する方法【テンプレート付き】

ホームページ制作の際に、重要な資料の1つ「サイトマップ(サイト構成図)」

特にリニューアルの際に既存のコンテンツを整理するのに非常に重宝します。


しかし、業界的にサイトマップのフォーマットはバラバラ。

  • サイトマップってどうやって作るの?必要なの?
  • 簡単にサイトマップをつく方法ないの?
  • 専用のツールを使わずエクセルやパワポ作りたい・・・

とお悩みの担当者の方も多いかと思います。


本記事では、そもそもサイトマップはどうやって作成するのか?

というところから、Excel(エクセル)を使った簡単作成法まで丁寧にご紹介します。


「初めてホームページをリニューアルする」「コンテンツの量が多いのでサイトマップを作って整理をしたい」という方は是非実践してみてください。

記事の最後にはエクセル形式のサイトマップテンプレートをプレゼントしております。お気軽にダウンロードしてください。

目次

  1. 1. サイトマップ作成のメリット
    1. 1-1. そもそもサイトマップ(サイト構成図)とは?
    2. 1-2. サイト構造全体を把握できる
    3. 1-3. プロジェクトメンバーと意思疎通がしやすくなる
  2. 2. サイトマップの作り方(下準備編)
    1. 2-1. 必要なページを書き出す
    2. 2-2. ページのコンテンツをカテゴリ別に分類
    3. 2-3. ページの階層(ディレクトリを決める)
  3. 3. エクセルを使ってサイトマップを完成させよう
    1. 3-1. エクセルを使ったサイトマップのメリット
    2. 3-2. エクセルを使ったサイトマップの作り方
  4. 4. エクセル以外に簡単にサイトマップを作る方法
    1. 4-1. パワーポイント
    2. 4-2. cacoo
  5. 5. サイトマップをエクセルで作成する方法 まとめ
    1. 5-1. エクセルのサイトマップテンプレートをプレゼント

サイトマップ作成のメリット

まずはサイトマップを普段使わない初心者の方向けに簡単にサイトマップについてご説明したいと思います。


そもそもサイトマップ(サイト構成図)とは?

通常、私たちが閲覧しているホームページは複数のページで構成されています。


例えば一般的な「コーポレートサイト」であれば、一番最初に見るTOPページから会社概要・事業内容・お問い合わせなど複数のページが用意されています。

これらのページは並列に存在するのではなく、樹形図のように「階層状」になっています。(下の図形を参照)

サイトマップ(サイト構成図)とは?


この階層は URL を付ける際に利用され、下記のように「/」で区切られて階層が出来ていきます。

  • TOPページ:https://web-kanji.com/
  • 事業内容ページ:https://web-kanji.com/service
  • 事業その1ページ:https://web-kanji.com/service/no1


この階層を含めた、サイトの全体像を表すのが「サイト構成図(本記事ではサイトマップ)」と呼びます。


※狭義の「サイトマップ」は、SEO対策などで使用されるXMLサイトマップや、サイトマップページに使うHTMLサイトマップなどを指します。本記事ではサイト構成図のことをサイトマップとして扱います。


サイト構造全体を把握できる

サイトマップの最大のメリットは「サイト全体の構成が把握しやすくなる」ということです。


先ほど使った図のように7ページ程度のホームページであれば、全体構造を把握するのは簡単です。

しかし、ページ数が数十〜数百ページになってくると、しっかり整理していないと重複ページができたり、逆に必要なページが抜け落ちたりします。


サイトマップがあれば、全体の構成が非常に把握しやすくなります。


プロジェクトメンバーと意思疎通がしやすくなる

ホームページ制作会社に制作を依頼する場合、見積もり依頼前にサイトマップを提出すると非常に喜ばれます。

「どんなページを・どれくらい制作するのか」によって大きく見積もり金額が変動します。

そのため、事前にサイトマップを提出しておくと、制作会社が見積もりがしやすくなります。


また発注後プロジェクトが開始しても、サイトマップがあれば制作会社との意思疎通が図りやすいです。

これは内部のメンバーのみでホームページ制作を行う場合も同じです。


プロジェクトを円滑に進めるのに「サイトマップ」は非常に重要な資料の1つです。


サイトマップの作り方(下準備編)

ここからは実際に、サイトマップの作り方をご紹介していきます。

本記事では、「新卒向けの採用サイトを制作する」時を想定してサイトマップを作ってみます


必要なページを書き出す

まず、これまでお話した「階層」の話は一旦無視して、採用サイトに盛り込みたいコンテンツをどんどん掲載していきます。


  • TOPページ
  • 社員インタビュー
  • 社長メッセージ
  • 企業理念
  • 先輩社員の声
  • 会社の強み
  • データで知る株式会社〇〇(インフォグラフィック)
  • 事業紹介
  • よくある質問
  • 募集要項
  • 社員の1日
  • 採用セミナー情報
  • エントリーページ


ページを作成していく時「どのようなページが必要かどうかわからない」という方は他社企業の採用サイトをチェックするのがオススメです。


他社企業のサイトは少なくとも5サイト、余裕があれば10サイトほどチェックすると良いでしょう。

(この段階の後に、新しく追加したいページが出てきても差し込むのが難しいため、しっかり必要ページを出し切っておくのが狙いです。)


「そのページは本当に必要なの?」といったことは考える必要はありません。

とにかく数をたくさん出して見るのがGoodです。


※ちなみに、複数人で会議室などで行うときは付箋に書いてホワイトボードに貼っていくと、後で整理しやすいのでオススメです。


結果、採用サイトに入れたいコンテンツはこのようになりました。

ホームページに必要なコンテンツリスト



ページのコンテンツをカテゴリ別に分類

ある程度必要なページを出し切ったら、今度はそのページを「意味のまとまり(カテゴリ)」ごとに分類してみましょう。


今回は採用サイトのため、下記のような「まとまり」に分類できます。


  • 会社について
  • 事業について
  • 社員について
  • 採用について


当然、この「カテゴリ」に属さないページも出てきます。

その場合は無理にカテゴリに入れず、端によけておきます。


考えた結果「やっぱり、このページは必要ない」と判断したページもこの段階で消してしまいましょう。

(逆に追加したいページがある場合はこのタイミングで追加します。ページを追加できる最後のタイミングです)


リストアップしたコンテンツを分類


ここまでくれば、ほとんど下準備は完成です。



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

最後に、分類したコンテンツをホームページを構成する「ページ」として階層にしていきます。

ここで重要なのは

会社について・事業についてなど分類した「まとまり」自体も1ページとしてサイトマップに入れることです。


具体的には「会社について」というページを設けて、その下の階層に「企業理念」「会社概要」などのページを作成します。

そうしないと下記の図のようにコンテンツが並列に並んでしまい、せっかくコンテンツを分類した意味がなくなってしまいます。

サイトマップが分かりにくい例


階層に分けてコンテンツを並べ終わったら、簡易版サイトマップの完成です。

簡易版サイトマップ


下準備はこれで十分です。

今回例にあげた採用サイトくらいの規模のサイトであればこれで十分機能します。


しかし、これ以上階層が増えたり、数十ページにも及ぶホームページだとサイトマップを図で作るのがかなり難しくなってきます。

(このサイトマップはパワーポイントで作成していますが、かなりギリギリでした。。。)


ポイント:階層は深くしすぎない

ここで、注意が必要なのは階層を深くしすぎないことです。


階層を深くしすぎるとホームページを閲覧している人が目的のページにたどり着くまでに何度もクリックしなければなりません。

今回のホームページの規模の場合は「3階層」くらいにとどめておくのが理想です。


ホームページの規模によって、理想の階層は変わるのですが、「できるだけ少ない階層にする」ことを意識しておくようにしましょう。


エクセルを使ってサイトマップを完成させよう

先述のように、簡易なホームページであれば、下準備で作成したツリー状のサイトマップの方が分かりやすい場合もあります。

しかし、エクセルで作成したサイトマップはツリー状のものにはないメリットがあります。


エクセルを使ったサイトマップのメリット

ページ数が多くても一覧性を担保できる

先ほど具体例にあげた採用サイトは20ページ程度の小規模なホームページであったため、エクセル以外でサイトマップをつくっても問題ありませんでした。

しかし、50ページを超えるコーポレートサイトや数百ページに及ぶ オウンドメディア など、中規模のホームページになってくるとパワーポイントなどのツールだと管理が難しくなってきます。


エクセルであれば100ページ程度なら簡単に一覧できます。


サイトマップに変更があったとき対応しやすい

下準備でつかったツリー状のサイトマップだと、変更があったときに書き直すのが非常に面倒です。

どうしても図でサイトマップを表しているため、ページの追加やページの階層を変更したい場合に、毎回サイトマップの図を整えなおさないといけません。

エクセルで作成していれば、行を追加・削除するだけに簡単にページを追加・変更・削除できます。


細かい付加情報を一緒に管理できる

サイトマップでは下記のような情報も一緒に管理しておくと非常に便利です。

  • 該当ページのコンテンツの概要
  • ページの URL
  • ページのタイトル
  • ページのメタディスクリプション


ツリー状のサイトマップだと、管理できる情報量に限界があります。

エクセルで作成していると簡単に管理できます。(詳細は後述)



エクセルを使ったサイトマップの作り方

ここまで来れば、あとは下準備で作ったものをエクセルに並べるだけです。

ページを縦軸(行)にならべ、階層やその他の付随情報は横軸(列)に並べましょう。

ページの隣に番号をふっておくと、全部で何ページあるのかが分かりやすく便利です。



完成すると下記のような一覧表になります。

記事の最後でサイトマップのテンプレートがダウンロードできます。是非ご活用ください。

エクセル版サイトマップ


エクセルでサイトマップを作成する際、いくつか注意点があります。

以下ご説明していきます。


列をうまく使って階層が分かるように

下準備した階層がしっかり分かるようにすることが重要です。

  • 第一階層(TOPページ):1列目
  • 第二階層(会社について):2列目
  • 第三階層(企業理念):3列目

のように列をずらして、わかりやすくするようにしましょう。

サイトマップの階層分け

このように階層によって色分けしておくと、見やすくてGoodです。


ページの内容やタイトルを決めておく

  • ページの URL
  • コンテンツの概要
  • ページタイトル
  • メタディスクリプション
  • メタキーワード
  • 備考


あたりを管理しておくと良いでしょう。

このように付加情報も一緒に管理できるのが、エクセルでサイトマップを作成する最大のメリットです。


※ページタイトル・ディスクリプション・キーワードに関してはサイトの開発の時に使用するものなので、必ずしも必要ありません。

詳しくは基本的なタイトルタグとメタディスクリプションの考え方(外部サイト)をご覧ください。

(今回メタディスクリプションに関しては、記載を割愛しております。)



エクセル以外に簡単にサイトマップを作る方法

エクセルでサイトマップを作成するのが最もオススメですが、エクセル以外にも簡単に作成する方法があります。


パワーポイント

簡易版サイトマップ

今回サイトマップを作る際の下準備はパワーポイントを活用して作成しました。

具体例であげた採用サイト程度の規模であれば、パワーポイントを用いて作成しても問題ないかと思います。

目安として30ページくらいまではパワーポイントでも十分作成可能です。


cacoo

cacoo


  • 複数人で共同編集したい
  • サイトマップ以外にもフローチャート・ワイヤーフレーム(サイトの設計図)なども作りたい
  • 他サービス(SlackやGoogle Driveなど)と連携したい

上記のような場合は、cacooがおすすめです。


サイトマップやフローチャート用のテンプレートも用意されており、パワーポイント感覚で初心者でも簡単に作成ができます。


※ただし、無料プランの場合6シートまでしか作成できません。

cacooの有料版の価格表についてはこちらをご覧ください。(外部サイト)



サイトマップをエクセルで作成する方法 まとめ

サイトマップを作成しておけば、ホームページの全体像が簡単に把握できます。

リニューアルの検討時や制作時に非常にも重宝します。

(制作会社に依頼する場合も、ほぼ全て制作会社が独自に作成していると思います。共有してもらいましょう)


また特別なツールを使わなくても、普段お使いのExcel(エクセル)ファイルで簡単に作成が可能

本記事でご紹介したポイントに注意して作成していただければ、非常に見やすく・使いやすいサイトマップが完成します。


ぜひ実践してみてください!


エクセルのサイトマップテンプレートをプレゼント

本記事で使用したサイトマップのテンプレートを、Excel(エクセル)形式でプレゼントいたします。

下記のページからダウンロードが可能です。Excel形式のためすぐに編集・修正が可能です。

お気軽にダウンロードしてください。


サイトマップ・サイト構成図 テンプレート(Excel形式)のサムネイル サイトマップ・サイト構成図 テンプレート(Excel形式) ホームページのサイトマップ(サイト構成図)のテンプレートです。Excel形式ですぐに編集・修正できるので、ホームページ制作会社に発注の際にご活用ください。 無料でダウンロードする