web-dev-qa-db-ja.com

無限スクロールは正当ですか?

最近、ユーザーインターフェイスの新しい傾向に気づきました。 FacebookとTwitterがこれを行っており、他のランダムであまり有名ではないサイトでこれに遭遇した。ただし、話を簡単にするために、ここではFacebookを例として使用します。

Facebookに初めてログインすると、友達からの一定量の投稿を含む「ニュースフィード」が表示されます。フィードはビューポートの下部を超えて下に伸びます。

次に、下にスクロールすると、「スクロールせずに見える範囲」のフィードが表示されます。ある時点で、下に移動すると、さらに多くの項目が読み込まれます。どうやら、これは「無限スクロール」と呼ばれています。

私のコンピューターでは、これが原因で、スクロール操作中にフィード内の位置がジャンプすることがよくあります。

このUIの概念について特に問題なのは、ページの下部にフッター情報がありますです。私はFacebookに広告を掲載し、ページ下部のリンクを使用して広告管理インターフェイスにアクセスします。

このインクリメンタルロード機能のため、下にスクロールして目的のリンクにアクセスすることがよくあります。ページの一番下に到達すると、突然新しいデータが読み込まれ、フッターが再び押し下げられます。もう一度スクロールダウンする必要があります。

このことは私にはまったく意味がないようです。メリットは何ですか? Facebookページは1メガバイトのデータに近いので、ユーザーが下にスクロールしたときのために数キロバイトのフィードデータを保存しても、それだけの価値はありません。

「もっと見る」というリンクの何が問題になっていますか?

この追加のデータ取得処理は、少しでもスクロールを開始するとすぐに発生するように見えるので、そもそもそのデータをロードするだけではどうですか。

私にとって、実際に目に見えるほどの利点を持たない「巧妙なトリック」の一部のエンジニアのコンセプトの、このマイナーな煩わしさの悪さ。

それとも私はそれについて間違っていますか?私には見られない利点はありますか?愚かだと思っているのは私だけですか?一部の人々はそれを好きですか?

31
Questioner

このパターンで受け入れられているUXの用語は「無限スクロール」です。これは、ユーザーを最小限のロードブロッキングに引き付け続ける方法であるため、リッチWebアプリではますます一般的になってきています。

受け入れられた視点は、ユーザーが選択を与えられた場合、コンテンツの単一ページバージョンを好む( Google自身の研究はこれをバックアップする )が、最初のリクエストで何百ものアイテムをロードすることは実用的ではない(特にメディアの場合) -Facebookのような豊富なサイト)。

ページネーションの問題は何ですか?引用するには I-Patterns

ユーザーが次のページをクリックする必要があるため、データのサブセット間の閲覧にページネーションを使用する場合の問題は、ユーザーがコンテンツの世界からナビゲーションの世界に引っ張られることです。ユーザーは、自分が何を読んでいるのかではなく、もっと多くのことを読む方法について考えています。これはユーザーの一連の思考を壊し、ユーザーに読書を停止させる。ページネーションを使用すると、自然な一時停止が作成されます。これにより、ユーザーはサイトを続行したいか、サイトを離れたいかを再評価できます。

ただし、無限スクロールはすべてのアプリケーションに適しているわけではありません。ご存じのとおり、スクロールバーの連続性は問題ですが、他にも問題があります。これらのいくつかは、いくつかの ベストプラクティス、UXムーブメントで非常によく説明されている に準拠することで対処できます。

