1. HOME
  2. COSME
  3. ユーザーエクスペリエンスに徹底的に配慮したモーダルウィンドウCTA機能
COSME

ユーザーエクスペリエンスに徹底的に配慮したモーダルウィンドウCTA機能

COSME

2560

「ROCK」では、トップページ、アーカイブページ、詳細ページなどすべてのページにおいてモーダルウィンドウを利用したCTA(コールトゥアクション)を表示することができます。
CTAとはサイト訪問者に行動を喚起するために表示するテキストや画像、動画などのコンテンツを指し、当テーマではバナーテンプレート、MP4動画、Youtube動画、フリースペースの4種をご用意しています。

バナーテンプレート・・・任意の画像とテキストを表示します。
動画・・・MP4形式の動画を表示します。
Youtube・・・Youtube動画を表示します。
フリースペース・・・通常の投稿と同じように自由にコンテンツを作成できます。

モーダルウィンドウは性質上、ユーザーの閲覧を阻害し求められる操作が完了するまでメインページに復帰できないという強制力があるため、ユーザーからはあまり好まれません。乱用することはユーザビリティやUXを大きく下げることになるので、使用の際は十分な配慮が必要になります。

当テーマでは繊細な取り扱いが重要になるこのモーダルウィンドウの表示の仕方について熟慮し、設計しています。

再生設定

動画が再生しだすと同時に音声が流れると、一部ユーザーにとって不快と捉えられるかもしれません。この項目では動画の再生方法について設定できます。

遅延表示設定

ページの読み込み直後にモーダルウィンドウが表示されれば当然のことながら、不快感を覚えます。初めて訪れたサイトであればそのまま直帰してしまうかもれません。遅延表示設定ではページの読み込み終了時点を0秒とし、指定された秒数の後に表示するよう設定することができます。導入する前にはテストを繰り返して、おおよそベストな頃合いを見計らって秒数を指定すると効果的です。

1回限定表示設定

同じページを行ったり来たりする中で何度も同じモーダルウィンドウを表示されれば誰でも鬱陶しいと感じることでしょう。この機能はブラウザが閉じられるまで同じモーダルウィンドウを表示しない、させないための機能です。特に重要なウィンドウでなければ、この機能は常にオンにしておくことをお勧めします。

詳細な表示/非表示設定

前述の通り、モーダルウィンドウは強制力の高いCTAコンテンツです。不用意に表示してユーザビリティを下げてしまうことがないように、アーカイブページでは表示させず固定ページでだけ表示するというように予め決めておきましょう。

また、当機能は各投稿編集ページからも個別にON/OFFが設定できますので、上記のカテゴライズ以上に細かく指定したい場合でも融通が利きます。