写真の説明はそれより上か下か。
画像を上下に配置し、その説明を1行程度で記述する必要のある場所はたくさんあります。説明テキストはどこにあるべきですか？それより上か下か？
最善の選択肢は横に置くことですが、それが不可能な場合もあります。あなたがこれらの2つの間で選択しなければならなかったならば、どれですか？
- 画像と説明の間に接続を作成するにはを使用します 近接原理 を使用して、要素を接続するためのスペースを少なくします分離する情報のチャンク間のスペースが増えるこれにより、説明の配置の上または下の両方で良い結果が得られます。
情報の消費フローをサポートするために、人間の認識を利用して、画像の下の説明を使用することをお勧めします。
画像はテキストよりも魅力的な要素であり、より速く認識されるため、エントリポイントとして機能します。次に、上から下への読み取りパターンに従って、説明が提供されます。
画像の上に説明を配置すると、「決定点」が作成されてフローが一時停止し、ユーザーが上に行ったという説明を読む一方で、下にある次の画像がユーザーの注目を集めます。
![enter image description here]()
近接原理を最初に検討する必要があります。その後は、使用するメディアにも依存します。
ブログ、新聞、本たとえば、ほとんどの場合、画像の下にタイトルがあります。これはおそらく、画像が作品の全体的なコンテンツをサポートする素材を提供することを目的としているという事実に関係しています。そのため、段落を読み、サポートコンテンツ（画像）とその関連性を確認してから、さらに読むことができます。
image contentの過半数を占めるサイトでは、説明として見出しをかなり自然に使用し、上部に配置します。すぐに頭に浮かぶ例は9GAGです。これは、ユーザーが画像を通過する前に、画像が何であるかについてのアイデアを提供するという事実にも関係しています。
別の例は、この答え自体です。画像の前の説明。画像が伝えようとしていることを理解できるようにします。
download bmml source – Balsamiq Mockups で作成されたワイヤーフレーム
個人的に私は以下のテキストを好みますが、それは個人的な好みであり、本当の正誤はありません。それはあなたのコンテンツ、あなたが好むもの、画像が何であるかなどを含む多くのものに依存します。
特定のプロジェクトで両方の方法を試して、どれが効果的かを確認してください。それがユーザーの心の中でそれと関連付けられる画像に十分に近い限り、あなたは明確になります。多くのサイトでは、キャプションと画像の両方に境界線または背景を使用しているため、相互に関連していることがはっきりとわかります。
繰り返しますが、ここでは正解や不正解はありません。それはあなたの好み次第であり、あなたはどちらがあなたに最もよく見え、あなたのコンテンツに最も適しているかを確かめるために両方を試すべきです。写真とキャプションを必ず近づけて、関連付けられるようにしてください（繰り返し説明しますが、それは重要だからです）。
これには厳密なルールはありません。説明を配置する両方の方法に遭遇しました。
異なる画像の間に十分な間隔があり、その説明が説明する画像に近いことを確認する必要があります。
[image1]
Description1
...enough empty space or even some delimiter line here ------------------------------
[image2]
Description2
...
一方、説明が最初に来てコロンで終わるときは常にわかりやすくなります。このように、ユーザーは論理的に画像がテキストの直後にあることを期待します。このような：
Here you see image1:
[image1]
And this image shows the second one:
[image2]
...
重要な要素は、画像の機能とテキストとの対応関係です。画像の説明であるテキストは、画像の説明であるため、画像がコンテキストのソースであるため、常に画像の下に表示する必要があります。
これは、画像が見出しの下に配置されるのと同じ理由です。ニュース記事の場合、見出しはコンテキストであり、画像は視覚的な説明を介して追加の詳細を提供します。
つまり、最初にコンテキスト、次に説明です。これはテキストと画像の両方に適用されます。