UXを考慮した効果的なポップアップの使い方とは

Poal Boag

PaulはUXデザイナー、サービスデザイン・コンサルタントであり、デジタル・トランスフォーメーションのエキスパート。

この記事はboagworldからの翻訳転載です。配信元または著者の許可を得て配信しています。

Javascript Popups – How To Use Them for Long Term Success

Webサイトにポップアップを追加したいなら、その前にその結果について注意深く考えましょう。

最近のWebサイトはJavaScriptポップアップに溢れています。ユーザーに何かの行動を期待する際の自然な行動は、注意を引くようなオーバーレイ、すなわちユーザーを引きつけるCTA(コールトゥアクション=行動喚起)を表示することです。しかしこれはときにコストを伴うことがあります。

今回の記事では、そのコストについて考察し、ポップアップがどのような場合に安全で、また安全でないのか詳しく説明します。

OptinMonsterのポップアップ集が示すように、Webの世界にはさまざまな形と大きさのJavaScriptポップアップが溢れています。

ポップアップをうまく使えないと何が起こるか

ポップアップの成果を確認するには、それを導入した後のアナリティクスを見るだけで十分です。ポップアップのおかげで、ニュースレターへの登録やアプリのダウンロード、その他あなたが薦めるCTAは何でも増加するでしょう。しかし、それが全てではありません。

ダークパターンのように、ポップアップは短期的には状況を好転させますが、長期的にはコストとなる可能性があります。アナリティクスは、ポップアップがユーザーに感じさせる苛立ちの程度までは示してくれません。ユーザーが怒りを覚えれば、あなたのサイトを定期的に訪れる可能性は減少しますし、全く寄り付かなくなる人も出てきます。

もちろん、このようなユーザーの苛立ちを捉えることは簡単ではありません。滞在時間やPV、再訪トラフィックの減少との直接の因果関係が常にあるわけではないので、その現象の原因の少なくとも一部がこの種の苛立ちにある可能性があることに気づくことはありません。

しかし、ユーザビリティテストのような定量的なリサーチを行えば、ポップアップをいちいち消さなければならないときにユーザーがどれだけ苛立っているかが容易に分かるでしょう。

すべてのマネジメントチームが疎遠になっていくユーザーのことを気にかけているわけではありませんが、誰もが気にかけるべきです。長い目で見れば、これによってLTV(顧客生涯価値)が下がり、クチコミやリピーターも減少するかもしれないのです。

もちろん、ポップアップがもたらす結果はおそらくこれだけではないでしょうが、他のユーザビリティにおける弊害と相まって、認知的負荷の増大とフラストレーション全体を助長してしまいかねません。

それでは、ポップアップの使用を避けなければならないのはどのような場合でしょうか。

ポップアップの使用を避けるべき場合

すべてのポップアップが悪いわけではありません。何であれ相応しい場所があるものです。しかし私が目にするネット上のポップアップの大多数は、ほとんどのユーザーをイライラさせているだけのものです。

もっとも典型的なものは次の3つです。

ネット上にもっとも蔓延しているタイプのポップアップは、ニュースレターへの登録を求めるオーバーレイ、プッシュ通知送信のためのリクエスト、プライバシーに関する通知です。

この3つの容疑者のようなほとんどのポップアップには、特にユーザーをイライラさせるような共通した特徴があります。

ポップアップは気を散らす

まず、ポップアップはユーザーがやろうとしていることの邪魔になります。ユーザーはニュースレターに登録したり、プライバシーポリシーを読んだり、アプリをダウンロードするためにWebサイトを訪れることはほとんどありません(アプリのダウンロードならアプリストアに行くのが普通です)。

ポップアップは貴重な場所を取る

そしてポップアップ、特にJavaScriptのポップアップはモバイル端末において貴重な画面上の場所を取り、他のもっと重要な要素を妨害することがよくあるということも事実です。

JavaScriptポップアップは画面上の場所が限られていて、オーバーレイを却下することが難しいことがあるモバイルの端末において有害になり得ます。

ポップアップは却下し難い場合が多い

もっとも罪深いのは画面を完全に覆ってしまうようなJavaScriptポップアップです。これがあると、ユーザーは特定のボタンを見つけてクリックしないことには脱出出来なくなります。しかも、ポップアップを却下する気分を削ぐようなやり方でこうしたボタンを配置する例がますます当たり前になってきています。

たとえば「いいえ、こんな素晴らしい取引をしたくありません」や、「いいえ、これを無視することが幸せなのです」などと、却下することが悪いことのようなライティングです。