ブックマークの難しさと、特定の結果にジャンプできないことも、他の問題です。そのため、無限スクロールはデータが豊富なアプリケーションでのみ使用することが重要です。このアプリケーションでは、表示される結果は非常に動的であり、日々変化するため、ブックマークが特定のコンテンツを返すことは期待されません)、予測不可能です(したがって、7ページに何があるかを知る方法がないため、ユーザーは「7ページにジャンプ」する理由がありません。

全体として、無限スクロールは強力なツールになり得ますが、適切なコンテキストで適切に実装されている場合に限られます。

37
Daniel Newman

はい、Facebookの場合、この機能は、あなたが述べた理由のために非常に愚かだと思います。フィードの下にフッターがあり、重要なリンクがいくつかあります。私もFacebookに広告を出して、この正確な問題に遭遇しました。下にスクロールすると、フッターがさらに押し下げられます。

あなたが言ったように、より良い解決策は、Google画像検索からレッスンを受けて、「もっと見る」というボタンを付けることだと思います。これはまだAJAX=である可能性があり、ページをリロードする必要なく情報がロードされます。しかし、もっと自然なことだと思います。

11
Steve Wortham

フッターがある場合に「さらに読み込む」パターンを使用する代わりに、フローティングフッターを使用することもできます。これは、実際に http://www.whistleout.com.au/ で確認できます。また http://www.bankwest.com.au/ 後者には、フッターにユーティリティが含まれ、必要に応じて、またはコマンドで拡張されます。

Floating footer at bankwest.com.au

6
Erics

私の無限スクロールは、ページネーションよりもユーザーのモデルに適しています。すべてのデータを事前にロードすると、法外に、または不必要に高価になるため、私は常にページネーションをパフォーマンスの向上と見なしてきました。

より多くの結果を表示するために何かをクリックしなければならないという事実は、それがあなたがしていることの流れを壊すので、いくぶん厄介です。 (マイナーではありますが)スクロールホイールを回転させることと実際にボタンの上にマウスを配置してクリックすることの間の認知的および物理的な切り替えを行う必要があります。

1分あたりに消費される情報に関しては、クリックしてロードする必要がないため(そして情報が実際にロードされる前に少し遅れる)、無限スクロールがその点でうまく機能します。

今、あなたはフッターが無限のスクロールで役に立たないことについて非常に有効なポイントを作り、100%同意します(底なしの穴の底に有用な情報を置くことのポイントは何ですか?)。私の推測では、実際にフッターにアクセスする必要がある人の割合が小さすぎて、それを抑止できず、一般に、一般の人々よりも不便に我慢する傾向があります(注意、我慢して、好きではない)

6
Davy8

これを説明するために私が聞いたもう1つの用語は、「ボトムレスページング」です。この機能はGoogleリーダーで気に入っています。ただし、無限にスクロールするように設計されたページにフッターを追加することは悪い考えです。

2
ottodidakt

この無限スクロール別名プログレッシブロードは、ユーザーの習慣に関する調査によってある程度導かれています。あなたがそうしなくても、より多くのユーザーがそれを好む必要があります。ただし、リンクの問題を解決したい場合は、そのリンクに移動してから検索バーにドラッグすると、通常のフィードをスクロールしたりナビゲートしたりすることなく、リンクにすぐにアクセスできます。

ところで、無限スクロールはFBの問題の最小です。広告、追跡、操作のアルゴリズムが多すぎるため、特に開いているタブから離れて後で戻ってきたときにフリーズし、フリーズして、タブを更新または強制終了して、新しいもの、それによって私の以前の場所を失う。

1
Rollin Shultz

Facebookの貧弱な実装に関するコメントに加えて、[もっと見る]と同じボックスに[オプションの編集]リンクがあり、そこに誰が表示されるかを変更できます。昨日その設定を見たかったので、Facebookのユーザー設定である迷路をナビゲートするよりも高速であることがわかっていたため、自動読み込みが停止するまで約5〜6回「もっと見る」を押しました。

特にFacebookのような複雑なサイトでは、フッターを必要とする人はごくわずかであることに同意しません。そこにあるすべてのオプションを見てください(斜体のリンク):

Facebook©2011・英語(米国)

概要広告作成aページ開発者キャリアプライバシー利用規約ヘルプ

それらはそれ自体、特に何千人もの開発者/ソーシャルメディアマネージャーにとって非常に重要ですが、私は特に、サイトマップのサイズがわかっている人のサイズのサイトで大量の情報フッターを楽しんでいます。ユーザーはそのスペースを利用して、可能性をすべて表示するか、少なくともページの下部に配置して、ユーザーがクリックしてフィードをプッシュアップできるようにすることで、人々を魅了し続ける必要があります。ちょうど私の2セント。

一方、コンテンツアグリゲーター(特にメディアリッチなもの)では、この機能は特に jQuery Masonry のようなサイトを使用している状況で、うまく機能します。必要に応じて、適切な方法で無限スクロールを使用してサイトの例をいくつか収集できます。

0
mnicole