Direct answer
何を決めるための項目ですか？
機能、数値、料金、導入不安を解消する製品ページ。 同じProjectから8つの出力形式を生成し、変換損失と導入・確認・復旧手順を比較できる例です。
Page Kitは完成コピーではありません。Sectionの初期順と意図を提供し、価格、実績、証言、画像、権利、連絡先、法的な文言は公開前に実データへ置き換えます。
Example output map
この完成構成から生成する8つの成果物
| Adapter | 確認する主ファイル | レビューの焦点 |
|---|---|---|
| Semantic HTML | index.html / styles.css | landmark、H1、focus、mobile、外部request |
| Gutenberg markup | page-pattern.html | Block comment、core Block、編集可能性 |
| Theme patterns | patterns/*.php | Title・Slug header、namespace、CSS読込 |
| Pattern plugin | devs-section-patterns.php | category、停止後の挿入済みBlock |
| Starter Page | patterns/starter-page.php | core/post-content・page、既存Page非変更 |
| theme.json | theme.json.fragment | v3 merge、slug衝突、CSS fallback |
| Project JSON | project.json | schema、catalog lock、再編集可能性 |
| Runbook | INSTALL.md / VERIFY.md / ROLLBACK.md | 担当者、順序、確認結果、復旧対象 |
Quality snapshot
完成例として確認するページ全体の条件
- 10件のSectionを、
saas-productの推奨順から開始します。 - 有効なHeroとH1は1件、Headerは先頭、Footerは末尾、anchorとinstance IDは重複させません。
- 必須Content Slot、title、description、canonical、画像alt、contrast、reduced motionをQuality Guardで確認します。
- 価格・実績・証言・画像・権利・連絡先・legal文言はサンプルから事実へ置き換えます。
- 375px、200% zoom、キーボード、WordPress Editorとfrontendで検証し、結果をValidation Reportへ保存します。
Safe workflow
安全に使う手順
- Page KitとSectionの役割を決め、必須Content Slotを実際の内容へ置き換えます。
- 375・768・1100・fluidで、見出し、長い文字、画像、CTA、横はみ出しを確認します。
- Quality Guardの固定Rule ID、severity（重要度）、evidence（根拠）、loss（変換損失）を確認します。
- 用途に合うAdapterを選び、INSTALL、VERIFY、ROLLBACKの順に導入・確認・復旧方法を共有します。
Terms
英語表記の意味
Section（セクション）はページ内の役割を持つ区画、Variant（バリアント）は意味を変えない配置違い、Adapter（アダプター）は同じProjectを実装形式へ変換する処理、Evidence（エビデンス）は判定根拠、Loss（ロス）は出力形式で完全には表現できない差、Rollback（ロールバック）は元に戻す手順です。