明るい写真に文字を載せるときどうするか？

写真画像に文字を載せる、バナー制作やLPのファーストビューを作るなどする際に写真に文字を載せることはよくすると思います。
その場合、画像が暗めならば文字を白寄り、画像が明るければ文字を黒寄りにすれば視認性は問題なくなると思います。また画像に例えば暗いフィルタをかけるなどして加工することも非常に多いと思います。
しかし、写真画像をそのままがっつり見せたいときに、その写真画像の上に文字を載せると視認性が悪くなります。どうすればよいかなあ、と悩んで検証したことを記述しようと 思います。

いろんなパターンで試してみよう

用意した画像は下記です。自分が撮影したものです。これを一切加工しないで文字を入れてみて視認性をチェックしてみます。
ちなみに入れる文字は松尾芭蕉の俳句「人々をしぐれよやどは寒くとも」にしました。とくに深い意味はないです。あとフォントはゴシック体で行きます。

右下の自分のパソコンに個人情報が載ってしまったので黒くつぶしてます

黒文字のみ

テキストは写真の右上に載せることにします。

見えない

ただ黒のテキストを置いただけです。もう見えないです。。バナーだったらスルーですね。

白文字のみ

視認性悪い

白文字のみにしました。写真右上が屋根の下なので多少暗い影響で白文字のほうが黒文字よりましですが、まあ視認性はよくないです。

ドロップシャドウ

ちょっと良くなった

ドロップシャドウを付けました。黒でぼかしはなし(0px)です。
これぐらいになると読めるようになります。ただバナーとしては弱いですが、作字によってはいけるかもしれないです。

線

オーソドックスな文字加工

線をつけると視認性は上がります。線の太さをもっと大きくすればより見えます。ただ、線をつけるとポップ感が上がるといいますか場合によっては野暮な感じに見えるかもしれません。もちろんポップ風とかならありですし、明朝体でも例えば冷凍食品のチャーハンのパッケージに使うならすごくありと思います。

座布団を敷く白

座布団

座布団もよく見るデザインです。視認性も上がります。写真で一番見せたい部分を隠さずに配置できるならありと思いますが、使い方によってはなんといいますか洗練感が下がる気はします。ファーストビューならほかのデザイン要素、装飾と兼ね合わせて加工すればよくなると思いますが難しい。。

座布団透明

透明度85%+ハードライト

どのくらいの透明度がいいかが難しいですね。。場合によっては洗練されて見えないので、透明度なしにするほうが良いことも多いと思います。

座布団を敷く黒

黒座布団に白文字

この写真だと黒座布団のほうが視認性がよいですね。黒は高級感といいますかそういうイメージも出るので白座布団よりも良いかもです(この写真は)。

バランスとPO(場所、機会)ですね

まあどんな場所で使うデザインなのか、テイストやターゲットなどを考慮するとどれが正解かはないのですが、さすがに視認性の悪いのはどのデザイン作るにしろ候補からは外れると思います(昔のブラックハットSEOの隠し文字みたい)。
あとは文字の大きさや作字で大きく左右されるので、単純に今回の検証がすべてではもちろんないですが、いろんなことを考えさせられました。
いずれにせよ加工せずに写真を使ってそれに文字を入れる、のは難しいなあと思います。