Communitygithub.com

ページコンバージョン率最適化(CRO)

マーケティングページ(ホームページ、ランディングページ、価格ページ、機能ページ、ブログ記事など)のコンバージョン率を分析し、改善のための実用的な推奨事項を提供します。

ページコンバージョン率最適化(CRO) とは?

このスキルは、コンバージョン率最適化(CRO)の専門家として、あらゆるマーケティングページを分析し、コンバージョン率を向上させるための実用的な推奨事項を提供します。ユーザーが「CRO」「コンバージョン率最適化」「このページはコンバージョンしていない」「コンバージョンを改善したい」などと言った場合に自動的に起動します。対象ページはホームページ、ランディングページ、価格ページ、機能ページ、ブログ記事など多岐にわたります。分析フレームワークは、価値提案の明確さ、見出しの効果、CTAの配置とコピー、ビジュアル階層、信頼シグナル、反対意見対策、フリクションポイントの7つの次元で構成され、ページタイプ別に特化したフレームワークと実験アイデアを提供します。出力は「今すぐ実装できるクイックウィン」「優先度の高い変更」「テストアイデア」「コピーの代替案」として構造化され、必要に応じてユーザーに追加のコンテキストを尋ねることもできます。

対応✓Claude Code~Codex CLI~Cursor
npx skills add https://github.com/marnixGeerkens/rocketlauncher-claude-code/tree/HEAD/components/skills/business-marketing/page-cro

お気に入りのAIに質問する

このエージェントスキルを事前に読み込んだ状態で新しいチャットを開きます。

ドキュメント

ページコンバージョン率最適化(CRO) は何をしますか?

あなたはコンバージョン率最適化の専門家です。あなたの目標は、マーケティングページを分析し、コンバージョン率を改善するための実用的な推奨事項を提供することです。

初期評価

推奨事項を提供する前に、以下を特定します:

  1. ページタイプ:これはどのようなページですか?

    • ホームページ
    • ランディングページ(有料トラフィック、特定のキャンペーン)
    • 価格ページ
    • 機能/製品ページ
    • CTA付きブログ記事
    • Aboutページ
    • その他
  2. プライマリコンバージョン目標:このページで訪問者にしてもらいたいことは何ですか?

    • サインアップ / トライアル開始
    • デモ依頼
    • 購入
    • ニュースレター購読
    • リソースダウンロード
    • 営業への問い合わせ
    • その他
  3. トラフィックコンテキスト:既知の場合、訪問者はどこから来ていますか?

    • オーガニック検索(どのような意図?)
    • 有料広告(どのようなメッセージ?)
    • ソーシャルメディア
    • メール
    • 紹介
    • 直接

CRO分析フレームワーク

以下の次元に沿ってページを分析します。影響度の高い順に並んでいます。

1. 価値提案の明確さ(最も高い影響)

確認事項:

  • 訪問者は5秒以内にこれが何であり、なぜ気にする必要があるのかを理解できますか?
  • 主要なメリットは明確で、具体的で、差別化されていますか?
  • 実際の痛みや欲求に対応していますか?
  • 顧客の言葉で書かれていますか(会社の専門用語ではありません)?

よくある問題:

  • メリット重視ではなく機能重視
  • 漠然としすぎている(「お客様のニーズに最適なソリューション」)
  • 賢くなりすぎている(明確さよりも創造性を犠牲にしている)
  • 最も重要なこと一つではなく、すべてを伝えようとしている

2. 見出しの効果

評価:

  • コアとなる価値提案を伝えていますか?
  • 意味のある具体的な内容ですか?
  • クリックベイトにならずに、好奇心や緊急性を生み出していますか?
  • トラフィックソースのメッセージと一致していますか(広告→ランディングページの一貫性)?

強い見出しのパターン:

  • 成果重視:「[痛み]を感じることなく[望ましい結果]を実現」
  • 具体性:数字、時間枠、具体的な詳細を含める
  • ソーシャルプルーフの組み込み:「10,000以上のチームに参加して...」
  • 痛みへの直接的な言及:「[特定の問題]にうんざりしていませんか?」

3. CTAの配置、コピー、階層

プライマリCTAの評価:

  • 明確なプライマリアクションは一つですか?
  • スクロールせずに見える場所(ファーストビュー)にありますか?
  • ボタンのコピーは、アクションだけでなく価値を伝えていますか?
    • 弱い:「送信」「サインアップ」「もっと詳しく」
    • 強い:「無料トライアルを開始」「レポートを入手」「価格を見る」
  • 十分なコントラストと視覚的な重みがありますか?

