サイトマップ作成の例を丁寧にわかりやすく解説する方法

2025 10/27

2025/10/27

はじめに

この章では、本記事全体の目的と読み方をやさしく説明します。サイトマップに不慣れな人でも理解できるよう、具体的な例や手順を中心に解説します。

この記事の目的

サイトの構造を整理し、検索エンジンと訪問者の両方にとって使いやすいサイトマップを作る方法を伝えます。HTMLサイトマップとXMLサイトマップの違い、設計のポイント、実際の作成手順やテンプレートまでカバーします。

対象読者

初心者から中級者のサイト運営者、ウェブデザイナー、SEOに関心のある方が対象です。コードに不慣れでも作成できる手順を多く載せます。

本記事で学べること

サイトマップの種類と役割
HTML／XMLそれぞれの作り方と具体例
構造図（サイト設計図）の作り方
作成時の注意点と実用的なテンプレート

読み方のポイント

まず第2章で基本を把握し、興味のある章に進んでください。実際に手を動かす場合は、章ごとの手順に沿って一つずつ試すと失敗が少なくなります。

サイトマップとは？主な種類と役割

サイトマップとは

サイトマップは、Webサイト内のページを一覧にした地図のようなものです。訪問者や検索エンジンがページを見つけやすくなります。構成を可視化することで、ページの抜けや重複にも気づけます。

主な種類と特徴

HTMLサイトマップ（ユーザー向け）
ユーザーが目的のページにたどり着きやすくするための一覧です。カテゴリ別や重要ページを整理し、例として「会社案内」「商品一覧」「お問い合わせ」などをまとめます。サイト内の回遊を促し、利用者の離脱を減らします。
XMLサイトマップ（検索エンジン向け）
検索エンジン用にURL情報を機械的に並べたファイルです。各URLの更新日や優先度を伝えられます。例えば新着記事や画像・動画を登録すると、検索エンジンのロボット（クローラー）が効率よく巡回します。

役割の使い分け

両方を用意すると効果的です。HTMLはユーザー目線での案内、XMLは検索エンジンへの通知に役立ちます。小さなサイトでも簡単なHTMLページを置き、大きなサイトでは自動でXMLを生成すると良いでしょう。

HTMLサイトマップの作成例と手順

概要

HTMLサイトマップは訪問者向けにサイト内の主要ページを一覧化したページです。トップページから商品一覧、サービス紹介、会社概要、お問い合わせへ自然に辿れる構成が望ましいです。

作成例（階層一覧）

トップページ
商品一覧
- カテゴリーA
- 商品A1（詳細）
- 商品A2（詳細）
- カテゴリーB
サービス紹介
- サービスA
- サービスB
会社概要
- 会社情報
- 採用情報
お問い合わせ
- よくある質問（FAQ）
- 資料請求

作成手順（具体的）

表示するページ・コンテンツの選定
ユーザーが探す主要ページを優先します（例：商品一覧、詳細、問合せ、利用規約）。
カテゴリ分けとサイトツリーの作成
関連するページをまとめ、深さは原則3層程度に抑えます。紙に書いてツリーにすると分かりやすいです。
分かりやすいデザインの工夫
見出しごとにリンクをまとめ、リンク文は具体的にします（「お問い合わせ」より「採用に関するお問い合わせ」）。レスポンシブ対応にします。
実装のポイント
HTMLではul/liで階層を表現し、aタグでリンクします。アクセスしやすいリンク順に並べます。簡単なARIA属性を付けると支援技術でも扱いやすくなります。

市役所や企業サイトの応用例

市役所では「手続き」「子育て」「税金」など生活カテゴリで整理します。企業サイトでは「製品」「導入事例」「IR」など役割別に分け、利用者が目的の情報へ短時間で到達できる設計にします。

注意点

頻繁に更新してリンク切れを防ぐ
同じ内容への重複リンクを避ける
ユーザーの目的優先で構成を見直す

構造図（サイトマップ）の作り方と例

はじめに

サイトの構造図は、ページの全体像を見える化する図です。目的に応じて適切な階層と導線を設計すると、訪問者も運営側も使いやすくなります。

作成の流れ（基本ステップ）

必要なページを洗い出す：競合や類似サイトを参考にしつつ、自社の目的を優先してリスト化します。
分類・グループ化：似た内容をまとめ、親子関係（階層）を決めます。
全体設計のチェック：抜け漏れや重複を確認し、導線（どこからどこへ行けるか）を検証します。

具体例：温泉旅館のページリスト

トップページ
客室一覧（各室ページ）
プラン・料金
施設案内（館内・温泉・食事）
アクセス・周辺観光
よくある質問
予約ページ・お問い合わせ
この例では、客室やプランを中核に置き、予約導線を短くします。

