ウェブコンテンツにおける写真と本文の関係性

ウェブコンテンツの中の写真やイラストと文章の配置で、時々違和感を感じることがあります。

たとえばこの記事の下の方にあるハムの商品説明。写真→キャプション→本文説明という順序になっています（この記事自体はとても素晴らしいもので、批判どころかとてもためになりました）。
https://bizhint.jp/report/921117?utm_campaign=20240227_post_news&utm_medium=email&utm_source=bizhint.jp&trcd=eml_pr_20240227_post_news_report01

紙媒体の中で、主に写真を扱う「雑誌」を扱ってきた人には納得していただけると思うのですが、文章を読んでいって、その具体例や補足説明としての写真を見る方が自然、だと思ってしまうのです。

ただ、ウェブコンテンツでは時折、この関係が逆転していることがあります。つまり、写真があって、場合によってはキャプションもついていて、その後に本文が出てくるというかたち。

これは、新聞、雑誌、書籍などの多くが文章は途切れることなく連なっていて（空き行もない）、写真などはその脇や流れの外に置かれることが多いためでもあります。よく「〜なのだ（図１）」のように文章から図に飛ばすかたちにはなっていますが、文章の合間に写真などが置かれることはほとんどありません。

これは、読み手の理解を深める上で文章の流れを断ち切らないようにするためでもありますし、レイアウト上あまり複雑な配置にすると流れがわかりにくくなってしまうためでもあります。本文でも説明しているのにキャプションが入るのも、理解を補足するためのものです。

これが縦長のウェブコンテンツに置き換えられた時に、写真の位置をどこにするかというと、本文を断ち切るように配置することが多いです。それだと文章の流れが切れてしまいそうですが、ウェブは段落や改行を入れることが基本になっていることもあり、読んでいてもあまり切れたようには感じないでしょう。

そう考えると、やはり本文→写真という流れの方が唐突感がなく、頭にもスムーズに入ってくると思うんです。

アエラみたいな雑誌レイアウトと、ウェブにしたときのイメージ例。テキトーです。

逆に配置する理由がある場合ももちろんあります。それは、キャプションなしで、単なるイメージとして見せるような場合。ただ、前述の記事ではドイツで賞を取ったということを写真＋キャプションで見せてから本文で「実は〜」となっていて、やはり違和感を覚えました。

こんな小さなことなんて別に気にするほどでもないかもしれません。ただ、これがひとつの縦長の記事の中で4つも5つも続いたら、多分「離脱」につながる可能性も出てくるでしょう。

あくまで個人的な意見ですが、やはり本文→写真という流れは崩したくないと思うのです。

もし自分でブログや記事などを作る時に写真を入れることがあったら、原則としてこの「違和感」がないようにすると、よりよい雰囲気の記事になるかもしれません。