写真に文字を乗せるテクニック

写真上のテキストが読めない問題

写真の上に文字を乗せると「写真との色が被って読めない」「なんか安っぽく見える」ことがよくあります。
これは技術的な問題であり、正しいテクニックを知れば解決できます。

5つのテクニック

① 暗いオーバーレイは最もシンプルな方法です。黒の半透明レイヤーを写真の上に重ねる（透明度50〜70%）と、
白テキストを乗せても読みやすく、写真のムードを保てます。

② 明るいオーバーレイは白の半透明レイヤー（透明度40〜60%）を重ねます。
黒や濃い色のテキストに合わせる柔らかい印象の手法です。

③ グラデーションオーバーレイはプロが最も多用するテクニックです。
写真の下半分だけを透明→黒にグラデーションにすることで、
上は写真がきれいに見え、下のテキストは読みやすくなります。

④ テキスト背景ボックスはテキストの後ろだけに半透明の背景ボックスをつけます。
写真全体を暗くせずに可読性を確保できます。

⑤ 写真の単色部分を活用するのはオーバーレイ不要の方法です。
空・壁・床など色が均一な部分にテキストを配置します。

対比比と文字色

テキストと背景の対比比はWCAG（ウェブアクセシビリティ基準）で4.5:1以上が推奨されています。
Webaim（webaim.org/resources/contrastchecker）で無料で確認できます。

暗い写真や暗いオーバーレイの上には白テキストを、
明るい写真や明るいオーバーレイの上には黒または濃いダークカラーのテキストを使うことが基本です。

まとめ

写真上のテキストを読みやすくする方法は5つあります。
状況や目指す印象によって使い分けることで、写真の魅力を活かしながらテキストをしっかり伝えられます。

テクニックあり vs なしで読みやすさを比較する

「写真に文字を乗せるだけ」と「テクニックを使って乗せる」では読みやすさが大きく変わります。

NEXT STEP