はじめに
前提として、AIにHTMLを書かせること自体はまったく難しくありません。「メルマガのHTMLを作って」とお願いすれば、それらしいものがすぐ返ってきます。問題はその中身です。放っておくとAIは、Web開発では正しいけれどメールでは崩れる書き方——divレイアウトや外部CSS——を平気で使ってきます。
AIは「普通のHTML」なら得意ですが、「メールセーフHTML」という特殊なルールは、明示的に教えないと守ってくれません。この記事では、AIにメールの制約を守らせ、生成結果を検証してから使うための設計を解説します。メールHTML自体の制約はメールHTMLはなぜ特殊かを先に読むと分かりやすいです。
制約をプロンプトで徹底させる
ルールを明文化して渡す
AIにメールセーフHTMLを書かせる第一歩は、守ってほしい制約をプロンプトに具体的に列挙することです。「メールで崩れないHTMLにして」といった曖昧な指示では足りません。tableでレイアウトすること、styleは全部inlineにすること、divでの段組みは禁止、といった項目を一つずつ明文化して渡します。
前の記事で触れたチェックリストが、そのままプロンプトの材料になります。ルールが明確なので、指示も明確に書けるわけです。
「やってはいけないこと」を強く指定する
面白いのは、「こうして」より「これは絶対にするな」の方が効きやすいことです。AIは油断するとモダンな書き方に流れるので、divによるレイアウト禁止、外部CSS禁止、<style>タグ禁止、JavaScript禁止、といった禁止事項を強調して指定します。
禁止事項をはっきりさせておくと、AIが「良かれと思って」最新技術を使ってしまう事故を減らせます。
出力フォーマットを固定する
本文だけを生成させ、ヘッダーやフッターはAIに触らせないのも重要です。出力範囲を「本文のtableブロックのみ」に限定し、余計な説明文やマークダウンを付けさせないよう指示します。これにより、生成物をそのままテンプレートに埋め込める形に揃えられます。
プロンプトは資産
一度作り込んだメールセーフHTML用のプロンプトは、以降ずっと使い回せる資産になります。制約の明文化に時間をかける価値は十分にあります。
生成結果を検証してから使う
プロンプトだけでは守り切れない
制約をどれだけ丁寧に指示しても、AIは確率的に振る舞うので、ときどきルールを破ります。だから「プロンプトで頼んだから大丈夫」と信じるのではなく、生成結果を機械的に検証する工程を必ず挟みます。プロンプトで予防し、検証で発見する、という二段構えです。
検証でチェックする項目
検証では、制約が守られているかを自動でチェックします。禁止タグが混ざっていないか、styleがちゃんとinlineか、画像がすべて絶対URLか、幅の指定が想定内か——これらは機械的に判定できる項目です。ここで問題が見つかれば、配信前に弾けます。
禁止事項を明示したプロンプトでHTML本文を生成
禁止タグ・inline化・絶対URL・幅などをチェック
違反があれば指摘を添えて作り直すか、システムで補正
検証を通った本文をブランド別テンプレートに埋め込む
違反時のリカバリー
検証でNGが出たときは、そのまま止めるのではなく、違反内容を添えてAIに作り直させます。「divが使われていたのでtableに直して」といった具体的なフィードバックを返すと、次の生成で改善されやすくなります。単純な問題ならシステム側で機械的に補正することもあります。
テンプレートと組み合わせる
AIが作るのは本文だけ
このシステムでは、AIに全体を作らせず、生成させるのは本文部分に限定しています。ヘッダーとフッターはブランドごとに決まったデザインがあるので、テンプレートとして用意しておき、検証を通った本文を挟み込む形で合成します。AIが触る範囲を狭めるほど、崩れるリスクも減ります。
ブランド別テンプレートの自動適用
扱うブランドは2つあり、それぞれヘッダー・フッターのデザインが違います。ブランドを指定すれば対応するテンプレートが自動で選ばれ、本文と合成されます。制作者はブランドを選ぶだけで、あとはシステムが正しい型に組み上げてくれます。
事実データはここでは触らない
なお、価格や画像URLといった正確さが求められるデータは、この生成・検証の工程では扱いません。それらは商品マスタから取得してシステムが差し込む役割で、AIには創作させないためです。その仕組みは商品データ連携とレビューを挟む制作フローで解説します。
まとめ
AIに壊れないメールHTMLを書かせるコツは、「頼んで終わり」にせず、予防と発見を分けて設計することです。
- 制約は曖昧に頼まず、禁止事項として明文化してプロンプトに渡す
- プロンプトだけを信じず、生成結果を機械的に検証して配信前に弾く
- 違反時は指摘を添えて再生成・補正するリカバリーを用意する
- AIが作るのは本文だけ。ヘッダー・フッターはブランド別テンプレートで合成する
メールHTMLの制約そのものはメールHTMLはなぜ特殊か、商品データの差し込みと制作フローは商品データ連携とレビューを挟む制作フローで掘り下げています。