ホームページの構成図サイトマップとは？作り方の基本を紹介

今回の記事では、ホームページ制作の際にあると便利な「サイトマップ」の概要や作り方についてをご紹介していきたいと思います。

ホームページを自作する場合もサイトマップを作っておくことでサイト構成を整理できますし、これから制作会社やフリーランス制作者に外注する場合でも相手側の見積もりの精度向上や認識差異が少なくなります。

※なお今回のテーマで扱っている「サイトマップ」は「HTMLサイトマップ」や「XMLサイトマップ」といったものとは別物で、制作過程の初期段階で必要となるサイト全体の構成図のことを指していますのでご注意下さい。

ホームページの構成図「サイトマップ」とは？

サイトマップとはサイト全体にどんなページがあって、どのような関係性で繋がっているかが分かるようになっている構成図のことを言います。

サイトマップを作成するメリット

次にサイトマップを作成するメリットですが、大きく以下の3つのメリットが挙げられます。

【自作の場合】サイト構成が一目で分かりスムーズにサイト作成できる

1つ目のメリットは、サイト全体の構成が一目で分かりスムーズにサイト作成できるという点です。

サイトマップを作成せずにただ箇条書きにページ情報をまとめているだけだと、構想段階で重複しているページがあることに気づかなかったり、逆に必要なページが抜け落ちてしまっているといったミスが起きる可能性が高くなります。

よくあるのが初心者の方で、ただでさえ慣れないのに「サイトを作る作業」と「サイト構成を整理する」を同時並行で進めようとして、何を作るべきかが整理できなくなり混乱されていることがあります。

そういった意味でも先にざっくりでも「サイト構成を整理する」を事前に済ませた上で、「サイトを作る作業」に集中した方が、効率よくサイトを作成できることも多いと思います。
 
また、制作を外注する場合でも、予め依頼者サイドの方でサイトマップを作成しておくと、制作者サイドはより正確な見積もりを出すことができるのでより円滑にプロジェクトを進めていくことができます。
 

【制作代行の場合】作るべきページ数や構成を顧客と意識合わせできる

また、フリーランスで制作代行する方の場合でも、見積もり時にサイトマップを作って顧客にあらかじめ提案しておくことで、作るべきページ数やサイト構成を顧客と意識合わせできます。

当然ですが、サイト制作にかかる費用は作成するホームページの規模や工数によって異なります。

もし提案時にどんなページを・どのくらいのページ数を作るべきなのかあいまいなままサイト制作を請け負った場合、顧客と製作者の認識差異により、本来想定していない作業が必要になったり、余分な制作コストがかかってしまったりすることがあります。

そのため、どれくらいの規模・ページ数のサイト・どんなサイト構成になるのかをサイトマップを作成して共有することで、顧客と意識合わせすることができます。

サイトマップの作り方

それではここからは実際にサイトマップを作る方法についてをご紹介していきます。

規模にもよりますが、最も一般的なやり方は「まずは手当たり次第コンテンツを書き出して」「取捨選択・グルーピング化して」「階層化してサイトマップに落とし込む」の3ステップのやり方です。

(STEP. 1)コンテンツ・ページを全て洗い出す

まずは、思いつくままウェブサイトに含めたいコンテンツ・ページを全て洗い出して書き出してみましょう。

何を書けばわからない場合は、同業他社など自分が作りたいサイトに近いホームページにどんなページ・コンテンツがあるかを参考にすると、どんなコンテンツが自社ホームページに必要か把握しやすくなります。

この段階ではサイトの階層構造などといったことは一切気にせず、とりあえず思い付くままに「会社概要」「Q&A」などといったページを全て書き出します。
 

(STEP. 2)書き出したコンテンツを取捨選択・グルーピングする

STEP. 1で含めたいコンテンツ・ページの書き出しが終わったら、書き出したページを取捨選択・グルーピングして整理してみましょう。

上で書き出した内容を元に例を挙げると、例えば「会社」のグループには、「会社概要」や「代表者挨拶」「アクセス」といったグループにまとめることができます。

グルーピングしていくうちに、重複しているものや不要なものも見つかると思います。その場合は必要に応じて取捨選択しましょう。
 

(STEP. 3)階層化してサイトマップに落とし込む

最後に、STEP. 2で作成したグルーピング情報を元に、階層化してサイトマップに落とし込みます。

なお、サイトマップは並列ではなく階層的に作ります。階層構造を持つことで、ページ同士の関係性把握できます。

何を上の階層に持ってきて何を下の階層にするかは、そのサイトの目的次第です。

小規模ホームページならPowerPointで作れます

パワーポイントに慣れている人で、小規模サイトのサイトアップを作成するのであればパワーポイントがおすすめです。

パワーポイントを開いて「挿入」タブの「SmartArt」→「階層構造」をクリックすると、サイトマップのテンプレートを追加することができるので、これを編集することで簡単にSTEP. 3で作成したようなサイトマップを作成することが可能です。

ほかにもExcelが慣れている場合はExcelなど普段慣れているツールを使うと効率よく作成できるかと思います。

まとめ

まとめです。今回の記事では、ホームページの構成図「サイトマップ」の概要や作り方についてをご紹介しました。

 

ホームページを自作する場合もサイトマップを作っておくことでサイト構成を整理できます。また、これから制作会社やフリーランス制作者に外注する場合でも相手側の見積もりの精度向上や認識差異が少なくなりますので、是非一度作成してみると良いと思います。

なお、具体的なホームページの作り方については下記の記事で説明していますのでご参考いただけると幸いです。
ホームページの作り方・個人Webサイトの自作方法【総まとめ版】
ホームページの作り方・個人Webサイトの自作方法【総まとめ版】
 

今回は以上になります。最後までご覧頂き、ありがとうございました。

「業者に任せたけど、更新ができない」「本で独学は時間がかかりすぎる・・」そんなお悩みの方も多いのではないでしょうか。

個別指導形式のスクールでは、自分の知りたいことをピンポイントで学習・達成でき、自分で更新もできるというメリットもあります。
教室の無料事前相談もしておりますので、まずはお気軽にご登録ください。

詳細はこちら

YouTubeチャンネル開設しました！

最大月間50万PVの当ブログをベースに、Youtube動画配信にてWordPress、ホームページ作成、ブログのことについてお役立ち情報を随時配信していきます。

ご興味ある方はぜひチャンネル登録をしていただけますと幸いです。