まずWEBサイトで質の高いコンテンツを生み出すには、WEBサイトを閲覧するユーザーが目的のページに移動しやすくするための設計が必要です。
そこで重要な役割を担うのが、サイトツリーの作成。本記事では、サイトツリーを作成する重要性やメリット、作成方法などを解説します。
WEBサイトの成果に満足されていますか？
- 下記についてお悩みを抱えていらっしゃいませんか？
- WEBサイトの制作からプロモーションまでの一貫した対策ができていない
- 競合との差別化を図りたいが、強みをうまく表現できない
- 開設後の長期的な運用計画が立っていない状態
上記お悩みをWEBサイト制作専門コンサルタントが解決いたします。
目次
サイトツリーとは
はじめにサイトツリーとは、サイト内にあるコンテンツをツリー形式の構造にしたものです。まずサイトツリーは、一番上にトップページを配置します。次に、カテゴリの順でツリー形式に各ページが下や横方向へ展開します。
このように、ツリー形式の構造にします。そうすることで、トップページと各ページのつながりが俯瞰できるようになります。
サイトマップとの違いは？
まずサイトツリーは別名「サイトマップ」とも呼ばれています。どちらもおおむね同じ意味合いです。特に、ユーザーや検索エンジンにサイト構造の情報を共有するために作成されています。
サイトツリーとディレクトリマップの違い
またサイトツリーと似た意味を持つ専門用語に「ディレクトリマップ」があります。このディレクトリマップは、サイト全体を把握するという点ではサイトツリーと同じです。ですが、サイトツリーと違ってWEBサイト上には掲載されません。
そしてディレクトリマップは、WEBサイト内の全ページのURL、タイトル、記事内容がまとめられた一覧表になっています。
まずディレクトリマップの多くは、WEBサイトの制作管理や業務担当者間の情報共有のために作成されています。そのため、ディレクトリマップがあることで、コンテンツの維持管理や運営がスムーズになるというメリットがあります。
サイトツリーを作成するメリット
次に、サイトツリーを作成するメリットについて解説します。メリットは大きくわけて3つあります。
- サイト全体を把握できる
- サイトをメンバー間で共有できる
- サイトをユーザーや検索エンジンに認識してもらえる
では、それぞれ解説します。
サイト全体を把握できる
まずサイトツリーを作成すると、WEBサイトの全体像を把握しやすくなります。例えば、無計画にWEBサイトのページを増やして大規模なサイトした場合。どのようなコンテンツがあるのかを見失います。そして、コンテンツの重複やコンテンツ作成に漏れが発生する恐れがあります。
しかし、あらかじめサイトツリーでWEBサイトのあらすじを決めておけば、効率的にコンテンツ作成業務を進行できるようになります。
サイトをメンバー間で共有できる
次にサイトツリーは、WEBサイト制作のプロジェクト進行の重要な資料として役立ちます。
例えば、サイトツリーがあることで、WEBサイト制作会社の見積りから制作時に「どれだけのページにどのくらいの時間がかかるか」のシミュレーションがしやすくなります。
また、ページの統合、切り分け、ディレクトリ構造などの情報共有も可能です。よって、課題に対してのとらえ方やサイトの方向性もブレが少なくなるでしょう。そして、スムーズにプロジェクトが進められるようになります。
サイトをユーザーや検索エンジンに認識してもらえる
そしてサイトツリーには、ユーザーや検索エンジンのクローラーにWEBサイトの内容を伝える役割があります。
まず検索エンジンのクローラーはサイトツリーがあることで、サイト構造を簡単に把握できるようになります。それにより、ユーザーはサイトツリーがあることで目当てのコンテンツにたどり着きやすくなります。
WEBサイトの成果に満足されていますか？
- 下記についてお悩みを抱えていらっしゃいませんか？
- WEBサイトの制作からプロモーションまでの一貫した対策ができていない
- 競合との差別化を図りたいが、強みをうまく表現できない
- 開設後の長期的な運用計画が立っていない状態
上記お悩みをWEBサイト制作専門コンサルタントが解決いたします。
サイトツリーの作成方法
さて、ここではサイトツリーの基本的な作成方法を解説します。作成方法は以下の手順となっています。
- 必要なページをすべて洗い出す
- ページをカテゴリ分けする
- ツリー状に落とし込む
- 全体像を確認する
では、それぞれ解説します。
必要なページをすべて洗い出す
はじめにサイトツリーを作成するには、WEBサイトに必要なページをすべて洗い出す必要があります。まずは、WEBサイトに必要な要素をすべて書き出していきましょう。
例えば、一般的な企業のサイトツリーを作成する場合、次のようなページが必要となります。
- トップページ
- 最新情報
- 最新情報の詳細
- 企業情報
- 企業概要
- 企業理念
- 事業所住所
- 代表挨拶
- スタッフ紹介
- プロダクト（商品）
- プロダクトA
- プロダクトB
- 実績
- 採用情報
- 採用情報の詳細
- お問合せ
- ブログ
このように必要なページは、業種や目的によって変わります。そのため、競合他社のサイトを参考にしてみるとよいでしょう。
ページをカテゴリ分けする
次に必要なページをすべて洗い出したら、ページをカテゴリ分けします。そして、先ほどのページをカテゴリ別に分けると、以下のようになります。
| 第一層 |
トップページ |
|||||
|---|---|---|---|---|---|---|
| 第二層 | 最新情報 | 企業情報 | プロダクト | 採用情報 | お問合せ | ブログ |
| 第三層 | 最新情報の詳細 | ・企業概要・企業理念・事業所住所・代表挨拶
・スタッフ紹介 ・実績 |
・プロダクトA・プロダクトB | 採用情報の詳細 | ||
まず階層が深く、何回もクリックしなければ到達できないコンテンツは、ユーザーにとって使い勝手が悪いサイトだと判断されます。そのため、三階層程度にするのが理想です。
ツリー状に落とし込む
続いて、ページのカテゴリ分けができたら、ページをツリー形式に落とし込みます。そしてツリー図は後述する「おすすめのサイトツリー作成ツール7選」を利用して簡単に作成できます。
全体像を確認する
最後にツリー図の作成が終わったら、コンテンツの重複や漏れがないか、全体像で確認しましょう。サイトツリーをチェックする際は、カテゴリを色分けすると確認しやすくなります。
また、サイトツリーはプロジェクトチームと協力してチェックすると品質が高まります。
おすすめのサイトツリー作成ツール7選
さてここからは、サイトツリー作成におすすめのツール7選をご紹介します。
- Microsoft Excel
- Microsoft PowerPoint
- Cacoo
- Adobe XD
- Lucid chart
- Canva
- XMind
まずは業務環境に合わせて、最適なサイトツールを選んでみてください。では、それぞれ解説します。
Microsoft Excel
はじめにMicrosoft Excel。こちらは、Microsoftが提供する表計算ソフトです。下記のように、セルのマス目を利用して簡単にサイトツリーを作成できます。
料金や長所、利用方法などの詳細は、以下を参考にしてください。
| 料金 | Microsoft 365 Business Standard：1,560円（1ユーザー・月額）ほかプランによって異なる |
| 長所 | ・100ページ程度の規模でも手軽に閲覧できる・変更があっても、行の挿入・削除で簡単に修正できる・Excelを利用する他の作業と並行して活用できる |
| 利用方法 | ・ページを行（縦）、階層を列（横）に並べて全体像を表現する・階層ごとに色分けする・付随情報はコメント機能を活用する |
| 推奨 | ページ数が50を超えるような中規模以上のサイトを担当する方 |
Microsoft PowerPoint
次にMicrosoft PowerPoint。こちらは、Microsoftが提供するプレゼンテーション資料などを作成するツールです。主にMicrosoft PowerPointは企画書や提案書に利用されることが多く見られます。ですが、図を作成するのにも適しています。
料金や長所、利用方法などの詳細は、下記を参考にしてください。
| 料金 | Microsoft 365 Business Standard：1,560円（1ユーザー・月額）ほかプランによって異なる |
| 長所 | ・図や表を簡単に挿入できる・プレゼンテーション資料と並行してサイトツリーを作成できる・画像や写真の挿入が簡単 |
| 利用方法 | ・SmartArt→階層構造→組織図・必要に応じてテキスト、図形、分岐の変更 |
| 推奨 | ページ数が30を超えるような中小規模のサイトを担当する方 |
Cacoo
続いてオンライン型の作図ツールCacoo。こちらでは、リアルタイムで共同作業ができます。そのため、複数人でサイトツリーを作成する場合に適しています。
また、Cacooはチャットやビデオ通話もできます。それにより、会議中などのリアルタイムで活用ができます。料金や長所、利用方法などの詳細は、下記を参考にしてください。
| 料金 | 1,980円（3ユーザー・月額）ほかプランによって異なる |
| 長所 | ・リアルタイムで複数人がツールを利用できる・編集履歴やコメント機能があり、情報共有や共同作業がしやすい・テンプレートが豊富で直感的に作業できる |
| 利用方法 | ・テンプレートの「フローチャート」「ワイヤーフレーム」「開発」が便利・テンプレートを利用しないオリジナルのサイトツリー作成もできる |
| 推奨 | 複数人で効率的にサイトツリー作成をしたい方 |
Adobe XD
次にAdobe XD。こちらは、Adove社が提供するWEBサイトをはじめとしたデザイン作成ができるツールです。このAdobe XDは主にデザインや画像設計を作成するツールです。ですが、ごちゃごちゃした印象になりがちなサイトツリーをシンプルにスッキリ仕上げられます。
料金や長所、利用方法などの詳細は、以下を参考にしてください。
| 料金 | Adobe XDのみ：1,298円（月額）コンプリートプラン：6,480円（月額） |
| 長所 | ・シンプルでまとまったサイトツリーを作れる・WEBサイトやアプリなどのデザイン作成ができる・レッスン動画などで使い方を手軽に学べる |
| 利用方法 | ・四角形や手書きツールを組み合わせてツリーを作成する・階層を透明化設定できるため、スッキリとしたサイトツリーができる |
| 推奨 | 複雑なサイトツリーをシンプルに仕上げたい方 |
Lucid chart
そしてLucid chart。こちらは、スマートな作図と資料作成機能に特化したツールです。業務の見える化に力を入れているチームや企業に適しています。Lucid chartはシンプルで使いやすい機能と、自社に合った料金プランが魅力です。
料金や長所、利用方法などの詳細は、下記を参考にしてください。
| 料金 | Team：1,000円～（1ユーザー・月額）※無料プランあり法人向けは要見積もり |
| 長所 | ・目的や予算に合った適切なプランを選びやすい・搭載された機能がシンプルでわかりやすい・複数人での作業ができる便利な機能がある |
| 利用方法 | サイトツリー専用テンプレートを選択して、デザインやカスタマイズする |
| 推奨 | サイトツリー作成に特化したツールを使いたい方 |
Canva
続いてCanva。こちらはサイトツリーをはじめ、WEB関連のさまざまなデザイン作成ができるツールです。そして、Canvaは無料プランもあります。それにより、手軽にデザイン性の高いサイトツリーを作成できます。
料金や長所、利用方法などの詳細は、以下を参考にしてください。
| 料金 | 個人向け：有料、無料プランあり企業向け：3,000円（1ユーザー・月額） |
| 長所 | ・サイトツリー作成に特化したメーカー機能がある・豊富なテンプレートを自由に選べる・ドラッグやクリックなどの直感操作でサイトツリーを作成できる |
| 利用方法 | 好きなテンプレートから必要に応じて図やテキストを追加して編集する |
| 推奨 | 直感的な操作でデザイン性の高いサイトツリー作成をしたい方 |
XMind
最後にXMind。こちらは、マインドマッピングやブレインストーミング作成に便利なツールです。作成したマインドマップはトピックごとに優先順位や進捗を表示するアイコンをつけられます。そのため、プロジェクト管理ツールにも活用できます。
料金や長所、利用方法などの詳細は、下記を参考にしてください。
| 料金 | 6,800円（5台まで・1年） |
| 長所 | ・ツリーテーブルやカラーテーマが豊富に備わっている・自由に編集や調整ができる部分が多く、カスタマイズ性に優れている・ブレインストーミング向けツールのため、複数の意見をまとめやすい |
| 利用方法 | 好きなテンプレートから、テキストや図の編集をおこなう |
| 推奨 | サイトツリー作成と意見をまとめるツールを活用したい方 |
WEBサイトの成果に満足されていますか？
- 下記についてお悩みを抱えていらっしゃいませんか？
- WEBサイトの制作からプロモーションまでの一貫した対策ができていない
- 競合との差別化を図りたいが、強みをうまく表現できない
- 開設後の長期的な運用計画が立っていない状態
上記お悩みをWEBサイト制作専門コンサルタントが解決いたします。
まとめ
さてWEBサイトにおけるサイトツリーの重要性やメリット、おすすめの作成ツールなどを解説しました。
まずはツリー構造をもとにWEBサイトを作成しましょう。そうすれば、検索エンジンとユーザーの双方に優良なサイトと判断されます。そして、事業成果に大きな影響をもたらすことにもつながります。
効果的なWEBサイト制作を目指す企業は、ぜひサイトツリー作成にも力を入れてみてください。
