基本情報・検証プロファイル
BlueAI内部検証済み（教材条件）教材・手順・検証条件を、次の範囲で確認しています。この表示は利用者の成果や本番環境の安全性を保証するものではありません。
検証ラベルと公開基準を確認する- 対象
- マーケティング担当・小規模事業者・Web制作初心者
- 対象タグ
- マーケティング担当小規模事業者Web制作初心者
- 完成物の種類
- 静的LPと検証記録
- 対応環境
- macOS / Windows / WSL2 / Linux
- 扱うデータ
- 架空の企画書・ダミー素材
- リスク目安
- 中：低〜中（公開操作を含むため、人間確認が必要）
- 費用に関する注意
- 教材は無料。Claude CodeとCloudflare Pagesの利用条件・契約費用は各自で確認
検証条件
最終検証日：2026-08-14。検証環境と方法を公開し、条件が変わった場合は再確認します。
環境
- •Claude Code（native installer版）
- •macOS 13以降 / Windows 10以降 / WSL2 / Linux
- •Cloudflare Pages Direct Upload（静的ファイル）
方法
- 1ダミー素材だけで、計画・実装・検証・公開後確認の手順を通して確認
- 2390pxと1440pxの表示、キーボード操作、リンク、外部通信を確認
- 3公開前後の8項目チェックをVERIFICATION.mdへ記録する設計を確認
確認できたこと
- site/index.htmlとsite/styles.cssだけを公開対象にする手順
- 実在の実績・口コミ・個人情報を使わない入力素材とプロンプト
- 公開操作と認証情報の入力を人間の判断に残す手順
制約・未検証範囲
- ダミー素材での手順確認であり、利用者の公開成功や成果を保証しない
- Cloudflare PagesやClaude Codeの仕様・料金は変更される可能性がある
- 本番サイトの法務、アクセシビリティ、問い合わせ受付は別途設計が必要
TIMEBOX
90分の進め方
環境と安全設定
専用フォルダ、権限、復旧方法を準備
素材を配置
ダミー企画書と作業ルールをダウンロード
計画と実装
計画を先に確認して静的LPを生成
ローカル検証
内容・表示・操作・安全性を確認
手動で公開
静的ファイルだけをPagesへアップロード
公開後検証
URL上で8項目を確認し記録
10分
専用フォルダと安全境界を作る
顧客データや既存サイトを使わず、ラボ専用フォルダで始めます。公開や外部送信は最後まで人間が判断します。
1. 空の作業場所を作る
mkdir claude-lp-lab
cd claude-lp-lab
mkdir site`site/`だけを公開対象にします。BRIEF.mdや検証記録は公開フォルダの外へ置きます。
2. 権限を確認する
/permissions
/sandbox`default`モードを使い、公開・外部通信・広いファイル操作を自動許可しません。sandboxはmacOS、Linux、WSL2で利用できます。native Windowsでは未対応です。
このラボで使わないもの
実在顧客の名前・メール・売上、`.env`、APIキー、本番リポジトリ、`--dangerously-skip-permissions`は使いません。公開前に`site/`だけを確認します。
Claude Codeが未導入の場合
初心者向けの安全確認（必ず先に読んでください）
- 対象は macOS・Linux・WSL2・Windows PowerShell です。OSと契約条件が、Anthropic公式のインストール手順の現行記載に合うか確認します。
- コマンドをそのまま実行せず、公式ページのURLと内容を先に開いて確認します。
- 本番環境・本番リポジトリ・秘密情報（APIキー、.env、顧客データ）がある端末では実行しません。
- 不明な点がある場合は中断し、公式手順と管理者の指示を確認してから進めます。
macOS / Linux / WSL2
curl -fsSL https://claude.ai/install.sh | bashWindows PowerShell
irm https://claude.ai/install.ps1 | iex動作確認
claude --version
claude doctorFreeプランはClaude Codeを含みません。Pro・Max・Team・EnterpriseまたはConsole等、利用可能なアカウント条件を確認してください。
10分
ダミー素材をダウンロードする
すべて架空情報です。5ファイルを作業フォルダ直下へ保存し、ファイル名を変えずに使います。
25分
計画を確認してからLPを生成する
Claude Codeを作業フォルダで起動し、計画と実装を分けます。公開操作は許可しません。
Claude Codeを起動
claudeプロンプト1：計画だけ作る
BRIEF.md と CLAUDE.md を読んでください。
まだファイルを作成・編集せず、次の4点だけを日本語で提示してください。
1. LPの目的と想定読者の理解
2. 作成予定のファイル
3. 90分で完成させる実装計画
4. 品質・安全面のリスクと確認方法
外部サービスへの登録、公開、ネットワーク送信は行わないでください。プロンプト2：承認後に実装
計画を承認します。CLAUDE.md の制約を守り、site/index.html と site/styles.css を実装してください。
必須条件:
- BRIEF.md の文言・数値だけを使い、存在しない実績や口コミを作らない
- JavaScript、外部CDN、外部画像、フォーム送信機能は追加しない
- 390pxと1440pxで横スクロールを発生させない
- 見出し階層、キーボードフォーカス、十分なコントラストを確保する
- CTAはページ内の問い合わせ案内へ移動させる
- 実装後、変更ファイルと未確認事項を報告する
公開やgit pushは行わないでください。20分
ローカルで品質と安全性を検証する
`site/index.html`をブラウザで開き、Claudeのレビューと人間の目視確認を両方行います。
プロンプト3：変更前レビュー
site/ の実装をレビューしてください。ファイルを変更する前に、次の観点を合格・不合格・要目視確認で報告してください。
- BRIEF.mdとの一致
- HTMLのlang、title、description、見出し構造
- 390px相当での横スクロール要因
- キーボード操作とフォーカス表示
- リンク切れ、存在しないファイル参照、外部通信
- 実績・価格・連絡先の捏造や秘密情報
修正が必要なら、理由と対象箇所を示して私の承認を待ってください。公開は行わないでください。Claudeが「合格」と言っても、ブラウザ表示とリンク操作は自分で確認します。修正する場合は理由を確認してから許可し、再度同じチェックを行います。
15分
静的ファイルを手動で公開する
このラボではCloudflare PagesのDirect Uploadを例にします。認証情報をClaudeへ渡さず、ブラウザから本人が操作します。
- 1Cloudflare DashboardのWorkers & Pagesを開く
- 2Create application → Get started → Drag and drop your filesを選ぶ
- 3学習用のプロジェクト名を入力し、siteフォルダだけをアップロードする
- 4Deploy siteを押し、発行されたpages.devのURLを開く
本番サイトでは先に方式を決めてください。 Direct Uploadで作ったPagesプロジェクトは、同じプロジェクトのままGit integrationへ切り替えられません。継続運用するサイトはGit連携を最初から選ぶか、別プロジェクトで移行します。Drag and dropは静的ファイル用で、`functions`フォルダのビルドには対応しません。
10分
公開URLで最終確認し、証拠を残す
公開できたことではなく、合格条件を満たしたことを完了とします。結果をVERIFICATION.mdへ残してください。
自己チェック
成果物の確認項目
すべてを実際に確認してから、自己チェックの完了を記録してください。このチェックはサイト側の検証・合格判定ではなく、状態はこのブラウザに保存されます。
0 / 8 完了
検証条件と公式根拠
最終検証日 2026-08-14。環境：Claude Code（native installer版）、macOS 13以降 / Windows 10以降 / WSL2 / Linux、Cloudflare Pages Direct Upload（静的ファイル）。仕様は公開前に必ず公式情報を再確認してください。