アコーディオンデザインがコンバージョン率を下げるとき

この記事に関連するタグ
最近、ウェブサイトでよくみるアコーディオンデザインですが、弊社のABテスト事例ではアコーディオンデザインによってコンバージョン率が低下している場合があることがわかってきました。
アコーディオンデザインとはなにか
アコーディオンデザインとは、クリックすることで詳細なコンテンツが表示されるデザインのことです。楽器のアコーディオンのように、閉じたり開いたりすることができることからこのように呼ばれています。

▲アコーディオンデザイン例
レスポンシブ対応でアコーディオンデザインが増えている
スマートフォンの増加に対応するために、最近では多くのウェブサイトがレスポンシブ対応をしています。スマートフォンは画面が小さいので、PCで表示していたすべての情報をスマートフォンで表示させようとすると、極端に縦に長いサイトが出来上がってしまいます。
アコーディオンデザインは、情報をコンパクトにまとめることができるので、レスポンシブ対応をしたウェブサイトでよく使われています。
アコーディオンデザインがCVRを低下させる
しかし、このアコーディオンデザインが、コンバージョン率を低下させている場合があることがわかってきました。弊社のある事例ではアコーディオンデザインを開いた状態にするテストを実施したところ、約2割コンバージョン率が改善しました。

▲アコーディオン展開により約2割コンバージョン率を改善
アコーディオンデザインの問題
なぜアコーディオンデザインがコンバージョン率を下げてしまうことがあるのでしょうか。アコーディオンデザインの問題として、以下のような仮説が考えられます。
【1】コンテンツが隠れてしまう
多くのユーザーはウェブサイトを流し読みするので、コンテンツを詳しく見ることはありません。そうしたユーザーは、アコーディオンデザインに気づかず、クリックせずにスクロールで通り過ぎてしまう可能性があります。
【2】ユーザーの無駄なクリックを増やしてしまう
アコーディオンデザインでは、コンテンツを見るためにクリックすることをユーザーに強制することになります。無駄な手間を増やすことは、ユーザーを疲れさせ、サイトからの離脱につながってしまうと考えられます。
ABテストでの検証が重要
一方で、アコーディオンデザインによってコンバージョン率が上がっている事例もありました。それはエントリーフォームなどで、ページの縦幅がコンバージョンに大きな影響を与える場合です。そうしたページでは、アコーディオンデザインによって縦幅を短縮することがコンバージョンにつながることがわかってきています。
このような事例もあるので、アコーディオンデザインがどのような状況でも必ずコンバージョン率を低下させると断言することはできません。実際のページでABテストを実施し、コンバージョン率の高いデザインを適用させていくことが重要といえるでしょう。
ハートラスのウェブサイトコンサルティングサービスの詳細はこちらご相談やお問い合わせはお気軽にご連絡ください
この記事のライター
この記事に関連するタグ
おすすめの記事
-
seo-cro
モバイルSEOの最適化:モバイル検索の可視性向上に役立つ6つの要素
-
seo-cro
SEO戦略を見直したい ~プランニングを始める時のポイントとは?~
-
seo-cro
「ボタンの色は○○色がいい」は都市伝説? ユーザー属性別の数値から分かった意外な事実とは
-
seo-cro
知っておきたい!コンテンツSEOが注目されているワケ