AIにサイトを組ませる前に、全ページ共通の基準を7つ決めておくと、頼むたびにデザインが変わらなくなる

どんな問題を解決するか / いつ使うか

AIでサイトを作ると、ページを足すたび・頼むたびに見た目が変わってしまう。原因は全体の基準を最初に決めていないこと。複数ページのサイトをAIに作らせる前に。

先に決める7つ

1. ヘッダーとフッターは全ページ共通の部品にしてもらう。1か所直せば全ページに反映される。
2. 開いた時のローディング演出：世界観の入り口。長すぎず、意味のないアニメーションは付けない。
3. 開いて最初に見える画面：ローディングから地続きの世界観に。いちばん興味を持ってもらえる場所なので、動きはここに集中させる。
4. 見出しの大きさの段階：大・中・小を最初に決めてメリハリを付ける。
5. 余白は8の倍数（8・16・24…）でそろえる。ページを増やしてもズレない。
6. お問い合わせの枠も全ページ共通：背景に写真を置いて黒を重ねて暗くするだけで十分。文言は気軽に相談できそうな言葉に。
7. お礼のページと共有の画像：送信後のお礼ページを作り、SNSで共有されたときの画像（OGP）とタブのアイコン（ファビコン）も設定する。

AIへの渡し方の例

「次の7つを全ページ共通のルールにしてからページを作って：ヘッダー・フッターは共通部品／見出しは大・中・小の3段階／余白は8の倍数／お問い合わせ枠は共通部品…」と最初にまとめて伝え、ルールファイル（DESIGN.md など）に書かせておく。

注意点

• 見出しの段階や余白の刻みは、具体的な数値まで書くとさらにブレにくい（DESIGN.mdは「雰囲気の言葉」より「値」を書き、値には「なぜ」を添えて、使いながら育てる）。
• OGP画像・ファビコン・お礼ページは後回しにされがちなので、最初のチェックリストに入れておく。

出典

• 投稿者: @tatsu_studio
• 投稿: @tatsu_studio · 2026-10-16
• 収集日: 2026-10-16（JST、10/15・10/16分の巡回をまとめて実施）