待ちを退屈にしない
マイヤーズ（1985）は進捗表示があると待ちに耐えやすいことを示し、マイスター（1985）は何もしない待ちほど長く感じると述べました。スケルトンスクリーンは、これから現れる内容の形を先に見せることで両方の知見を活かします。
研究が示す効果
ハリソンら（2007, 2010）は進捗バーの動きを変えるだけで同じ時間が短く感じられることを示しました。メイトフトら（2018）はスケルトンが速く感じられる傾向を報告しましたが、差は条件次第で小さいこともあります。フィードバックは実際の速度改善の代わりにはなりません。
上手な使い方
実際のレイアウトと同じ大きさで描けば、コアウェブバイタルのCLSを悪化させません。1秒未満の読み込みでは省き、長い処理には進捗バーを使います。ピーク・エンドの法則のように終わりの切り替えも大切です。
よくある質問
- スピナーとの違いは？
- スピナーは待機中であることだけを伝え、スケルトンはこれから出る構造を見せます。
- 使わない方がよい場合は？
- 1秒未満の読み込みと、非常に長い処理です。
出典確認日：2026-10-27
参考文献
- Myers, B. A. (1985). The importance of percent-done progress indicators for computer-human interfaces. In Proceedings of the SIGCHI Conference on Human Factors in Computing Systems (pp. 11–17). ACM. 進捗表示があると待ち時間に耐えやすくなるという古典研究です。
- Maister, D. H. (1985). The psychology of waiting lines. In J. A. Czepiel, M. R. Solomon, & C. F. Surprenant (Eds.), The service encounter (pp. 113–123). Lexington Books. 「何もしない時間は長く感じる」という待ちの心理原則です。
- Harrison, C., Amento, B., Kuznetsov, S., & Bell, R. (2007). Rethinking the progress bar. In Proceedings of the 20th Annual ACM Symposium on User Interface Software and Technology (pp. 115–118). ACM. 進捗バーの進み方が体感時間を変えることを示しています。
- Harrison, C., Yeo, Z., & Hudson, S. E. (2010). Faster progress bars: Manipulating perceived duration with visual augmentations. In Proceedings of the SIGCHI Conference on Human Factors in Computing Systems (pp. 1545–1548). ACM. 視覚効果だけで同じ待ちが約11%短く感じられたという結果です。
- Nah, F. F.-H. (2004). A study on tolerable waiting time: How long are Web users willing to wait? Behaviour & Information Technology, 23(3), 153–163. フィードバックの有無で待てる時間が変わることを示しています。
- Hohenstein, J., Khan, H., Canfield, K., Tung, S., & Perez Cano, R. (2016). Shorter wait times: The effects of various loading screens on perceived performance. In Proceedings of the 2016 CHI Conference Extended Abstracts on Human Factors in Computing Systems (pp. 3084–3090). ACM. スピナーや進捗バーなど読み込み画面の種類を比較しています。
- Mejtoft, T., Långström, A., & Söderström, U. (2018). The effect of skeleton screens: Users' perception of speed and ease of navigation. In Proceedings of the 36th European Conference on Cognitive Ergonomics (pp. 1–4). ACM. スケルトンスクリーンを直接比較した数少ない実験です。