website-structure について
ウェブサイトのページ構成と優先度を計画し、UX、SEO、成長目標との整合を図るスキルです。汎用テンプレート、計画手順、構成の指針を提供します。
主な機能
- 01ページ種別と優先度の枠組み
- 02汎用サイト構成テンプレート
- 03成長戦略とURLの対応付け
- 04ページ計画と一覧出力の手順
- 05ナビゲーションとクロール性の原則
活用シーン
- 01新規サイトのページ階層の計画
- 02開発するページの優先順位付け
- 03既存サイトへの成長チャネル追加
インストール
コマンドをコピーしてターミナルで実行します。
npx skills add https:/ / github.com/ kostja94/ marketing-skills --skill website-structureインストール後、Claude Code で/website-structureを入力して読み込まれたか確認します。
詳細
戦略:ウェブサイト構造
ウェブサイトの構造計画をガイドします。作成するページ、ページの優先順位、そして構造が UX、SEO、成長をどのように支えるかを扱います。構造とは、ページの整理とつながりのことです。ユーザーのナビゲーション、コンテンツの重要度に関する Google の理解、クロール可能性、SERP でのサイトリンクに影響します。サイトリンクと SERP 最適化については、serp-features を参照してください。
呼び出し時:初回の利用時は、このスキルの内容と重要性を1~2文で簡潔に説明してから、主な出力を提示するとよいでしょう。2回目以降の利用時、またはユーザーから省略するよう求められた場合は、すぐに主な出力を提示してください。
初期評価
プロジェクトのコンテキスト: ルートに contextus.md がある場合は読み込み、このタスクに関連するモジュールだけを読み込んでください。Contextus がない場合は、利用可能なプロジェクト資料またはユーザーから提供された情報を使い、不足している情報を確認してください。並行するコンテキストシステムを作成しないでください。
以下を特定してください。
- ウェブサイトの種類:プロダクト/SaaS、B2B、Eコマース、ポートフォリオ、フォーラム、ディレクトリ
- 段階:新規サイト(ゼロから計画)か既存サイト(拡張または監査)か
- 成長戦略:アフィリエイト、教育、多言語、コミュニティ、B2B、開発者
- 制約:チーム規模、予算、技術スタック
ページの優先順位付けフレームワーク
開発スケジュールに合わせて、ページを優先順位別に計画します。ページの種類とウェブサイトの種類ごとの対応については、skills-reference §2 Page Taxonomy を参照してください。
| 優先度 | ページ | 備考 |
|---|---|---|
| 必須 | ホーム、プロダクト/機能、料金、ブログ、会社概要、プライバシー、利用規約、お問い合わせ | 信頼の構築とコンバージョンに不可欠です。料金:セルフサービスの場合はナビゲーションに公開ページを設置します。エンタープライズ専用の場合は、代わりに「営業に問い合わせる」を使用できます。pricing-page-generator の「表示と配置」を参照してください |
| あるとよい | お客様の声、FAQ、サイトマップ(HTML)、404、返金/返品 | UX と SEO を支援します |
| 任意 | 検索結果、ニュース、採用情報、開示事項 | 状況に応じて追加します |
| トラフィックに応じて追加 | カテゴリ/コレクションページ | コンテンツ量の多いサイトや E コマース向けです。カテゴリとタグが必要です |
汎用テンプレート構造
SaaS、ツール、コンテンツサイトに適用できます。使用しないノード(API がない場合は API など)を削除し、業界や地域などの固有のモジュールを追加して調整してください。
| セクション | 一般的なパス | ページスキル |
|---|---|---|
| ルート | /, /features, /pricing, /demo, /contact | homepage-generator, features-page-generator, pricing-page-generator |
| ツール | /tools, /free-tools;ハブ+ツールごとのページ | tools-page-generator;リード獲得には無料ツールを活用します。多くの場合 SPA で、プログラマティックに生成します。programmatic-seo を参照してください |
| リソース | /blog, /changelog, /glossary, /faq, /tutorials | blog-page-generator, changelog-page-generator, glossary-page-generator, faq-page-generator |
| パートナーシップ | /affiliate, /startups, /ambassadors | affiliate-page-generator, landing-page-generator |
| 法務 | /terms, /privacy, /careers | terms-page-generator, privacy-page-generator, careers-page-generator |
| 競合 | /alternatives, /compare, /migrate | alternatives-page-generator, migration-page-generator |
| 独立ページ | /dashboard, /login, /signup, /docs, /api, /status, /support | signup-login-page-generator, docs-page-generator, api-page-generator, status-page-generator |
成長戦略 → 構造のマッピング
構造には成長戦略が反映されます。サブディレクトリはチャネルを示します。
| 目標 | パスの例 | ページ/チャネル |
|---|---|---|
| アフィリエイトのコンバージョン | /affiliate | affiliate-page-generator |
| 教育/学生向けプラン | /education, /startups, /student-discount | education-program, startups-page-generator |
| 多言語対応 | /zh-CN, /ja | localization-strategy |
| コミュニティ | /ambassadors, /showcase | creator-program, landing-page-generator |
| B2B/エンタープライズ | ソリューション(業界優先)、ユースケース(シナリオ優先。サブページにすることも可能)、導入事例 | solutions-page-generator, use-cases-page-generator, customer-stories-page-generator |
| 開発者向け製品 | /api, /docs, /status | api-page-generator, docs-page-generator, status-page-generator |
| ユーザーからのフィードバック | フィードバック、ロードマップ | feedback-page-generator; 外部サービス(Canny、FeatureBase) |
| プラグイン/インテグレーション | /integrations, /plugins | integrations-page-generator, category-page-generator |
| プレゼント企画/コンテスト | /giveaway | contest-page-generator |
ドメイン構造(複数の製品)
複数の製品やブランドを計画する場合は、サブフォルダー、サブドメイン、独立ドメインの選択について domain-architecture を参照してください。このスキルでは、単一ドメイン内のページ構造を扱います。ドメインの初期選定(ブランド、PMD、EMD、TLD)については、domain-selection を参照してください。
計画ワークフロー
- テンプレートを選ぶ:一般的な構造から始め、ウェブサイトの種類を skills-reference §2 に対応付けます
- モジュールを絞り込む:不要なノードを削除します(例:API がなければ /api、/docs を削除)
- 固有の要素を追加する:業界別ページ、地域、製品のバリエーションを追加します
- URL を割り当てる:各ノードに割り当てます。url-structure に従い、小文字、ハイフン区切り、短く、キーワードを含む形式にします
- リストを出力する:開発スケジュール用に「ページタイプ+URL+優先度」をまとめます
- 技術スタック:ページタイプをサービス(DNS、認証、CMS、ステータスページなど)に対応付けます
- 反復する:新機能や新市場に合わせて拡張し、構造を明確に保ちます
構造の原則
| 原則 | ガイドライン |
|---|---|
| フラットな構造 | ホームページからどのページへも最大 4 クリックで到達できるようにします。クロールのしやすさとリンク評価の分配が向上します |
| 早期の計画 | 成長する前に構造を計画します。ドメインの購入後すぐに始められます |
| サイトリンク | 適切な構造+目次+信頼性の高い内部リンクにより、SERP に自然なサイトリンクが表示されます(スキーマで強制することはできません)。serp-features を参照してください |
| 孤立ページの防止 | すべてのページに内部リンクが必要です。site-crawlability と internal-links を参照してください |
| 機能とユースケース | /features は機能優先、/use-cases はシナリオ優先です。コンテンツの切り口を分け、相互にリンクし、重複を避けます。features-page-generator と use-cases-page-generator を参照してください |
| わかりやすいナビゲーション | 明確な階層とナビゲーションにより、タスクの完了率が向上します。ユーザーは必要な情報をより早く見つけられます。navigation-menu-generator を参照してください |
| 料金ページの配置 | マーケティングサイトでは、見込み顧客向けに /pricing をメインナビゲーションに配置します。アプリ内では、ログインユーザーのサブスクリプション管理用に、サイドバーの「設定 → 請求」に配置します。エンタープライズ限定の場合は、公開料金ページの代わりに「営業に問い合わせる」を設置することがあります。pricing-page-generator を参照してください |
ホームページモジュールのリファレンス
一般的なモジュール(見出し、サブ見出し、CTA、メリット、ソーシャルプルーフなど)やナビゲーションの選択肢については homepage-generator を、ヒーローデザインについては hero-generator を参照してください。
出力形式
- 優先度付きの ページリスト(必須/あるとよい/任意)
- URL 構造(セクションごとのパス)
- ウェブサイトの種類との適合性(skills-reference §2 に照らして、該当するページを示します)
- 成長戦略との対応付け(各パスがどのチャネルを支えるか)
- 次のステップ:URL のルールには url-structure、送信には xml-sitemap、監査には site-crawlability を使用します
参考資料
- ウェブサイト構造のSEOガイド — Alignify:構造の重要性、ページの優先順位、汎用テンプレート、計画ワークフロー、成長マッピング、ホームページのモジュール
- skills-reference §2 (docs/skills-reference.md#2-page-taxonomy) — ページタイプ、ウェブサイトタイプのマトリックス、コアと拡張の完全な一覧。ページの選定に使用します
関連スキル
- seo-strategy:SEO ワークフローの順序。構造計画はテクニカルフェーズの前に行います
- domain-selection:ドメインの初期選定。ドメインを選ぶ場合は、構造計画の前に行います
- domain-architecture:サブフォルダー、サブドメイン、独立ドメインの選定。ドメインが未決定の場合は、構造計画の前に行います
- url-structure:URL の最適化、階層、スラッグ。構造の定義後に適用します
- site-crawlability:クロール可能性、孤立ページ、リダイレクト。既存の構造を監査します
- internal-links:リンク戦略、ハブ・アンド・スポーク。ページの作成後に実装します
- xml-sitemap:サイトマップの作成。計画済みの URL を含めます
- breadcrumb-generator:階層構造のパンくずリスト。大規模サイトや E コマースで使用します
- navigation-menu-generator:ナビゲーションの設計。メイン、フッター、モバイル向け
- content-strategy:コンテンツクラスター、ピラーページ。構造計画を補完します