よくある原因
AIにHTMLを生成させた場合、画像をBase64でインライン埋め込みにするように指示すると、HTMLファイル1つがMB単位になることがあります。3枚のフルサイズ画像をBase64埋め込みにしただけでHTMLが15MBを超えることもあります。
もう一つの原因は、AIが生成するCSSにGoogle Fontsなどの外部リソースを含め、これをローカルに同梱しようとして大量のフォントファイルをZIPに追加してしまうケースです。woff2ファイルは1フォントファミリーで数百KBになるため、複数フォントを同梱するとZIPサイズが急増します。
- 相手がログインなしで開ける状態か確認する
- PCとスマホで最低1回ずつ表示を確認する
- 内部情報・個人情報・不要な外部送信が残っていないか見る
- レビュー期限と修正時の差し替え方を決めておく
自分側で確認すること
AI生成HTMLのファイルサイズをまず確認します。1ファイルが5MBを超えている場合はBase64埋め込みの画像が大量に含まれている可能性があります。テキストエディタでdata:imageを検索すると埋め込み画像の数を把握できます。それぞれのBase64文字列をデコードして画像サイズを確認し、圧縮率の高いWebPに変換してから再埋め込みすることで削減できます。
ZIPに含まれるファイル一覧を確認し、サイズ上位5ファイルを特定します。unzipコマンドでサイズ降順に表示できます。特定したファイルが必要かどうかを判断し、不要なものは削除、必要なものは圧縮して再梱包します。
- HTML内の外部script・form action・iframeを確認する
- APIキーやトークンらしき文字列がないか検索する
- 画像・CSS・JSのパスが公開後も解決できるか見る
- noindexと認証を混同せず、必要なら両方設定する
相手側で確認すること
AIが生成したHTMLを別の担当者がレビューする場合、ファイルサイズが一定以上（例：ZIPで50MB以上、HTMLファイル単体で10MB以上）の場合はアップロード前に最適化を依頼します。GitやNotion経由でファイルを受け取るフローであれば、PR/レビューの段階でサイズチェックを行います。
AI生成HTMLを受け取った担当者がギガサイト便にアップロードしたとき途中で止まった場合、まずZIPのサイズを確認して報告してもらいます。報告内容に「何%で止まったか」「エラーメッセージの有無」を含めてもらうと原因の特定が早くなります。
- HTML内の外部script・form action・iframeを確認する
- APIキーやトークンらしき文字列がないか検索する
- 画像・CSS・JSのパスが公開後も解決できるか見る
- noindexと認証を混同せず、必要なら両方設定する
再発防止の運用
AIへのプロンプトに「ZIPのサイズが50MB以下になるように画像サイズを最適化し、1枚あたり500KB以下のWebP形式を使うこと。フォントはシステムフォントのみを使用し外部フォントを同梱しないこと」という制約を追加します。この2行の指示でZIPサイズを劇的に削減できます。
生成物のサイズ管理を自動化するために、ZIPを作成するシェルスクリプトにサイズチェックを追加します。ZIPが50MBを超えた場合に警告を出力して処理を止めるだけでも、うっかりアップロードして途中で止まるミスを防げます。
- HTML内の外部script・form action・iframeを確認する
- APIキーやトークンらしき文字列がないか検索する
- 画像・CSS・JSのパスが公開後も解決できるか見る
- noindexと認証を混同せず、必要なら両方設定する
よくある質問
AIにWebP形式で画像を出力させることはできますか？
AIは直接画像ファイルを生成できないため、AIにはHTMLのsrcをWebPファイル名で記述させ、実際の画像はSquooshやffmpegで別途WebPに変換して配置します。AIによる生成はHTML・CSS・JSのみと割り切ってください。
Google FontsをローカルホストせずにCDNから読み込む場合、ギガサイト便での表示に問題はありますか？
ギガサイト便で公開したHTML内でGoogle FontsのCDNを参照することは問題ありません。ただし閲覧者がオフラインの場合はフォントが読み込まれないため、重要な表示にはシステムフォントをフォールバックとして指定しておくと安全です。
AIが生成したCSSに含まれる不要なセレクタを削除してZIPを小さくする方法はありますか？
PurgeCSSを使うとHTMLで実際に使用されているCSSクラスのみを抽出して未使用セレクタを削除できます。Bootstrapのような大きなCSSライブラリを使っている場合は特に効果が大きく、CSSだけで数百KBの削減が見込めます。