Vol.5 文字と画像の関係

こんにちは。ワンダースター竹内です。
前回は、文字をテーマにお話しさせて頂きました。
今回は、文字と画像の関係というテーマを取扱いたいと思います。

前回、文字は、ひらがな、カタカナ、英数字などがバランスよく配置された文章が視覚的に見やすいということをお伝えしました。
実際のWEBサイトや広告などでは文章とイメージ画像を組み合わせて何かを伝えることは多いと思います。

例えば、前回取り扱った

先着100社限定！WEBデザインが無料！

という文字を使ってWEB広告用のバナーを作ってみたいと思います。
文章に合わせるイメージ画像としては以下を使用することにします。

「お問い合わせをいつでも待っています」という意図を伝えることを目的とした画像になります。他にはWEBデザインの事例の画像など使用できるイメージ画像は多数あるとは思いますが、例として上記の画像を使用します。

よくある失敗例ですが、以下のように画像を薄く処理をして、その上に広告用の文章を重ねてしまうケースです。

このWEB広告バナーで伝えたいことは、

①先着100社限定！WEBデザインが無料！という文字内容
②「お問い合わせをいつでも待っています」というイメージ画像が持っている意味内容

になります。
このとき、画像を薄めることで、②の画像が持っている意味内容も薄めてしまうことになります。
結果としてWEB広告バナーとしては、印象が弱い、伝わりにくい内容になってしまいます。

WEBデザインやバナーを作る場合、いろいろな例外はありますが、背景や挿絵として画像を使用する場合、その画像が持っている意味や特性をできるだけそのまま使えるような構成でデザインすることをお勧めします。
それによって、文章の意味をより強めたり、見やすくしたり、より視覚的、直感的に伝わりやすくなる効果が期待できるからです。

この場合の正解例としては以下のような構成となります。

同じく、画像の上に文字を配置したシンプルなデザインですが、お問い合わせを待っているイメージ画像と、文字がバランスよく配置されて、直感的に内容が伝わりやすくなっていると思います。

WEBサイトやWEB広告バナーは、じっくり見られるようなものではありませんので、イメージ素材を使って、「直感的に」伝えることが非常に重要になります。

今回は、WEBデザインという広告バナーを例として作ってみましたが、同じようなことは、実際のWEBサイトや、広告バナーなどにも応用できますので、ぜひ参考にしてみてください。

---

---

本誌掲載の写真 ・ 記事 ・ 図版を無断で転写 ・ 複写することを禁じます。