Growth
CTAが弱い・多すぎるときの直し方
CTAはユーザーの次の行動を決める入口です。ボタンの色や文言だけでなく、直前の説明、周囲の余白、他リンクとの優先順位まで合わせて直します。
ui.design: llm-growthui.design: growth-basic
まず確認する症状
- 主要CTAより説明カードや補助リンクが先に目に入る。
- CTA文言が抽象的で、押した後に何が起きるか分からない。
なぜ問題か
- CVの入口が曖昧だと、関心のあるユーザーでも離脱しやすくなります。
- 開発・マーケ間で主CTAの定義が揺れると、改善施策の検証も難しくなります。
診断で見る指標
ファーストビュー内の主CTA有無
CTA文言の具体性
CTA周辺の競合リンク数
scan開始率や問い合わせ遷移率
修正方法
最小修正
主CTAを1つ決める
ファーストビューでは最も重要な行動を1つに絞り、補助リンクは視覚優先度を下げます。
推奨修正
押した後の価値を文言に含める
「無料で診断する」だけでなく「URLを入れるだけ」など、摩擦の低さを近くに示します。
さらに改善
結果画面まで計測する
CTAクリック、scan開始、結果閲覧、Review Pack相談までを同じファネルで追います。
受け入れ条件
- 01PCとスマホの両方で目視確認し、主なCTAまたは操作対象が迷わず見つかる。
- 02キーボード操作、読み上げ補助、または自動検査で再発しやすい項目を確認する。
- 03修正後にui.designで再スキャンし、同じ所見が残る場合は原因を分解する。
コーディングエージェント向け修正指示
目的: ファーストビューの主CTAを1つに整理し、押した後の価値と不安解消をCTA付近に追加してください。PC/スマホでCTAが折り返しや重なりなく表示されることを確認してください。
参考資料
よくある失敗
- ボタン色だけ変えて、文言や周囲の説明を直さない。
- 見た目だけを整え、見出し、リンク、フォームラベルなどの意味構造を直さない。
- 1つの指摘だけを直し、同じ原因から出た別画面の再発を確認しない。