インタラクションデザイン: ページングか読み込みか? それが問題だ

インタラクションデザイン: ページングか読み込みか? それが問題だ

【編集後記】この記事は@子木yoyoさんが個人ブログで公開したものです。 Web ページでもモバイル アプリでも、多くの場合、情報を 1 ページにすべて表示することはできません。そのため、ページ情報を拡張できるインタラクティブ モード (ページ区切りや連続スクロール) を使用する必要があります。ページネーションと読み込みは、私たちが毎日遭遇する非常に一般的なインタラクション モードです。非常に一般的なため、その存在すら感じません。ページの下部を閲覧し、ページネーションが表示されたらクリックし、自動的に読み込まれたら読み続けます。

しかし、この小さな点こそが、ユーザーに非常に異なった微妙な感覚をもたらすのです。この記事では、これらの小さな違いがもたらす大きな違いについて説明します。

ページネーション

ページネーションを使用すると、大きなコンテンツを小さなチャンクに分割し、別々の連続したページに表示できるため、ユーザーが理解したり見つけたりしやすくなります。これにより、ユーザーは閲覧したいコンテンツの量、閲覧した部分、残りの量を明確に把握できるようになります。ページネーションにより、ユーザーは閲覧しているコンテンツについて明確な期待を持つことができます。

記事が長くなると、必ずページ区切りが必要になります。まず、ユーザーにコンテンツの量を予想させ、次に視聴者に休憩を与えます。ユーザーが記事を読んでいる間に 10 画面以上スクロールしても、スクロール バーがブラウザの上部中央に留まったままだとしたら、どれほどイライラすることでしょう。

検索エンジンや電子商取引の Web サイトを見ると、ページング コントロールが必ず表示されます。

検索や商品リストの閲覧時にはコンテンツの量が予測できないため、ページネーションの第一の機能は、閲覧に必要な情報量をユーザーに伝えることです。 2 つ目は、ページネーションにより、ユーザーは読みたくない情報をすばやくスキップしたり、ホームページや最後のページにすばやくジャンプしたり、閲覧したいコンテンツを独自に選択したりできるようになります。 3 つ目は、ページ付けにより、検索と取得が非常に簡単になります。スカートを探しているときに、すでに 5 ページ目までたどり着いていたとしても、2 ページ目に良いエントリがあることを突然思い出し、直接ジャンプしてすぐに見つけることができます。

ページング コントロールは、Web サイトのコンテンツに自然な休止を作り出します。この休止をうまく利用すれば、製品にリズムを与えることができます。ただし、ユーザーはページの閲覧を終えると、読むのをやめてクリックしてジャンプし、さらにコンテンツを取得する必要があります。この一時停止によってユーザーの思考がある程度中断されることは否定できません。ページネーションに遭遇すると、ユーザーは閲覧を続けるか、Web サイトを離れるかを考える可能性が高くなります。そのため、ページネーションに遭遇すると、一部のユーザーは迷ってしまうことがよくあります。

連続読み込み

継続的な読み込みは、ページングとは逆のインタラクション パターンであり、情報間に明確な境界や一時停止はありません。ページを一番下までスクロールすると、新しい情報が自動的に読み込まれます。

さまざまなソーシャル ネットワークでは、特にこのタイプのコントロールを使用することを好みます。これにより、ユーザーは中断されることなく、スムーズにブラウジングして没頭することができます。

しかし、情報が自動的に読み込まれるため、ページに終わりがなく、ページにどのくらいのコンテンツが含まれるかを予測することが困難です。ブラインドローディングでは、ユーザーは迷子になってしまいます。このページにはどのくらいのコンテンツがあるのでしょうか。どのくらいのコンテンツを閲覧したのでしょうか。このページはいつ読み終えるのでしょうか。このような一時停止のないページでは、ユーザーが以前に見た情報を検索するのにも困難が伴います。しかし、レジャーやエンターテイメントに重点を置いたこの種のソーシャル製品の場合、ユーザーの情報の流れを中断しない読み込み方法を使用することは依然として非常に適しています。

ページング コントロールを使用する場合、ユーザーはクリックしてさらにコンテンツを表示する必要があるため、情報の取得はユーザーによって積極的に要求されます。継続的な読み込みを使用すると、新しい情報が自動的に読み込まれ、ユーザーはそれを受動的に受け入れます。

妥協的なアプローチ

ページングと読み込みにはそれぞれ長所と短所があります。最近の多くの Web サイトでは、ページングと読み込みを併用する妥協策が採用されています。

たとえば、Quora では、自動的に 4 回読み込まれた後に「詳細」ボタンが表示され、連続した情報のフローの後にユーザーに一時停止を与え、ユーザーが積極的により多くの情報を取得できるようにします。

Sina Weiboもこの妥協策を採用しており、自動的に2回読み込まれた後にページングが表示されます。空き時間にWeiboを閲覧するほとんどのユーザーにとっては、コンテンツを2回読み込むだけで十分満足できます。より多くの情報を閲覧する必要があるユーザーにとっては、閲覧した量もわかります。

