Call to Action

cta

cta_009

誘導したい項目が4つある時、シンプルでありながらもパット見でわかるようにしています。

cta_008

整体院や鍼灸院を想定した行動喚起(Call to Action)です。院長の一言を添えたようなカタチで予約やお問い合わせフォームに誘導しています。

cta_007

電話への誘導をメインとしつつ、3つのフォームへの誘導を並べています。3つのリンクは文字だけのシンプルなものでありながらもカラム全体でリンクが有効にしています。

cta_006

主要な2つのアクションに誘導したいCTA
リンクボタンは横並びになる文字数に応じて対応できる設定です。

cta_005

主要な2つのアクションに誘導したいCTA
それぞれのリンクボタンの上に、かざり付きの一言を添えるデザインです

cta_004

主要な2つのアクションに誘導したい大きなCTA
2つに分割したブロックで、カラム背景の色を若干変えて変化をつけています。

cta_003

主要な2つのアクションに誘導したいCTA
2つに分割したブロックで、カラム背景の色を若干変えて変化をつけています。各カラムは、英語表記・タイトルと短い説明文をリスト・テーブル式で左右に並べ、アクションとなるボタンはリンクデザインで設定しています。

cta_002

背景に画像があるブロックに、色付き角丸を重ねるCTA
ブロック背景に画像を指定し、色付きの角丸はカラム1で指定して重ねています。1つのカラムにリンクボタンを2つ横に並べるために、リンクデザインで幅や余白を設定しています。

cta_001

色付きの角丸背景を2分割したベーシックなCTA
ブロック自体のCSSでmax-width指定をして背景色のつくブロックの幅を指定しています。
左右分割して、左に見出しとリード文、右に電話番号とリンクボタンというベーシックなパターンのCTA。