---
title: "Claude Appsで生成したLP案をレビュー用URLにして共有する方法"
description: "Claude AppsでLP案を生成したマーケター・デザイナー向け。ArtifactsのHTML出力を3分でレビュー用URLにする方法と、クライアント共有時のパスワード設定・フィードバック回収の実践ノウハウを解説する。"
image: "https://giga-site.com/og-image.png"
canonical: "https://giga-site.com/articles/claude-apps-lp-draft-review-url"
markdown: "https://giga-site.com/articles/claude-apps-lp-draft-review-url/index.md"
category: "AI活用"
publishedAt: "2026-06-25"
updatedAt: "2026-06-25"
readingMinutes: 5
---
# Claude Appsで生成したLP案をレビュー用URLにして共有する方法

Claude AppsのArtifacts機能でLP案を生成したとき、その出力HTMLをどう関係者に届けるかで手が止まることがある。コードブロックをコピーしてメールに貼り付けても相手は確認できないし、スクリーンショットだと動的な表現が伝わらない。ギガサイト便ならHTMLを貼り付けるだけで共有URLが生まれ、本来のデザイン確認に集中できる。

> Source HTML: https://giga-site.com/articles/claude-apps-lp-draft-review-url
> Article index: https://giga-site.com/articles/index.md

## 何が共有しづらいのか

Claude AppsのArtifactsは、会話内でリアルタイムにHTMLプレビューを表示できる便利な機能だが、そのプレビューはClaudeのセッション内に閉じており、URLをそのまま他の人に共有することはできない。「Claudeで作ったLP案を見てほしい」と伝えるには、HTMLをコピーしてファイルに保存する一手間が常に必要になる。

LP案には未公開のキャッチコピーや比較競合名が含まれることがある。それをDropboxやGoogle Driveのリンクで共有すると、期限管理が難しく誰がいつ見たかも分からない。ギガサイト便のパスワード認証とアクセスログを組み合わせることで、情報の流通範囲と閲覧タイミングを把握できる。

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

## URL化する前の確認点

Claude AppsがArtifactsで生成したHTMLは自己完結していることが多いが、外部フォント（Google Fonts）や外部アイコン（Font Awesome）をCDN経由で読み込んでいる場合がある。社内ネットワークでCDNへのアクセスが制限されているとフォントが崩れるため、事前に確認するか、フォントをBase64でインライン埋め込みにする対処をとる。

LP案に「コンバージョンを計測するためのトラッキングコード」が埋め込まれていないか確認する。Claudeが生成したHTMLにGTMのサンプルコードが混入しているケースは少ないが、既存のHTMLをClaude Appsに貼り付けて改善を依頼した場合は元のトラッキングコードが残ることがある。レビュー段階ではトラッキングコードを削除してからアップロードするのが安全だ。

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

## 認証と期限の決め方

社内のマーケティングチームへのレビューなら、パスワードを社内チャットで共有するだけで十分だ。全員が同一組織にいるため会社ドメイン認証でもよいが、外部のコピーライターやカメラマンも関わる場合はパスワード方式の方が柔軟に対応できる。

クライアントへのLP案提案では、提案日から3日間の期限を設定するのが経験上うまくいく。3日以内に初回フィードバックが来ない場合は「確認できましたか？」とフォローし、URLの有効期限を延長する。期限が切れた後にクライアントが見返そうとするケースに備え、承認後は期限なしの参照用URLを別に発行しておくと親切だ。

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

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

LP案のレビューでは「キャッチコピーの刺さり感」と「スクロール体験」の2点を最優先で確認してもらう。視覚的なデザインよりも、読者の感情的な反応と導線の自然さが初稿で確かめるべき要素だ。デザインの細かい調整はその後の工程で対応できる。

フィードバックを受け取ったらClaude Appsに「このフィードバックを反映してLP案を改訂してください」と追記して再生成し、改訂版HTMLを再アップロードする。この「生成→フィードバック→再生成」のループをギガサイト便のURL更新と組み合わせることで、クライアントとのLP制作サイクルを高速化できる。

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

## よくある質問

### Claude AppsのArtifactsからHTMLをコピーするとき、CSSがインラインとタグの両方に分散しています。そのままアップロードして問題ありませんか？

問題ありません。CSSがインラインタグと`<style>`タグに混在していても、ブラウザは正常に処理します。スタイルの優先度が意図通りになっているかだけ確認してからアップロードしてください。

