なぜ見られないのか
派手な領域は無視されます(Benway, 1998)。動くバナーは探索を妨げ記憶されません(Burke et al., 2005)。変化は見落とされ(Rensink, 2002)、集中時は目の前も見えません(Simons & Chabris, 1999)。
モバイルでの違い
小画面では視線が上部に集中します(Kim et al., 2015)。次のカードが少し見える横スクロールは続きを示し、自分でめくれます。ジェスチャーナビとの衝突に注意します。
使うなら
枚数は少なく、位置を示します(Pernice, 2013)。視覚的階層を崩さず、自動回転にはWCAG 2.2の2.2.2に従い停止ボタンを。モバイルアクセシビリティも確保します。
よくある質問
- カルーセルは常に悪い?
- いいえ、自分でめくる商品写真などには有用です。
- 自動回転の速さは?
- できれば避け、使うなら停止ボタンを。
出典確認日:2026-10-27
参考文献
- Pernice, K. (2013, September 14). Designing effective carousels: Create a carousel that users can use. Nielsen Norman Group. カルーセルの使いやすさの指針です。
- Benway, J. P. (1998). Banner blindness: The irony of attention grabbing on the World Wide Web. Proceedings of the Human Factors and Ergonomics Society Annual Meeting, 42(5), 463–467. バナーブラインドネスを初めて報告しました。
- Burke, M., Hornof, A., Nilsen, E., & Gorman, N. (2005). High-cost banner blindness: Ads increase perceived workload, hinder visual search, and are forgotten. ACM Transactions on Computer-Human Interaction, 12(4), 423–445. 動くバナーが探索を妨げ記憶されない実験です。
- Rensink, R. A. (2002). Change detection. Annual Review of Psychology, 53, 245–277. 人は画面の変化を見落としやすいというレビューです。
- Simons, D. J., & Chabris, C. F. (1999). Gorillas in our midst: Sustained inattentional blindness for dynamic events. Perception, 28(9), 1059–1074. 集中時に目の前のものも見落とす実験です。
- World Wide Web Consortium. (2023). Web Content Accessibility Guidelines (WCAG) 2.2. 自動で動く内容の停止を求める2.2.2です。
- Kim, J., Thomas, P., Sankaranarayana, R., Gedeon, T., & Yoon, H.-J. (2015). Eye-tracking analysis of user behavior and performance in web search on large and small screens. Journal of the Association for Information Science and Technology, 66(3), 526–544. 小画面では視線が上部に集中する研究です。