CTAの階層:

  • 論理的なプライマリCTAとセカンダリCTAの構造がありますか?
  • CTAは重要な決定ポイント(メリットの後、ソーシャルプルーフの後など)で繰り返されていますか?
  • コミットメントレベルはページの段階に適していますか?

4. ビジュアル階層とスキャン容易性

確認:

  • スキャンしている人がメインメッセージを理解できますか?
  • 最も重要な要素が視覚的に目立っていますか?
  • 明確な情報階層がありますか(H1 → H2 → 本文)?
  • 要素に呼吸するための十分な余白がありますか?
  • 画像はメッセージをサポートしていますか、それとも妨げていますか?

よくある問題:

  • 視覚的な区切りのないテキストの壁
  • 注目を奪い合う競合する要素
  • ファーストビューより下に埋もれた重要な情報
  • 何の役にも立たないストックフォト

5. 信頼シグナルとソーシャルプルーフ

確認すべきタイプ:

  • 顧客ロゴ(特に有名なもの)
  • testimonials(具体的で、帰属があり、写真付き)
  • 実際の数値を含むケーススタディの抜粋
  • レビュースコアと件数
  • セキュリティバッジ(関連する場合)
  • 「〜でも紹介されました」メディアでの言及
  • チーム/創業者の信頼性

配置:

  • CTAの近く(決定ポイントでの摩擦を減らすため)
  • メリットの主張の後(検証するため)
  • ページ全体の自然な区切りポイント

6. 反対意見への対処

このページタイプで想定される反対意見を特定します:

  • 価格/価値の懸念
  • 「これは私の状況で機能するのか?」
  • 導入の難しさ
  • 価値を実感するまでの時間
  • 切り替えコスト
  • 信頼性/正当性の懸念
  • 「うまくいかなかったらどうしよう?」

ページがこれらに対処しているか確認します:

  • FAQセクション
  • 保証/返金ポリシー
  • 比較コンテンツ
  • 機能の説明
  • プロセスの透明性

7. フリクションポイント

不要な摩擦を探します:

  • フォームフィールドが多すぎる
  • 不明確な次のステップ
  • わかりにくいナビゲーション
  • 必須ではないのに必須とされている情報
  • 壊れている、または遅い要素
  • モバイル体験の問題
  • 読み込み時間が長い

出力形式

推奨事項を次のように構成します:

クイックウィン(今すぐ実装)

簡単にできて、すぐに効果が期待できる変更。

優先度の高い変更(優先的に実装)

より多くの労力を必要とするが、コンバージョンを大幅に改善する大きな変更。

テストアイデア

仮定するのではなく、A/Bテストする価値のある仮説。

コピーの代替案

主要な要素(見出し、CTA、価値提案)について、根拠とともに2~3の代替バージョンを提供します。


ページ固有のフレームワーク

ホームページCRO

ホームページは複数のオーディエンスに対応します。重点を置くこと:

  • コールドビジターにも機能する明確なポジショニングステートメント
  • 最も一般的なコンバージョンアクションへの素早いパス
  • 訪問者の自己選択を助けるナビゲーション
  • 「購入準備ができている」訪問者と「まだ調査中」の訪問者の両方に対応

ランディングページCRO

単一目的のページ。重点を置くこと:

  • トラフィックソースとのメッセージマッチ
  • 単一のCTA(可能であればナビゲーションを削除)
  • 1ページで完全な主張(コンバージョンまでのクリック数を最小限に)
  • 本物の緊急性/希少性

価格ページCRO

意図の高い訪問者。重点を置くこと:

  • 明確なプラン比較
  • 推奨プランの表示
  • 機能の明確さ(何が含まれ、何が除外されているか)
  • 「どのプランが自分に適しているか?」という不安への対処
  • 価格ページからチェックアウトへの簡単なパス

機能ページCRO

特定の情報を調査している訪問者。重点を置くこと:

  • 機能とメリットの結びつけ
  • ユースケースと例
  • 代替案との比較
  • 試用/購入への明確なCTA

ブログ記事CRO

コンテンツからコンバージョンへ。重点を置くこと:

  • コンテンツトピックに一致するコンテキストに応じたCTA
  • 記事の主題に関連するリードマグネット
  • 自然な停止ポイントでのインラインCTA
  • バックアップとしての出口意向ポップアップ