### Claude Appsが生成したHTMLにスクロールアニメーションが含まれています。URLで共有後も動作しますか？

IntersectionObserver APIを使ったスクロールアニメーションは通常のホスティング環境で動作します。CSSの`@keyframes`アニメーションも問題ありません。動作しない場合はブラウザのJavaScriptが無効になっているか、`prefers-reduced-motion`設定が有効になっている可能性があります。

### Claude Appsで何度も改訂したLP案が5バージョンあります。全部URLで共有して選んでもらうことはできますか？

可能です。バージョンごとに個別URLを発行し、「AパターンURL」〜「EパターンURL」として一覧にまとめて共有してください。同じパスワードを全URLに設定しておくと、クライアントが毎回パスワードを入力する手間を省けます。

## 関連記事

- [Claude Appsで生成した管理画面モックをレビュー用URLにして共有する方法](https://giga-site.com/articles/claude-apps-admin-mock-review-url/index.md)
- [Claude Appsで生成したHTMLスライドをレビュー用URLにして共有する方法](https://giga-site.com/articles/claude-apps-slide-html-review-url/index.md)
- [Claude Appsで生成したフォーム付きページをレビュー用URLにして共有する方法](https://giga-site.com/articles/claude-apps-form-page-review-url/index.md)
- [Claude Appsで生成した社内ツール風プロトタイプをレビュー用URLにして共有する方法](https://giga-site.com/articles/claude-apps-internal-tool-prototype-review-url/index.md)
- [Claude Codeで生成したLP案をレビュー用URLにして共有する方法](https://giga-site.com/articles/claude-code-lp-draft-review-url/index.md)
- [Firebase Studioで生成したLP案をレビュー用URLにして共有する方法](https://giga-site.com/articles/firebase-studio-lp-draft-review-url/index.md)

```json
{
  "@context": "https://schema.org",
  "@type": "Article",
  "headline": "Claude Appsで生成したLP案をレビュー用URLにして共有する方法",
  "description": "Claude AppsでLP案を生成したマーケター・デザイナー向け。ArtifactsのHTML出力を3分でレビュー用URLにする方法と、クライアント共有時のパスワード設定・フィードバック回収の実践ノウハウを解説する。",
  "datePublished": "2026-06-25",
  "dateModified": "2026-06-25",
  "mainEntityOfPage": "https://giga-site.com/articles/claude-apps-lp-draft-review-url",
  "url": "https://giga-site.com/articles/claude-apps-lp-draft-review-url",
  "inLanguage": "ja",
  "image": "https://giga-site.com/og-image.png",
  "articleSection": "AI活用",
  "author": {
    "@type": "Organization",
    "name": "ギガサイト便"
  },
  "publisher": {
    "@type": "Organization",
    "name": "ギガサイト便"
  },
  "mainEntity": [
    {
      "@type": "Question",
      "name": "Claude AppsのArtifactsからHTMLをコピーするとき、CSSがインラインとタグの両方に分散しています。そのままアップロードして問題ありませんか？",
      "acceptedAnswer": {
        "@type": "Answer",
        "text": "問題ありません。CSSがインラインタグと`<style>`タグに混在していても、ブラウザは正常に処理します。スタイルの優先度が意図通りになっているかだけ確認してからアップロードしてください。"
      }
    },
    {
      "@type": "Question",
      "name": "Claude Appsが生成したHTMLにスクロールアニメーションが含まれています。URLで共有後も動作しますか？",
      "acceptedAnswer": {
        "@type": "Answer",
        "text": "IntersectionObserver APIを使ったスクロールアニメーションは通常のホスティング環境で動作します。CSSの`@keyframes`アニメーションも問題ありません。動作しない場合はブラウザのJavaScriptが無効になっているか、`prefers-reduced-motion`設定が有効になっている可能性があります。"
      }
    },
    {
      "@type": "Question",
      "name": "Claude Appsで何度も改訂したLP案が5バージョンあります。全部URLで共有して選んでもらうことはできますか？",
      "acceptedAnswer": {
        "@type": "Answer",
        "text": "可能です。バージョンごとに個別URLを発行し、「AパターンURL」〜「EパターンURL」として一覧にまとめて共有してください。同じパスワードを全URLに設定しておくと、クライアントが毎回パスワードを入力する手間を省けます。"
      }
    }
  ]
}
```