ユーザーがより多くの画像を素早く見ることができるように、Google 画像検索でも連続読み込み方式を採用しています。しかし、画像を検索する際には、ユーザーが自分の位置を明確に把握する必要があり、見たばかりの画像を探すために戻る可能性が高いです。そのため、Google では、位置決めと検索を容易にするために、同じページにページ番号もマークします。これはもう一つの妥協です。

モバイルクライアント

画面が小さく、使用シナリオが多様な携帯電話では、正確なクリックよりもスライドの方が明らかに簡単で、誤操作の可能性が低くなります。モバイル製品の情報アーキテクチャは比較的単純で、ユーザーの閲覧時間は比較的短く、使用時の注意は比較的分散しています。そのため、ほとんどのアプリは継続的な読み込みを使用します。また、読み込みにはページング コントロールよりも少ないスペースが必要です。

しかし、検索エンジンのような製品では、依然としてページネーションのデザインが維持されています。

読み込みやページングの選択はデザイン上のほんの小さなポイントですが、優れた製品はこのような小さなポイントの無数から構成されています。製品の特性に応じて最適なインタラクション方法を選択するのが、インタラクション デザイナーの仕事です。

オリジナルリンク: http://www.leeyue1007.com/index.php/2012/09/05/pagination/

元のタイトル: インタラクションデザイン: ページングか読み込みか、これが問題です

キーワード: インタラクション、読み込み、問題、編集者、この記事、著者、Zimu、ヨーヨー、ウェブマスター、ウェブサイト、ウェブサイトのプロモーション、収益化

<<:  インターネットマーケティングは中国の声から学べる

>>:  ウェブサイトのユーザーロイヤルティの向上は「エンティティ」ケアから始まります

推薦する

27% 値下げ: Iwstack-2.16 EUR/KVM/CloudStack/512MB RAM/ダラス/ミラノ

最新ニュース: Prometeus の iwstack クラウド VPS が大幅に値下げされ、最大で...

テンセントの500億投資の「持続可能な社会価値イノベーション部門」は、事業開始から1ヶ月を迎え、社会発展の道を模索する「善良ラボ」を設立した。

重慶は、そびえ立つ山々によって雄大で高く、曲がりくねった川によって美しくしなやかです。夜になると、重...

中国高速航空、クラウドインフラ構築にAWSを全面採用

2019年4月11日、アマゾンウェブサービス(北京)有限公司(以下、「AWS」)は、中国高速航空有限...

ブログを通じて安定した外部リンクを素早く増やす方法

昨年、私は SEO の仕事を引き受けましたが、ターゲット キーワードはアンティーク、アンティーク、G...

大企業がキーワードマイニングの拡大を図る方法の解釈

ローカル検索トラフィックが成長を続けるにつれ、複数の地域で事業を展開している企業(大企業と呼びましょ...

フレンドリーリンクを使用してキーワードランキングを向上させる方法

みなさんこんにちは、kinessです。今回はフレンドリーリンクがキーワードランキングに与える影響につ...

SEO三部作のキーワード戦略

企業サイトや個人ブログはそれぞれ異なるユーザー(つまり、異なるオーディエンス)に直面しています。ユー...

Kubernetes (K8s) オペレーターの書き方、学びましたか?

Kubernetes(K8s) オペレーターを書こうという思いが私の心の中でどんどん大きくなっていき...

Sveltos による Kubernetes アドオン ライフサイクル管理

Sveltos は、クラスター全体にわたる Kubernetes アドオンの展開を簡素化し、クラスタ...

キーワードにこだわる兄弟は気をつけろ百度はNO

検索エンジンマーケティングに精通している人は多いですが、多くのウェブマスターは依然として単一キーワー...

エジプトサーバー: zenlayer、カイロデータセンター、生涯30%割引、カスタマイズ可能な構成、10Gbps帯域幅

世界的に有名なデータセンターである Zenlayer は、カイロに物理的な住所を持つエジプトに独自の...

大規模eコマースウェブサイトのSEOを最適化する方法

誰かが尋ねました: SEO と検索エンジンの関係は何ですか? この質問に関して、私は個人的に SEO...

才能ある人物がウェブサイトを構築してから 1 年で 1 日あたり 70 万 IP を達成し、SEO が単なる夢物語であることを証明しました。

最近、誰もがオリジナリティの問題について語っています。多くのウェブマスターは、オリジナリティは外部リ...

将来の検索エンジンのターゲットグループ:SEO中毒者

このような質問を知りたいです。検索エンジン最適化業者として、主にどのような企業やクライアントにサービ...

集約ページとは何ですか? SEO のために集約ページを作成する利点は何ですか?

2018年最もホットなプロジェクト:テレマーケティングロボットがあなたの参加を待っています集約ページ...