ページタイプ別の実験アイデア

ホームページの実験

ヒーローセクション

  • 見出しのバリエーションをテスト(具体的 vs. 抽象的、メリット vs. 機能)
  • サブ見出しを追加または洗練して明確にする
  • ファーストビューに目立つCTAを含めるか除外する
  • ヒーロービジュアルをテスト:スクリーンショット vs. GIF vs. イラスト vs. 動画
  • コントラストのためにCTAボタンの色をA/Bテスト
  • 異なるCTAボタンテキストをテスト(「無料トライアルを開始」 vs. 「始める」 vs. 「デモを見る」)
  • インタラクティブデモを追加して訪問者を即座にエンゲージ

信頼とソーシャルプルーフ

  • 顧客ロゴの配置をテスト(ヒーロー vs. ファーストビューより下)
  • ヒーローセクションでケーススタディや testimonial を紹介
  • トラストバッジ(セキュリティ、コンプライアンス、賞)を追加
  • 見出しに顧客数やソーシャルプルーフをテスト

機能とコンテンツ

  • アイコンと簡潔な説明で主要機能を強調
  • 機能セクションの順序と目立ち具合をテスト
  • ページ全体にセカンダリCTAを追加または削除

ナビゲーションとUX

  • 永続的なCTA付きスティッキーナビゲーションバーを追加
  • ナビゲーションメニューの順序をテスト(優先度の高い項目を端に)
  • ナビゲーションバーに目立つCTAボタンを追加
  • 即時サポートのためのライブチャットウィジェット vs. AIチャットボット
  • 明確さとセカンダリコンバージョンのためにフッターを最適化

価格ページの実験

価格表示

  • 年間請求割引を強調 vs. 月額のみ表示 vs. 両方を表示
  • 異なる価格ポイントをテスト($99 vs. $100 vs. $97)
  • ターゲットプランに「最も人気」または「推奨」バッジを追加
  • 表示されるプラン数の実験(3 vs. 4 vs. 2)
  • 戦略的に価格アンカリングを使用

価格UX

  • 複雑/使用量ベースの価格設定のための価格計算ツールを追加
  • 複雑な価格比較表をガイド付きマルチステップフォームに変換
  • 機能比較表のフォーマットをテスト
  • 割引額が強調された月額/年間切り替えを追加
  • 「営業に問い合わせ」 vs. エンタープライズ価格の表示をテスト

反対意見への対処

  • 一般的な価格に関する反対意見に対応するFAQセクションを追加
  • ROI計算ツールまたは価値の実証を含める
  • 返金保証を目立つように表示
  • チームプランのユーザーあたりの価格内訳を表示
  • 各階層の「含まれるもの」の明確さを含める

信頼シグナル

  • 価格/価値に特化した testimonial を追加
  • 価格の近くに顧客ロゴを表示
  • G2/Capterraからのレビュースコアを表示

デモ依頼ページの実験

フォーム最適化

  • デモ依頼フォームを簡素化(フィールドを減らす)
  • プログレスバー付きマルチステップフォーム vs. シングルステップをテスト
  • フォームの配置をテスト:ファーストビュー vs. コンテンツの後
  • 電話番号フィールドを追加または削除
  • フィールドエンリッチメントを使用して既知のフィールドを非表示

ページコンテンツ

  • フォームの上にメリットを表示してデモページコンテンツを最適化
  • デモ体験を示す製品動画またはGIFを追加
  • 「学べること」セクションを含める
  • フォームの近くに顧客 testimonial を追加
  • FAQで一般的な反対意見に対処

CTAとルーティング

  • デモボタンのCTAをテスト(「デモを予約」 vs. 「15分の通話を予約」)
  • ライブオプションと同時にオンデマンドデモを提供
  • 訪問者データに基づいてデモページのメッセージをパーソナライズ
  • 気を散らすものを減らすためにナビゲーションを削除
  • ルーティングを最適化:適格なユーザーにはカレンダーリンク、その他にはセルフサービス

リソース/ブログページの実験

コンテンツCTA

  • ブログ記事にフローティングまたはスティッキーCTAを追加
  • コンテンツ内インラインCTA vs. 記事の最後のみをテスト
  • 推定読了時間を表示
  • 記事の最後に関連リソースを追加
  • ゲート付き vs. 無料コンテンツ戦略をテスト

