顧客が抱える「課題」を独自メソッドで「成功」へ導くマガジン。

KNOWHOWノウハウ

  1. HOME
  2. ノウハウ
  3. CVR
  4. すべてのページの画面下部やサイドに、利用者の画面スクロールに応じて「追従移動」するCTAを設置できている
CVR

/ 更新日

すべてのページの画面下部やサイドに、利用者の画面スクロールに応じて「追従移動」するCTAを設置できている

「CTA」と言えば、Webページの「ヘッダー」「フッター」、そして「ファーストビュー」などに設置されますが、それ以外に利用者の画面スクロールに追従させて常に目に入るようにする「追従移動型CTA」というものがあります。

長尺ページですと、「実際にアクションを起こしたいと思ってもCVへ進むリンクが近くに見つからない」ということもありますが、「追従移動型CTA」によってそれを防ぐことができます。

▼右サイドのフリープラン・オンラインデモは追従移動型CTA

右サイドのフリープラン・オンラインデモは追従移動型CTA

https://info.securesamba.com/

▼下の無料プランお試し/資料ダウンロードと、右下の紹介資料は追従移動型CTA

下の無料プランお試し/資料ダウンロードと、右下の紹介資料は追従移動型CTA

https://bow-now.jp/

「追従移動型CTA」を使うことによるメリット・デメリットを確認する

では、「追従移動型CTA」のメリット・デメリットについて、確認していきましょう。

メリット

関心が向上したときに視界の中に「CTA」があるため、すぐ行動しやすい

デメリット

画面表示スペースが狭くなってしまう(特にスマートフォンで顕著)

サイトの内容によっても異なりますが、「お問い合わせ」「資料ダウンロード」「ウェビナー/セミナー」などへの詳細ページや入力フォームへの導線を常に確保できているため、行動を起こしたいとなったときにCVを逃しにくいと言えます。

一方で、常に追従表示しているため表示スペースが狭くなってしまうデメリットがあります。特にスマートフォンでの閲覧が多いサイトの場合は、不利になりやすいです。

これら、自社サイトの特性をふまえたうえで、判断するのが望ましいです。

実際に、「追従移動型CTA」を自社のWebページに導入してみる

自社サイトに「追従移動型CTA」を設置するにあたっては、HTML・CSSファイルに手を加える必要があるため、社内のエンジニア・デザイナーに相談した上で進めるのが良いと思いますが、以下のようなタグ・コードを各ページに追加記述することで可能です。

実際にはもう少し情報を加える必要がありますが、画面右下を追従移動させる場合は、基本的には 以下のようなサンプルコード構成になります。

▼サンプルコード

CVが伸び悩んでいたサイトが、「追従移動型CTA」を設置することによって改善されたということも、少なくないです。ぜひ一度、自社サイトに導入することを検討してみましょう。

まとめ

1つでも当てはまったらチェックしましょう。

  • 「追従移動型CTA」を使うことによるメリット・デメリットを確認できた
  • 検討した上で、「追従移動型CTA」を自社のWebページに導入できた

月間のお問い合せを
「10件、20件、それ以上」増やせます

せっかくあるWebサイトを、マーケティングの魔法で活用しませんか?
弊社では 「月に3社様限定」 で、
専門コンサルタント(経験10年以上)による無料診断を行っております。
たった1時間で「競合に勝つ方法がわかった!」
そう思っていただける会にしたいと考えております。
今よりもっと、お問合せを増やしましょう!!

監修者情報

グロースマーケティング研究部

福田湧基

コンサルテイング本部 事業開発課所属

福田湧基(ふくだ ゆうき)

クラウドサーカス株式会社で、デジタル集客およびDX支援コンサルを担当。
昨今のAI時代における企業の競争力強化を最大の目的とし、AIO対策サービスの開発から市場への展開までを主導しています。

監修者情報

グロースマーケティング研究部

白道 獅化

コンサルテイング本部 事業開発課 AI部門所属

白道 獅化(しらみち しか)

SEO・広告を中心としたデジタルマーケティングの領域で5年目を迎え、これまで1000社以上のサイトデータ分析に携わってきました。
現在はAIO対策のコンサルティング支援を提供する事業のサービス開発を担当しています。

成功へ導く
6つの要素