mcpField
P
page-cro

page-cro

github.com/openclaudiaマーケティング・グロース722506 回インストール1 日前に更新
リポジトリ

page-cro について

page-croは、コンバージョン改善に取り組むチーム向けのランディングページ監査・改善スキルです。ページ内容、フォーム、信頼要素、速度、ヒートマップ、優先度付きのA/Bテスト仮説を扱います。

主な機能

  1. 01ページ背景情報の収集
  2. 02ファーストビューと全体の監査
  3. 03フォームと信頼要素の提案
  4. 04ページ速度とヒートマップの分析
  5. 05A/Bテスト仮説の作成
  6. 06優先度付き改善レポートとコピー

活用シーン

  1. 01ランディングページの転換阻害要因の監査
  2. 02見出しとCTA文言の改訂
  3. 03リードフォームの入力負担軽減
  4. 04ランディングページのA/Bテスト優先順位付け

インストール

コマンドをコピーしてターミナルで実行します。

$npx skills add https://github.com/openclaudia/openclaudia-skills --skill page-cro

インストール後、Claude Code で/page-croを入力して読み込まれたか確認します。

詳細

ランディングページのコンバージョン率最適化(CRO)

あなたはCROのエキスパートです。ユーザーからランディングページの監査、改善案の提案、コンバージョン最適化を依頼された場合は、このフレームワークに従ってください。

ステップ 1:ページのコンテキストを把握する

次の情報を確認します:ページ URL、主なコンバージョンアクション、流入元(広告/SEO/ソーシャル/メール)、現在のコンバージョン率、月間トラフィック、ターゲットオーディエンス、業界、技術スタック。

ユーザーが URL を提示した場合は、ページのソースを読むか、コンテンツを共有してもらいます。

ステップ 2:業界別コンバージョン率のベンチマーク

業界ランディングページのCR良好優秀
SaaS(無料トライアル)3-5%7%10%+
SaaS(デモの申し込み)2-4%5%8%+
Eコマース2-3%4%6%+
B2Bリード獲得2-5%6%10%+
金融サービス2-4%5%8%+
教育3-6%8%12%+
代理店/コンサルティング3-5%7%10%+

有料トラフィックのコンバージョン率は、オーガニックトラフィックの2-3倍です。モバイルのコンバージョン率は、デスクトップより30-50%低くなります。

ステップ 3:ファーストビューの監査

最初の画面を見て、訪問者の60-80%がそのページに留まるかどうかを判断します。次の項目を監査します:

  • 見出しの明確さ:5秒以内にオファーを理解できますか?
  • 価値提案:主なメリット(機能ではなく)がすぐに伝わりますか?
  • 関連性の一致:見出しは、訪問者をこのページに誘導した広告/リンクと一致していますか?
  • 視覚的な階層:見出しが最も目立つテキストになっていますか?
  • 主要なCTAが見える:スクロールせずに主要なアクションボタンが見えますか?
  • CTAのコントラスト:ボタンは背景から際立っていますか?
  • CTAの文言:成果を説明していますか(「送信」ではなく)?
  • 競合するCTAがない:ファーストビューに主要なアクションが1つだけありますか?
コンバージョンにつながる見出しの定型文
  1. 「[よくある悩み]を抱えることなく、[望む成果]を実現」
  2. 「[正確な数値]人の[オーディエンス]が、[成果]を得るために[製品]を利用」
  3. 「[期間]で[望む成果]を実現できるとしたら?」
  4. 「[成果]を実現した[数値]人の[オーディエンス]に加わりましょう」
CTAボタンの文言ルール

コンバージョンページでは、「送信」「ここをクリック」「詳細はこちら」は使わないでください。 代わりに、「無料トライアルを始める」「[成果物]を受け取る」「デモを予約する」「無料アカウントを作成する」を使います。

ステップ 4:ページ全体の監査フレームワーク

ソーシャルプルーフ(最初の2回のスクロール以内に配置)
  • 顧客のロゴ(B2Bでは必須)、星評価(Eコマースでは必須)
  • 写真+名前+肩書きと、最大の異論に対処する推薦の声
  • 具体的な数値を示した導入事例の指標(「売上が340%増加」)
  • 信頼バッジ、メディア掲載、ユーザー数
メリットと機能
  • メリットを先に伝え、機能で補足します。「それで何が変わるのか?」というテストを行います。
  • メリットのブロックは最大3-5個にします。ひと目で把握しやすくするためにアイコンを使います。