多くのWebサイトがポップアップをキャンセルさせないように、人を誘導するようなコピーを使うようになっています。(上記は医療系のサイトの通知許可のダイアログで却下のリンクが「いいえ、私は生き伸びたくありません」という文言になっています)

誤解しないでいただきたいのですが、すべてのポップアップが悪だというわけではありません。それがまったく正しいソリューションである場合もあるのです。

ポップアップが正しい解決策であると考えられる場合

人生における多くのものと同じように、ポップアップにも相応しいときと場合があります。私自身、よく使っています。

しかし、私がポップアップを使うときには1つのルールに従うことにしています。それはユーザーが求めた場合、または私のサイトを訪れたユーザーが当初のタスクを完了したと確信できる場合のみです。

たとえば、ニュースレターやその他のコールトゥアクション(CTA)をユーザーに売り込みたい場合は、私はユーザーの本来のタスク(買い物など)が終わるか、あるいはWebサイトを去ろうとするまで待ちます(Exit-intent Popupと呼ばれるものです)。

しかし、ポップアップは販促のためだけにしか使えないわけではありません。他にも、これを重宝するに値するユーザーフレンドリーな多くの理由があるのです。

ポップアップのおかげで複雑さが軽減される

私がポップアップを使うもっとも当然な理由の1つは、ユーザーに求められたときにだけ表示されるポップアップに、二次的な情報を隠すことで、サイトがシンプルになるということです。分かりやすい例が、ユーザーが会計をする間にその業務の返品ルールについての情報を求めた時に表示されるポップアップです。

ポップアップを使えば、他の人にとってサイトが見にくくなることなく、必要な人にだけ追加の情報を表示することができます。

ポップアップを使うと、会計をしようとしている人の邪魔をすることなく、その人に追加的な情報を提供することができます。しかし同時に、その情報に興味が無い人の気を逸らすこともありません。

ポップアップは重要な情報を伝えることができる

ポップアップはまた、ユーザーが見過ごしてはならないような非常に重要な情報を伝えるためにも有用です。たとえば、クレジットカード情報フォームが送信されたときに、カード情報の拒絶や認証エラーを伝える場合です。

ポップアップは、重要な情報やユーザーが取らなければならない行動を伝えるために使われることがあります。普段使っている端末のOSの挙動を考えれば、このアプローチはしっくり来るでしょう。

これらのことを実現できるのはJavaScriptポップアップだけではありません。それどころか、多くの場合においてポップアップは、ユーザーの注意を引くためには最善ではありません。

ポップアップの代わりになるもの

問題は、ユーザーがほとんどのポップアップは広告かクッキーの通知に過ぎないと学習してしまっているということです。その結果ユーザーは、そのポップアップが伝えたい内容を全て見ることなく閉じてしまうことが多いのです。すなわち、もしその情報が重要なのであれば、ポップアップは合理的な方法では無いかもしれないということです。

コンテンツの本文に配置されたCTAやメッセージがきちんとデザインされていれば、ポップアップと同じくらい強力な効果を持つことはよくあります。周りに十分なネガティブスペースがあって、そしてユーザーの目を引くようにデザインされたならば、ユーザーをイライラさせることが一切無く、インラインのメッセージがポップアップと同じパフォーマンスを出すことは珍しくないのです。

CTAの周りにネガティブスペースを追加すれば、視認性が向上し、ユーザーの注意を引くためにポップアップを使う必要性が減少します。

メッセージが注意を引くためにちょっとしたアニメーションを用いるのであれば、まさにこれはその通りです。しかし、ポップアップの場合と同様に、これもまずいやり方になりやすく、そしてユーザーを苛立たせがちです。

つまり、ポップアップにはポップアップの使い道がありますが、私たちは同じようにユーザーの目を引く他の選択肢があるのにこれを頼りすぎているということなのです。

ポップアップの全てが悪ではないが、むやみに使われ過ぎている

ポップアップは、ユーザーに向かって叫ぶようなインターフェイスです。注意を引くことはできますが、苛立たせもします。優れた演説者は聴衆の注意を引くために叫ぶ必要は無いように、優れたデザイナーはほとんどの場合において、ポップアップという手段に訴える必要は無いのです。

ポップアップがこんなにも広まっているのは、それが良い解決策であるからでも、もっともうまく機能するからでもありません。ただそれが簡単で、あまりスキルが無くても扱えるからなのです。ですから、次にJavaScriptポップアップを使いたくなるときが来たら、別の良いアプローチが無いかどうか、自分自身に問いかけてください。


Welcome to UX MILK

UX MILKはより良いサービスやプロダクトを作りたい人のためのメディアです。

このサイトについて