【NEW 】転職や給料アップに向けて、Webマーケティング関連の資格について調べてみた [ → 記事を読む ]

カルーセルとは|役割とレイアウト&デザイン例

WEB制作の現場でWEBページを制作する際、キービジュアルの位置やコンテンツの位置に、カルーセルを配置する機会が多いのですが、その際にどのようなレイアウトを行えばよいのか迷うこともありますし、新しいデザインを求めて他社サイトを確認していくこともあるため、ここに情報をストックしていきます。

カルーセルとは

複数枚の画像などがスライドし、順番に表示されるものをいいます。

ポイント
カルーセルと共に、標識となるインジケーターを設置すると、わかりやすいレイアウト&デザインになります。

カルーセルの役割

カルーセルを使用することで、

  • 限られた領域の中で、複数の情報を表示することができる
  • モーション(挙動)がつくことで、興味発起を促せる
  • デザイン性の高いサイトという印象が与えられる

ただし、カルーセルをユーザーがじっくり立ち止まってまで見ているかというと、そういうわけではないため、その点はカルーセルのデメリットではあります。ただし、

  • 情報を分かりやすく整理
  • デザインも分かりやすく、目を引くもの

にすることで、よりユーザーに見てもらえる領域にすることが可能です。
では、どうすれば、そのようなカルーセルを作れるのか。

自分ごととして捉えて、想像してみてください…
カルーセルを見た時に「この後、どんな情報がでてくるのだろう」と思えたら、立ち止まってでも次を見たくなりませんか?

私なら、思わず立ち止まってみてしまいます。恐らく、そんなワクワクするデザイン&レイアウトが作れれば、デメリットもメリットに変えることができるはずです。

コメントを残す

メールアドレスが公開されることはありません。 が付いている欄は必須項目です

CAPTCHA