AI活用

Gemini CLIで生成したLP案をレビュー用URLにして共有する方法

Gemini CLIはターミナルから直接HTMLを生成できるため、LP案を素早く形にしやすい。しかし生成されたHTMLファイルをそのままメールに添付しても、画像パスや外部CSSへの参照が切れた状態で相手の手元に届くことが多い。URLで共有すれば、デザインの完成形に近い状態でフィードバックを受け取れる。

何が共有しづらいのか

LPのHTMLには背景画像・アイコンフォント・アニメーションCSSなど多くのアセットが含まれることが多く、HTMLファイル単体を送っても画像が表示されない「崩れたLP」がレビュアーに届く。CTA部分の見た目が確認できなければ、コンバージョン率に直結するデザインの判断ができない。

Gemini CLIが生成するLPはGoogleフォントやBootstrap CDNへの外部参照を含みやすい。オフライン環境や社内プロキシ環境ではCDNへのアクセスがブロックされ、テキストが游ゴシックのままになるなど見た目が大きく変わる。URLで公開しておけば常にHTTPS経由でアセットを取得でき、レビュアーの環境に依存しない。

  • 相手がログインなしで開ける状態か確認する
  • PCとスマホで最低1回ずつ表示を確認する
  • 内部情報・個人情報・不要な外部送信が残っていないか見る
  • レビュー期限と修正時の差し替え方を決めておく

URL化する前の確認点

LPのHTMLをブラウザで開き、CTAボタンのhref先が実在するURLになっているか確認する。Gemini CLIがプレースホルダとして`href="#"`や`href="https://example.com"`を設定したまま公開すると、クライアントが実際にクリックして「リンクが切れている」と報告してくることがある。

LP内のフォームや「お問い合わせ」ボタンがGoogleフォームや外部サービスに誘導している場合、その送信先がテスト用か本番用かを確認する。モックとして共有するなら「このページはサンプルです。フォームの送信はテスト用です」という注記をLP下部に追加しておくとトラブルを防げる。

  • HTML内の外部script・form action・iframeを確認する
  • APIキーやトークンらしき文字列がないか検索する
  • 画像・CSS・JSのパスが公開後も解決できるか見る
  • noindexと認証を混同せず、必要なら両方設定する

認証と期限の決め方

社内でのコンセプト確認なら会社ドメイン認証で十分だが、外部クライアントへのLP提案では競合他社にURLが漏れるリスクがある。パスワード認証を設定し、パスワードは提案メールとは別のメッセージアプリ(LINEやSlackDM)で伝えると漏洩リスクを下げられる。

LPの提案フェーズでは複数バリエーション(Aパターン・Bパターン)をそれぞれ別URLで共有するケースが多い。各URLに有効期限を設定し、選考が終わったバリエーションのURLは無効化することで、後から「古いURLのほうが良かった」という蒸し返しを防げる。

  • 誰でも見てよい: URL共有のみでもよいが、検索除外は確認する
  • 特定の相手だけ: パスワードまたはメール認証を使う
  • 会社内だけ: 会社ドメイン認証を検討する
  • 短期レビュー: 期限を設定して古いURLを残さない

共有後のフィードバック回収

LPのレビューでは「ファーストビューで何が伝わるか」「CTAボタンの位置は自然か」「全体の色使いはブランドガイドラインに合っているか」の3点を確認事項として明示すると、本質的なフィードバックが集まりやすい。「デザインをどう思いますか」という漠然とした質問では「いいと思います」という回答しか返ってこないことが多い。

LPのフィードバックは修正前の版と修正後の版を並べて比較できると判断しやすい。別URLでA版・B版を公開し、修正前と修正後のURLを一覧にしてSlackのスレッドに投稿しておくと、どの点が変わったかをレビュアーが追跡しやすくなる。

  • 確認してほしい観点を3つ以内に絞る
  • 期限と返信先を明記する
  • 修正後も同じURLで見られるか伝える
  • 最終版と途中版が混ざらないようタイトルを付ける

よくある質問

Gemini CLIが生成したLPの画像が相手の環境で表示されない場合、どう対処しますか?

画像をHTMLにBase64でインライン埋め込みするか、画像ファイルをHTMLと同じフォルダに入れてZIPにまとめてアップロードしてください。CDNの画像URLを直接参照している場合はそのURLが公開・有効かブラウザで確認してから共有しましょう。

競合他社にLP案が漏れないようにするには?

パスワード認証を設定し、パスワードは提案メールとは別経路(電話・別メッセージアプリ)で伝えてください。さらに有効期限を商談終了の翌日に設定すると、期限後のアクセスを自動で遮断できます。

A/Bの2案を比較してもらうときにURLはどう管理すればいいですか?

A案・B案それぞれ別URLで発行し、対比表(URL・デザインの特徴・確認ポイント)をメッセージに貼り付けて共有してください。決定後は不採用になったURLを期限設定か手動削除で無効化しましょう。

関連記事

AI活用

Gemini CLIで生成したHTMLスライドをレビュー用URLにして共有する方法

会議前に急いで作ったHTMLスライドを、ファイルの受け渡しなしにすぐ見てもらいたい。Gemini CLIが生成したブラウザ動作型プレゼンをチームにフィードバックしてもらうまでの最短ルートとして、ギガサイト便でURL発行する具体的な手順を説明する。

4分で読める
「AI活用」の記事をもっと見る →