web-dev-qa-db-ja.com

読み込み時間が長い場合の不安を軽減するための「Greeked Text」または偽のコンテンツの使用方法

読み込み時間が長すぎる場合（1分以上）、アプリケーションがデータを読み込んでいる間に偽のコンテンツまたはコンテンツプレースホルダーを表示すると、不安を軽減できますか？

私はこれをFacebookのモバイルアプリでのみ見ました。

Facebook fake loading

response-timeloadingfacebooklazy-loading
18
Ed Orozco

このリンク/情報はあなたに役立つはずです：Facebookコンテンツプレースホルダーの分解- http://cloudcannon.com/deconstructions/2014/11/15 /facebook-content-placeholder-deconstruction.html

リンク情報を要約するには：

なぜこれを使用するのですか？常に情報を待つ必要をなくすことはできませんが、待ち時間を短くすることができます。何が起こっているかを示し、視覚的な刺激を与えることにより、ユーザーはすぐに快適になり、離れる可能性が低くなります。これは、長いアクションに進行状況バーを配置するのとまったく同じです。洗練されているというだけでなく、優れた使いやすさです。この機能は、コンテンツがほとんどそこにあるように感じるので、平均的な読み込みシンボルよりも優れていると思います。

実装面：

1）そのadivのセット。

2）中心のラッパー要素/ div- enter image description here

3）次に、アニメーション化された背景要素があります：アニメーション化された背景を持つボックスであり、その背景はたまたまCSSグラデーションです。 enter image description here

4）この要素の上には、たくさんの小さなマスキングブロックがあります-たくさんの小さな白いdivが上にあるので、見えませんアニメーション。 enter image description here

出典： http://cloudcannon.com/deconstructions/2014/11/15/facebook-content-placeholder-deconstruction.html

14
Amit Jain

通常はdivを使用します。テキストが実際のテキストと混同されていないことを確認してください。ただし、同時にlorem ipsumを使用しないでください。 （それはあなたの訪問者を困らせるか混乱させます。）

次のように線に沿って何かを試してください：

このページは、予想よりもロードに時間がかかります。 （興味深く関連性のあるものがここに表示されます。）

3
Mayo