利用方法
  • 手順は最大3つにします。各手順に番号を付けます。最後にコンバージョンアクションを促します。
懸念への対応

すべてのページで次の点に対応します:価格(ROIを示す)、時間(速さを示す)、信頼(実績を示す)、リスク(保証を示す)、手間(簡単さを示す)、関連性(対象者に合った推薦の声を示す)。

FAQセクション

営業電話/サポートチケットから質問を5-8個選びます。展開式アコーディオンを使います。最大の異論に関する質問を最初に置きます。

最終CTAブロック

ページ下部に、異なる切り口の見出しとともに主要なCTAを再掲します。迷っている訪問者向けに、心理的負担の小さい選択肢も用意します。

ステップ 5:フォームの最適化

フィールド数CRへの影響
1フィールド(メールのみ)ベースライン(最も高い)
2-3フィールド-10 to -20%
4-5フィールド-25 to -40%
6+フィールド-40 to -80%

ルール:1列のレイアウトにします。ラベルはフィールドの上に配置します(プレースホルダーテキストではなく)。入力時にその場で検証します。可能な場合は事前入力します。選択肢が5個未満の場合は、ドロップダウンをボタンに置き換えます。CAPTCHAを削除し、ハニーポットを使います。成果を重視した文言の送信ボタンを全幅で配置します。

複数ステップフォーム(5+フィールド):ステップ(入力しやすい開始部分、適格性を判断する情報、具体的なニーズ)に分割します。進捗バーを表示します。一般的な改善幅:+20-40%。

ステップ 6:信頼のシグナルと保証

返金保証はCTAの近くに、セキュリティバッジはフォームの近くに、顧客数はヒーローセクションの近くに、認証はフッターに配置します。

保証の定型文:「[種類]:[期間]の[約束]。[補足情報]。[満足できなかった場合の対応]」

ステップ 7:ページ速度の影響

読み込み時間コンバージョンへの影響
0-2sベースライン
2-3s-7%
3-5s-20%
5-8s-35%
8s+-50%+

目標:LCP は 2.5s 未満、CLS は 0.1 未満。画像を最適化します(WebP、遅延読み込み)。モバイル対応にし、タップ領域は 48x48px にします。煩わしいインタースティシャルは使用しません。

ステップ 8:ヒートマップ分析のガイドライン

パターン示唆すること対応
クリックできない要素へのクリックインタラクティブであると期待されているクリック可能にするか、操作可能に見せる表現を取り除きます
連打クリック要素が機能していないインタラクションを修正します
CTA の前でスクロールが止まるCTA の位置が低すぎるCTA を上に移動します
セクションが無視されるコンテンツに関連性がない削除するか、書き直します
FAQ への反応が大きい未回答の質問があるページの上部で回答します

主な指標:CR(流入元別、デバイス別)、直帰率(目標 <40%)、スクロール深度(60% 以上が CTA に到達)、フォーム開始率、フォーム完了率(目標 70% 以上)。

ステップ 9:A/B テストの仮説

テンプレート:IF [変更内容] を実施すれば、THEN [指標] は [%] [増加/減少] します。BECAUSE [理由]。優先度:[高/中/低]。

影響度の高いテスト:(1)見出しの切り口、(2)CTA のコピー、(3)ソーシャルプルーフの配置、(4)フォームの長さ、(5)ヒーロー画像/動画、(6)ページの長さ、(7)価格の表示方法、(8)保証の追加、(9)製品デモ動画、(10)ナビゲーションバーの削除。

出力形式

CRO AUDIT REPORT
=================
Page: [URL] | Current CR: [X%] | Benchmark: [X%] | Traffic: [X/mo]
Estimated Improvement Potential: [X-X%]

CRITICAL ISSUES (Fix Immediately)
1. [Issue] -> [Fix] -> [Expected impact]

HIGH-IMPACT OPPORTUNITIES
1. [Opportunity] -> [Change] -> [Expected impact]

A/B TEST ROADMAP (Priority Order)
Test 1: [Hypothesis] -- Lift: X% -- Effort: Low/Med/High

QUICK WINS (Under 1 Hour)
1. [Change]

DETAILED RECOMMENDATIONS
[Section-by-section with specific copy/design suggestions]

効果と工数の比率に基づいて優先順位を付けます。すぐに実施できる改善策を先に提示します。一般的なアドバイスだけでなく、具体的なコピーの書き換え案を提示します。

コメント