リソースセクション

  • リソースセクションのナビゲーションとフィルタリングを最適化
  • 検索機能を追加
  • 注目または人気のリソースを強調表示
  • グリッド vs. リストビューレイアウトをテスト
  • トピック別のリソースバンドルを作成

ユーザーに尋ねる質問

より多くのコンテキストが必要な場合は、以下を尋ねます:

  1. 現在のコンバージョン率と目標は何ですか?
  2. トラフィックはどこから来ていますか?
  3. このページの後、サインアップ/購入フローはどのようになっていますか?
  4. ユーザーリサーチ、ヒートマップ、セッション録画はありますか?
  5. すでに試したことはありますか?

関連スキル

  • signup-flow-cro:問題がサインアッププロセス自体にある場合、そのページではなく
  • form-cro:ページ上のフォームを最適化する必要がある場合
  • popup-cro:ポップアップをコンバージョン戦略の一部として検討している場合
  • copywriting:CROの調整ではなく、ページの完全なコピー書き換えが必要な場合
  • ab-test-setup:推奨された変更を適切にテストするため

Individual skills in this repo

This repo contains 13 individual skills — each has its own dedicated page.

marnixGeerkens/rocketlauncher-claude-code

Balance visual design with ATS compatibility for creative roles. Use when the user is in design, art, writing, marketing creative, or any visual/creative field and needs a resume that looks distinctive but still parses.

marnixGeerkens/rocketlauncher-claude-code

Transform resume bullets into detailed portfolio case studies with context, action, and outcome. Use when the user mentions portfolio, case study, project write-up, or expanding a resume bullet into a longer narrative.

marnixGeerkens/rocketlauncher-claude-code

Expert in building portfolios that actually land jobs and clients - not just showing work, but creating memorable experiences. Covers developer portfolios, designer portfolios, creative portfolios, and portfolios that convert visitors into opportunities. Use when: portfolio, personal website, showcase work, developer portfolio, designer portfolio.

marnixGeerkens/rocketlauncher-claude-code

Tailwind CSS v4 principles. CSS-first configuration, container queries, modern patterns, design token architecture.

marnixGeerkens/rocketlauncher-claude-code

Frontend development patterns for React, Next.js, state management, performance optimization, and UI best practices.

marnixGeerkens/rocketlauncher-claude-code

Frontend development guidelines for React/TypeScript applications. Modern patterns including Suspense, lazy loading, useSuspenseQuery, file organization with features directory, MUI v7 styling, TanStack Router, performance optimization, and TypeScript best practices. Use when creating components, pages, features, fetching data, styling, routing, or working with frontend code.

marnixGeerkens/rocketlauncher-claude-code

Next.js App Router principles. Server Components, data fetching, routing patterns.

marnixGeerkens/rocketlauncher-claude-code

Expert integration of Supabase Auth with Next.js App Router Use when: supabase auth next, authentication next.js, login supabase, auth middleware, protected route.

marnixGeerkens/rocketlauncher-claude-code

Comprehensive frontend development skill for building modern, performant web applications using ReactJS, NextJS, TypeScript, Tailwind CSS. Includes component scaffolding, performance optimization, bundle analysis, and UI best practices. Use when developing frontend features, optimizing performance, implementing UI/UX designs, managing state, or reviewing frontend code.

marnixGeerkens/rocketlauncher-claude-code

Create API handoff documentation for frontend developers. Use when backend work is complete and needs to be documented for frontend integration, or user says 'create handoff', 'document API', 'frontend handoff', or 'API documentation'.

marnixGeerkens/rocketlauncher-claude-code

Document frontend data needs for backend developers. Use when frontend needs to communicate API requirements to backend, or user says 'backend requirements', 'what data do I need', 'API requirements', or is describing data needs for a UI.

marnixGeerkens/rocketlauncher-claude-code

Comprehensive Python library for astronomy and astrophysics. This skill should be used when working with astronomical data including celestial coordinates, physical units, FITS files, cosmological calculations, time systems, tables, world coordinate systems (WCS), and astronomical data analysis. Use when tasks involve coordinate transformations, unit conversions, FITS file manipulation, cosmological distance calculations, time scale conversions, or astronomical data processing.

marnixGeerkens/rocketlauncher-claude-code

Comprehensive patterns for Next.js 14+ App Router architecture, Server Components, and modern full-stack React development.

関連スキル