*** 文字を写真のどちらに回り込ませるか ***

WEBサイトやブログで 「float:left」「float:right」 を使い文字を写真の左や右に回り込ませることがあると思いますが、被写体に目(Eye)がある場合、その目が向いている方向に(視線の先に)文字を回り込ませたほうがまとまりが出ます。


【A】

0702015_left.jpg

数年前に行った沖縄の小浜島にあるハピラパナでは孔雀が放し飼いになっていた。人には慣れていないようで近づくと逃げていってしまうが、まわりに誰もいないとわかると「ほら、きれいでしょ」と言わんばかりに大きな羽を広げ優雅な姿を披露していた。



【B】

0702015_left.jpg

数年前に行った沖縄の小浜島にあるハピラパナでは孔雀が放し飼いになっていた。人には慣れていないようで近づくと逃げていってしまうが、まわりに誰もいないとわかると「ほら、きれいでしょ」と言わんばかりに大きな羽を広げ優雅な姿を披露していた。



「目線の先に注目させたいものを置く」という手法です。雑誌などの表紙にもたまにこういう手法のレイアウトが使われているときがあります(モデルの目線の先にその号の特集タイトルをズバッと縦に入れてくるといったようなレイアウト)

最近は全体的にカメラ目線の目力(めぢから)で購買意欲を誘うタイプの表紙が多いような気がしますね。じっと見られると思わず買っちゃうんだよなぁ(苦笑)

モノや風景の写真でも左向き右向きの写真がありますので、float プロパティが使える方はぜひ試してみてはいかがでしょう。

そんな理由もあり本店内のサムネイルがズラッと並んでいるページは極力左端に並ぶ写真は右向きの写真もしくは正面向きの写真右端に並ぶ写真は左向きの写真もしくは正面向きの写真を持ってくるようにしています。単なる自己満足に過ぎないんですが(笑)
(2008/02) リニューアル後、縦位置のサムネイルも天地をカットして表示するようにしたので上記の文章は取り消しました。

「フレーミングは写真のレイアウトにも関係してくる」というそんな今日のエントリーでした。

この投稿の短縮リンク: