Web制作においてサイトの全体像を把握しておくことは、チームでプロジェクトを進める上で欠かせない作業です。ホームページを基点に各ページが階層を作ることでWebサイトを構造化することができます。

構造化されたWebサイトはプロジェクトメンバーとの意思疎通に大きく貢献し、またWebサイトを検索するユーザーや検索エンジン側にとってもサイト内の情報を探しやすいというメリットがあります。

まだサイトマップを作成していないWeb制作担当者はこの機会にサイトマップ作成の必要性を把握しておきましょう。

Web制作におけるサイトマップの重要性

Webサイトを作成する時に、ただ企業や事業についての説明をコンテンツとして追加しただけのWebサイトを作成することは可能です。

しかしそのままの状態ではWeb制作を行うプロジェクトメンバーとの共有が難しく、またユーザーや検索エンジンから見つけづらいWebサイトとなってしまっています。

つまり、ホームページの見た目が素晴らしかったとしても「そもそも検索されにくい」ため、Webサイトとしての価値は依然低いままになっているのです。

こうした状況をSEO的にも視覚的にも改善するのが「サイトマップ」の役割といえます。この記事を最後まで読めばWeb制作におけるサイトマップ作成の必要性が分かるでしょう。

2種類のサイトマップを知る

Web制作におけるサイトマップには、実は2種類のサイトマップが存在しています。

Web制作を進めるプロジェクトメンバーやWebサイトを利用するユーザー側にメリットのあるものが「HTMLサイトマップ」で、検索エンジン側にメリットのあるものが「XMLサイトマップ」です。

どちらもWeb制作において欠かせないサイトマップではありますが、視覚的にプロジェクトの進捗やWebサイト構造を把握するにはHTMLサイトマップの方が必要になります。

今回はHTMLサイトマップの作成について見ていきましょう。

プロジェクトメンバー間の意思疎通がしやすい

先述しましたが、Web制作においてプロジェクトメンバーとの意思疎通は欠かせません。自社のWeb制作が現在どのくらいの進捗状況で、Webサイトのどの部分を議論・検討しているかなどの会話は時間が経つにつれて増えていきます。

細かな修正が必要な状況下で、複雑化するWebサイトの中身を1つ1つチェックしていたのではWebサイトの全体像が掴めず、思わぬところで足踏み状態に陥る場合があります。

そのような状況を前もって回避するためにはサイトマップを作成し、サイトに盛り込みたいコンテンツが重複したり漏れたりするのを防ぐことが重要です。

またサイトマップはシンプルなデザインにしておくことでWebサイトの構造が一目で分かるようになります。サイトマップに階層を持たせることで各コンテンツの重要度をすぐに把握することも可能になります。

ユーザーがサイト内で迷子になりにくい

Webサイトのコンテンツ増加にしたがって、Webサイトは徐々に複雑化していきます。複雑化したコンテンツはカテゴリごとに分けることができますが、Webサイトのリニューアルなどで全てのコンテンツが把握できなくなる場合があります。

そうした場合にはWebサイトのどこにコンテンツがあるかを把握することが難しく、Webサイトに訪れたユーザーがサイト内で「探したい記事」を探せない事態を招いてしまう可能性があるのです。

予めサイトマップ作成を行うことで「記事」や「コンテンツ」がリンクごとにまとめられ、Webサイトを訪れるユーザーが目的のコンテンツにたどり着きやすくなります。

HTMLサイトマップ作成の方法

作成するとメリットの多いサイトマップですが、作成には少しコツが必要です。

Webサイトに追加したいコンテンツを準備した後に（作成途中の場合はコンテンツの内容が分かるタイトルを付けましょう）、階層を作るようにサイトマップを作成していきます。

「ホームページ」をはじめに設定し、その下に「会社案内」や「事業説明」などの項目を設定して線でつなぐと階層を作ることができます。事業内容が複数ある場合は「事業説明」の下に新たに項目を追加していくと見やすいサイトマップの作成が可能です。

サイトマップを重要度で分ける

HTMLサイトマップは「ハイレベル」と「ローレベル」に分けることができます。サイトの全体像を把握する場合には、先述のような項目ごとに階層分けしたハイレベルサイトマップを作成します。

一方で、Webサイト制作を行う上で必要な情報をページ単位まで落とし込むのがローレベルサイトマップになります。

ローレベルサイトマップではページデザインや対応するキーワードなど、Webサイトの細部を構成する要素がより具体的に見えるのが特徴です。

自社のWeb制作におけるサイトマップの持つ重要度や制作段階に応じて使い分けてみましょう。

プラグインを使ったサイトマップ自動作成

HTMLサイトマップはExcelなどのソフトを使用して作成することができますが、WordPressのプラグインを使ってオンライン上で自動作成することも可能です。

「PS Auto Sitemap」を検索・有効化し、「設定」からサイトマップの表示設定を変更することができます。設定画面下のショートコードをコピーし、固定ページのブロックを「HTML」に設定した上でペーストしましょう。

ページを公開し、ホームページのヘッダーメニューに設定すればサイトマップ作成完了です。

無料ツールを使ったサイトマップ作成

「cacoo」というツールを使ってサイトマップをフリー作成することもできます。無料版と有料版があり、プロジェクトメンバーとの共有がしやすい俯瞰型のサイトマップが作成可能です。

色づかいやデザイン性にこだわりたい場合はcacooで作成することをおすすめします。

（画像はPixabayより）

• 参考サイト
• cacoo