具体例：企業サイトのカテゴリ別構成図

会社情報（会社概要・沿革・アクセス）
サービス／製品（カテゴリごとの詳細）
導入事例・実績
ニュース・お知らせ
採用情報
お問い合わせ
階層は浅めにして、ユーザーが目的ページにたどり着きやすくします。

階層設計のポイント

重要なページはトップから2〜3クリックで届くようにします。
同じ内容が複数ページに散らばらないよう注意します。
将来の追加を見越して余裕のある分類にします。

チェックリスト（抜け漏れ・重複確認）

ビジネス目標に必要なページは含まれているか
同じ情報が別ページにないか
ナビゲーションは直感的か

以上を踏まえ、ページ数や目的に応じた最適な構造図を作成してください。

XMLサイトマップの作成例と手順

概要

XMLサイトマップは検索エンジン向けにサイト内のURLを一覧化したXMLファイルです。ページの場所や最終更新日などを伝え、効率的な巡回を助けます。

sitemap.xmlの例

<?xml version="1.0" encoding="UTF-8"?>
<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9">
  <url>
    <loc>https://example.com/</loc>
    <lastmod>2025-01-01</lastmod>
    <changefreq>daily</changefreq>
    <priority>1.0</priority>
  </url>
</urlset>

要素の意味：locはページURL、lastmodは最終更新日、changefreqは更新頻度の目安、priorityは優先度の目安です。

作成手順（簡易）

対象のURL一覧を作る（サイトマップ化したいページだけ）。
XML形式に整形する（上の例を参考）。
ファイル名をsitemap.xmlとしてサイトのルートに置く（https://example.com/sitemap.xml）。
検索コンソール（例：Google Search Console）で送信するか、robots.txtに場所を記載する。

自動生成ツール（XML Sitemaps Generatorなど）を使えば手作業を減らせます。大規模サイトは複数ファイルに分けてインデックスファイルを作成してください。

更新と管理のポイント

ページ更新時にlastmodを更新する。
50,000 URLや50MBを超える場合は分割する。圧縮（.gz）で容量を下げられます。
重複や非正規（canonicalでない）URLは含めないようにしてください。

注意点

検索エンジンへの指示は目安であり、クロールを完全に保証するものではありません。定期的に確認し、必要なら再送信してください。

サイトマップ作成のポイント・注意点

目的に合った形式を選ぶ

サイトの利用者向けに一覧を見せたいときはHTMLサイトマップ、検索エンジンに効率よく伝えたいときはXMLサイトマップを選びます。両方用意すると利便性とSEOの両面で効果的です。

ページ設計で抜け漏れを防ぐ

競合サイトや自社の主要ページを洗い出し、カテゴリごとに網羅するチェックリストを作ります。例えば「商品一覧」「お問い合わせ」「会社情報」など、必須ページをリスト化して抜けを無くします。

更新ルールを決める

ページ追加・削除・URL変更があったらすぐにサイトマップを更新する運用を決めます。自動生成ツールやCMSの機能を使うと手作業のミスを減らせます。

XMLサイトマップのポイント

XMLでは重要なページに高い優先度を付け、lastmod（最終更新日）を正しく設定します。サイトマップを送信する際はSearch Consoleに登録し、robots.txtで参照を明示してください。

検証とよくあるミス

生成後はリンク切れやステータスコードをチェックし、重複URLやnoindexページを含めないように確認します。ファイルが大きくなりすぎたら分割することも検討してください。

参考になるサイトマップ事例・テンプレート

概要

参考事例としては、市役所・自治体サイトの分かりやすい分類、企業サイトの目的別構成、テンプレート付きツールによる自動生成があります。これらを使うと実務で役立つサイトマップを短時間で作成できます。

1. 市役所・自治体サイトの事例

主なカテゴリ例：トップ／暮らしの手続き（税・福祉・保育）／防災・安心／観光・文化／市政情報（議会・広報）／申請書ダウンロード／窓口案内。
ポイント：対象（市民・事業者・観光客）で振り分けると迷わずに情報へたどり着けます。ラベルは日常語で統一してください。

2. 企業サイトの目的別カテゴリ構成図

目的別に分ける例：製品・サービス／導入事例／サポート／企業情報（採用・IR）／お問い合わせ。
サンプル構成：Home > 製品 > 製品A > 仕様・価格・導入事例。CTA（資料請求／相談）を各階層に置くと効果的です。

3. テンプレート付きツールと自動生成

利用例：テンプレート（Figma・draw.io・Miro）で構造図を作成、CSVやサイトURLから自動でXML/HTMLを生成するツールで実装用データを作る方法です。
実務の流れ：まずページ一覧を整理（CSV）→テンプレートに流し込む→階層・優先度を設定→図を出力。公開後は定期的に更新してください。