コンテンツは無限ですが、ユーザーの忍耐力は無限ではありません。
「あと数回投稿したら、もう寝る時間だ」とあなたは自分に言い聞かせます。しかし、あなたはスクロールを続け...そしてスクロールを続け...ついには居眠りをしてしまい、親指が無意識のうちに上方向にスワイプするのをやめてしまうのです。
このように、2010年代初頭にデザインの標準となった無限スクロールのパワーを打ち破るのは簡単ではありません。
無限スクロールとは？
ウェブデザインの手法の一つで、ユーザーがページをスクロールしていくと、自動的に下部に多くのコンテンツが連続的にロードされ、ユーザーが次のページをクリックする必要がなくなる仕組みのことです。 無限スクロールの背景にある考え方は、ユーザーが摩擦のないブラウジング体験を楽しめるようにすることです。ユーザーは、「次のページ」ボタンに邪魔されることなく、ネットサーフィンをしながら気軽にコンテンツを楽しむことができます。
しかし、自然な停止位置がないと、人はそのまま進んでしまいがちです。確かに、無限スクロールはユーザーを引き込むように設計されています。
Aza Raskinは、これを "中毒 "と呼ぶでしょう。彼はよく知っているはずです。それをデザインしたのですから。彼はここ数年、倫理的デザインの旗印のもとに軍隊を集めながら、中毒性のあるテクノロジーがもたらす心理的・社会的悪について人々に警告を発する謝罪行脚を続けています。
Raskin氏はWall Street Journal誌の取材に対し、無限スクロールを開発した当初の目的は純粋なものだったと語っています。ユーザーがすでにスクロールしているのであれば、もっと多くのコンテンツを欲しているはずです。これは他のユーザーも納得するものであり、このアイデアは軌道に乗りました。現在、無限スクロールはソーシャルメディア、ブログ、eコマースサイトで広く使われています。
無限スクロールはユーザーにスムーズなブラウジングを提供するかもしれませんが、多くのデザイナーは、ウェブをナビゲートするためのより良い方法があると考えています。
無限スクロールに対する反対意見
ソーシャルメディア中毒を助長する可能性がある
2019年、米上院議員のジョシュ・ホーリーは「ソーシャルメディア中毒軽減技術（SMART）法」を提出しました。この法案が成立すれば、ソーシャルメディアプラットフォームが無限スクロールを含む特定の慣行を使用することを違法とし、人間の心理を悪用するものだとします。
ソーシャルメディア中毒の普及と影響に関する疑問はまだ議論の余地があり、無限スクロールのような説得力のあるデザインが中毒にどのように寄与するかについて明確な結論を出すには、さらなる研究が必要です。
しかし、慎重なデザイナーは、スロットマシンに例えられるような機能を実装する前に、もう一度よく考えた方がよいかもしれません。
アクセシビリティ侵害の危険性
無限スクロールは、障害のあるユーザーにとってナビゲーションを特に困難にする可能性があります。フッター、サイドバー、その他の関連ページへのアクセスを補助する技術に頼っている人は、コンテンツを継続的に読み込むインターフェースではその妨げになることがあります。無限スクロールは、このようなユーザーを遠ざけ、その過程でウェブコンテンツアクセシビリティガイドラインに違反する危険性をはらんでいます。
フッターに辿り着けなくなる
ウェブアクセシビリティとユーザーエクスペリエンスのコンサルタントであるAdrian Roselli氏は、Built Inの取材に対し、無限スクロールとページ下部のフッターを組み合わせているクライアントを時々見かけると語っています。これはあまりにもよくある間違いで、「会社概要」や「お問い合わせ」のリンクが届かないため、適切な情報にアクセスしようとしているユーザーにとって頭痛の種になります。
初心者やキーボードのみのユーザーにとって、アクセスできないコンテンツに移動しようとすると、途中でどんどん読み込まれてしまい、非常にイライラするものだ、とロセッリ氏は言います。
「気が狂いそうになりますよ」。
ユーザーの居場所を失わせる
あるeコマースストアが無限スクロールを使って、すべての商品を1つのページに表示することにしたとします。
ユーザーは、気に入った商品を見つけると、その商品をクリックし、新しいページに移動することができます。そして、「戻る」ボタンを押せば、元のページに戻ることができます。しかし、ほとんどの場合、そうではありません。その代わりに、前のページのトップに戻るのです。そして、クリックする前にいた場所に戻るには、またスクロールダウンしなければなりません。
賢明なインターネットユーザーは、コントロールキーを押しながらクリックすることで、スクロール中の場所を失うことなく、新しいタブを作成し、このイライラを回避することができます。しかし、イライラするような体験を避けるために、ユーザーに高度な戦術を取らせるようなデザインは、再検討する必要があります。
特定の目標を持つユーザーの速度を低下させる
無限スクロールは、目標を持って行動するユーザーにとって厄介なものです。
あるサイトを訪れたユーザーが、自分が何を求めているかを正確に把握していたとしても、その求めているものが無限スクロールの途中にある場合、まず無関係なコンテンツの束をめくることを余儀なくされます。この場合、目的の場所に素早く移動することはできません。
「商品サイトでパンツが欲しくて、それが "p "の文字だとしたら、他の15文字のアルファベットをスクロールする必要はありません」と、Roselli氏は言います。「『p』をタップして、その部分の無限スクロールに飛び込むことができればいいのです」。
ユーザーの直感を狂わせる
ブログやニュースサイトでも無限スクロールを使用しているところがあります。無限スクロールのページに記事を重ね、ユーザーがスクロールダウンするたびに、アドレスバーに新しいURLが作成されることがよくあります。
これは、受動的なユーザーが「あと1つだけ」記事を読むことを促し、サイトのページビューと直帰率の数字を上げるのに役立つかもしれませんが、ほとんどの訪問者にとってフラストレーションのたまる体験になります。
UI・UXデザインコンサルタントのHugh Guiney氏は、Built Inの取材に対して、このウェブサイトのデザインは「ウェブのメンタルモデルを壊している」と語っています。
「昔から、1つのページには1つのURLしかなかったんです。でも、今は、1ページにいくつものURLがあるようなものです」。
インターネットユーザーは、オンラインの記事を読んでいる間は進行しているという感覚を、記事を読み終えたら完結しているという感覚を期待しています。しかし、無限スクロールはこれを乱し、方向感覚を失わせることになります。
Guiney氏によると、無限スクロールを採用しているニュースサイトでは、ユーザーが誤って読んだ記事をスクロールして通り過ぎたり、次の記事のURLをコピーしたり、間違った記事を友人にシェアしたりしがちだという。ページネーションを使っているサイトでは、このようなことは起こりません。
無限スクロールの代替案
デザイナーは、Webサイトやアプリに無限スクロールを追加する必要はありません。その代わりに、ページネーションと「もっと見る」ボタンという2つの一般的な代替手段を選ぶことができます。
ページネーション
ページネーションは、ウェブコンテンツを整理するための最もわかりやすい方法でしょう。コンテンツを個別のページに分割し、各ページに限られた数のアイテムを配置します。これは明快で、ユーザーが期待するものを提供します。ページネーションには、ほとんど驚きがありません。
また、アイテムがどこにあるのかが一目瞭然です。例えば、eコマースサイトで帽子を買おうとしているユーザーは、4ページ目まで進んで品揃えが少なくなっていることに気づき、2ページ目あたりにお気に入りのアイテムがあったことを思い出すかもしれません。そんなとき、ページネーションがあれば、その帽子のある場所に簡単に戻ることができます。
「もっと見る」ボタン
「もっと見る」ボタンは、通常、コンテンツの塊の下に配置され、ユーザーにもっと結果を見たいかどうかを尋ねます。無限スクロールとは異なり、ユーザーが見たいと思うことを前提にしたものではありません。ユーザーに自然な中断点を与え、続けるかどうかの選択肢を与えるのです。また、必要であれば、フッターにアクセスすることも可能です。
ページネーションとは異なり、「もっと見る」ボタンでは、コンテンツが番号やアルファベットで区切られた個別のページに分割されることはありません。
しかし、「もっと見る」ボタンがあるページの体験は、無限スクロールの場合と少し似ています。例えば、ユーザーが何度も「もっと見る」を押した後は、複数のページではなく、1つの大きなページが集約された状態になります。そのため、無限スクロールのデメリットも残されています。リンクをクリックした後に元の場所に戻るのはまだ難しく、ユーザーはページが終わったという進歩の感覚を得られないままなのです。
無限スクロールの事例
シームレスなモバイルスクロール
ページの下部からページ番号やボタンを削除し、無限スクロールを採用すれば、ユーザーにとってエレガントでシームレスなブラウジング体験が得られるかもしれません。特にモバイル端末では、ユーザーはボタンを押すのではなく、親指でスワイプして追加のコンテンツを取得することに慣れてきています。
セレンディピタス・ブラウジング
ユーザーの主な行動がソーシャルメディアのフィードを何気なくめくることである場合にも、無限スクロールは直感的なデザイン選択となります。この場合、情報の適時性が最も重要であり、各情報の重要性は相対的に等しくなります。そして、常に新しいアップデートがあります。
「その情報をページネーションで表示しても、何の意味もありません」とギニーは言います。「2ページ目に行くまでに、1ページ目の結果がそこにあるのです」。そのため、ページネーションではなく、無限スクロールは、ユーザーが特定の目標を持たないソーシャルフィードには自然にフィットするのです。
また、テキストやSlackのようなチャットスタイルのアプリケーションでも、無限スクロールは有効でしょう。「これらのアプリケーションは、まさに一瞬の出来事であり、あなたはその瞬間に立ち止まり、立ち止まるのです」とRoselli氏は言います。
無限スクロールをより良くするためのヒント
デザイナーが無限スクロールを避けたいと思うのは、ほとんどの場合において同じです。しかし、どうしても使いたい場合は、いくつかの点に注意する必要があるとRoselli氏は言います。
無限スクロールの後にコンテンツを配置しない
Webサイトのフッターを、無限にロードされるコンテンツの海の下に貼り付けることは、ユーザーに苦痛を強いることになります。これでは、ユーザーに怒られてしまいます。当然です。重要な情報は、簡単にアクセスできる場所に置く。
「戻る」ボタンでまったく同じ場所に戻るようにする
行き場を失い、元の場所に戻るために同じコンテンツをスクロールしなければならないことほど、イライラさせられることはありません。バックエンドにコードを記述して、ユーザーが元の場所に戻れるようにしましょう。
先に進むことができるようにする
ユーザーが探しているコンテンツに到達するために、必要ないとわかっているコンテンツをスクロールして時間を浪費させないようにしましょう。特定の文字や数字にジャンプできるボタンを設置しましょう。
キーボードのみのユーザーでも使えるようにする
キーボードのみのユーザーやスクリーンリーダーを使用しているユーザーが、意図したとおりにページを体験できるような方法で、無限スクロールを構築し、テストしてください。タブ」ボタンを何度も押して、必要な場所に移動する必要はありません。解決策としては、無限スクロールを無効にするオプションを設け、ユーザーが希望すればページネーションや「もっと見る」のボタンを使えるようにすることです。
最初にテストする
「コードを書くのに時間を費やす前に、どのような問題を解決しようとしているのかを把握しましょう」とRoselli氏は言います。たとえば、サイト滞在時間を長くして直帰率を下げたいのであれば、プロトタイプを作成し、障害のあるユーザーを含む多くのユーザーでテストして、そのデザインが実際に目標をサポートしているかどうかを確認する必要があります。
無限スクロール、「もっと見る」ボタン、ページネーション、あるいは検索バーなど、デザイナーが最終的にどのようなルートを取るにしても、まずテストをしてユーザーのフィードバックを集めることが最も重要なステップとなります。
