Web design with Codex

CodexでLPを改善するには

既存LPのファーストビュー、CTA、問い合わせ導線、画像、内部リンク、スマホ表示を見直し、公開前チェックまで進めるための入口です。

CodexをWebデザイン作業に使う時は、HTML/CSSの変更だけでなく、スマホ表示、内部リンク、素材権利、SEOタグ、公開前チェックまで一緒に確認します。

このページは非公式の実践ガイドです。提供元のように見せる表現やロゴ利用を避け、公開前には必ず人間が内容と差分を確認してください。

直す順番が決まっている

反応が出ないLPを見ると、文章から直したくなります。しかし実際に効くのはその手前にあることが多くあります。上から順に見てください。

  1. 行き先が1つに絞られているか
  2. スマホで行き先が見えているか
  3. 最初の画面に本題があるか
  4. 不安を消す説明があるか(費用、期間、断り方)
  5. 文章の表現

5番から直すと、直しても変わらないことが多くなります。作り方そのものはLPを作るページにあります。

行き先を絞る

問い合わせ、資料請求、電話、申し込みを並べると、どれも押されなくなります。読み手は選ぶ手間があると止まります。

置き方結果
行き先1つ押される
行き先2つ(主と副)主が押される
行き先3つ以上どれも押されない

どうしても複数必要な場合は、主にするものを1つ決めて、他は目立たない形にしてください。

不安を先に消す

行動しない理由は、興味が無いからではなく不安が残っているからのことが多くあります。次を本文に入れてください。

  • いくらかかるか(無料なら、どこまでが無料か)
  • どのくらい時間がかかるか
  • 断れるか、途中でやめられるか
  • 誰が対応するか
  • その後どうなるか

これらは「聞かれたら答える」ではなく、聞かれる前に書いてください。聞くために連絡する人はほとんどいません。

一度に1か所だけ直す

複数箇所を同時に直すと、何が効いたか分からなくなります。

  1. 直す前の状態を記録する
  2. 1か所だけ直す
  3. 2週間置く
  4. 同じ測り方で比べる
  5. 効いた場合は残し、効かなければ戻す

3番の期間を短くすると、差なのか偶然なのか判断できません。急いでいる時ほど、1か所に絞ってください。

任せられる範囲

任せられる自分で決める
文言の案を複数出すどの案にするか
スマホでの崩れを直す行き先を何にするか
構成の並べ替え案不安として何を書くか
不足している項目を挙げる効果の判断

実践ログから分かったこと

反応が出なかったLPで、最初に文章を直していた時期は変化がありませんでした。実際に効いたのは、行き先を3つから1つに減らしたことでした。文章は最後の要素だったと分かるまで時間がかかりました。

もう1つ、スマホで行き先のボタンが画面の下に隠れていたことがあります。パソコンでは見えていたので気づきませんでした。今は実機で開く手順を必ず入れています。

FAQ

何から直せばよいですか?

行き先の数、スマホでの見え方、最初の画面の順です。文章は最後で構いません。

行き先はいくつまでよいですか?

1つが基本です。複数必要な場合は、主にするものを決めて他は目立たない形にしてください。

どのくらいで効果が分かりますか?

2週間は置いてください。それより短いと、差なのか偶然なのか判断できません。

複数箇所を同時に直してよいですか?

すすめません。効いた要因が分からなくなります。

codex lp

LP制作は構成、本文、素材、公開前確認へ分ける

CodexでLPを作る時は、ChatGPTで訴求を整理し、CanvaやFigmaで素材を用意し、CodexでHTML/CSS化し、公開前チェックで確認します。CV保証やSEO効果保証はしません。