UIXHERO
#461
心理学・認知バイアス
#461

視覚的アンカー

視覚的アンカー

別名・表記:Visual Anchor

UIXHERO Definition

スキャン(流し読み)しているユーザーの視線を繋ぎ止め、次の情報を読むための足がかりとなる目立つ要素。

概要

ユーザーがページを流し読み(スキャン)する際、視線を引きつけ、繋ぎ止める役割を果たす視覚的に目立つ要素。 人間の視覚は連続的に読むのではなく、サッカード(跳躍的視線移動) を繰り返しながら情報を探索する。そのため、画像、太字の見出し、引用ボックスなどの顕著な要素が「視線の停留点(Fixation)」となり、次の情報へと導く足場(アンカー)として機能する。 これにより、テキストの壁(Wall of Text)による認知負荷を軽減し、離脱を防ぐ。

視覚的階層が「情報全体の優先順位構造」を設計するのに対し、視覚的アンカーは「スキャン中の視線の停留点」を作る局所的な装置である。

UXでの活用

  • アイキャッチ画像: 記事の冒頭に魅力的な画像を配置することで、ユーザーの興味を惹きつけ、本文へと誘導する(エントリーポイント)。
  • リストとアイコン: 箇条書きのリストには、先頭にチェックマークやアイコンを置くことで、視覚的なリズムを作り、読みやすくする。
  • 引用デザイン: 重要なメッセージを大きな文字サイズや装飾付きのボックス(Blockquote)で囲むことで、スキャンしているユーザーの目を止め、要点だけでも伝えられるようにする。

💡 使いどころ

記事のデザイン。文字ばかりのページで、読者の目が滑らないように、「見出し」「引用ブロック」「画像」を配置してリズムを作る。

⚠️ 注意点・誤用

アンカーが多すぎると、逆に視線がばらついて集中できない(カオスな状態)。あくまで「休憩地点」として使う。

具体例

  • ブログ記事の途中に挿入される関連画像
  • Webサイトの「特徴3選」のようなアイコン付きリスト
出典・参考文献:
  • Rayner, K. (1998). Eye movements in reading and information processing: 20 years of research. Psychological Bulletin, 124(3), 372–422.
  • Nielsen, J. (2006). F-Shaped Pattern for Reading Web Content. Nielsen Norman Group.
  • Buscher, G., Cutrell, E., & Morris, M. R. (2009). What do you see when you're surfing? Using eye tracking to predict salient regions of web pages. Proceedings of the SIGCHI Conference on Human Factors in Computing Systems, 21–30.
作成: 2026年1月26日
更新: 2026年2月14日

読んだ内容を、自分の画面に当てるとき

UIXHEROは、記事を書くほかに、画面の検品・判定、デザインシステムの構築、実装と改善の伴走を受けています。何を頼めばいいか決まっていない段階の相談も、同じ窓口で受けます。

UIXHEROに頼めることを見る

※ 記事の内容についての質問や、書いてほしいテーマの要望も同じ窓口で受けています

この記事をシェアする
シェア: