ブログ写真の効果的な見せ方|サイズ拡大のインパクトと簡単な方法

シェアしていただけると嬉しいです!

ブログをもっともっと活用したい! そう考えるなら、ぜひオススメな方法の一つが「写真を効果的に見せる」というもの。今回は、サイズを拡大させるだけでも大きなインパクトが出ることをご説明します。また、その簡単なやり方も解説します。

例えば、この写真、どうでしょう? 知人の家の庭から撮影した、東ジャワ「マラン」の夕方の光景。サイズを思い切り大きくして表示させたケースです。

東ジャワ マラン 夕方の田園風景
【写真:知人の家の庭から撮影した、東ジャワ「マラン」の夕方の光景】




写真のサイズを大きく載せるようにしたきっかけ

今日から、ブログに載せる写真の画像サイズをより大きく表示させることにしてみました。

ブログを始めた当初はどうしていたかというと、「写真無し」で書いていました。読みにくいですよね・・・。

その後、写真を使い始めるようになると、横幅320ピクセルのサイズで写真を載せるように。しばらくして、今度は400ピクセルへ拡大。そして数年前からは、さらに大きくして横幅480ピクセルのサイズへ。

「これでも充分大きいのでは?」と思っていたのですが、プロブロガーであるイケダハヤトさんから指摘され、「せっかく面白い画像が多いので、大きくしないともったいないですよ」と。

さっそく試しにサイズを大きくしてみると、「たしかに!」と実感。効果は大きいです。

写真のサイズを変えるだけでもインパクトは絶大!

まず、この写真をご覧ください。

これが、以前やっていた400ピクセルサイズ。

社員食堂にて。孫正義さんと私と娘
【写真:社員食堂にて。ソフトバンクの孫正義さんと私と娘】

続いては、数年前からやっていた480ピクセルサイズ。

社員食堂にて。孫正義さんと私と娘
【写真:社員食堂にて。ソフトバンクの孫正義さんと私と娘】

そして今回は、このサイズへ。

社員食堂にて。孫正義さんと私と娘
【写真:社員食堂にて。ソフトバンクの孫正義さんと私と娘】

どうでしょう? やはり大きい方がインパクトがありますよね。
(ただし、もともと400ピクセルの写真を横に伸ばしているので、少し画質が荒くなっていますが)

→【追記】その後、解像度の高い写真を見つけて差し替えました。

ソフトバンクの社員食堂で、孫正義さんと記念撮影
この度、ソフトバンクの社員食堂で、ランチをいただく機会に恵まれました。ソフトバンクの本社は、汐留のコンラッドホテルのビルにあります。 ...

写真サイズを大きく載せる、その簡単な方法

やり方は簡単で、例えば

(1)画像ごとにサイズを大きな数値で指定する
(2)CSS(スタイルシート)で写真サイズを規定する

のいずれかでOKです。

(1)なら、

<img src=".......jpg" width=480" height="270" />

の「width」の数値を大きくすれば、横幅が大きくなります。

でも毎回指定するのは面倒なので、私のオススメは(2)の方法。

しかも(2)なら、「相手の見ているブラウザーサイズに合わせてサイズを変更させる」なんてことも可能です。

私はブラウザーサイズの横幅100%の大きさに指定。
例えばスタイルシートで、

p.resizeimage img { width: 100%;}

と規定して・・・、

ブログに書くときは、

<p class="resizeimage">
 <img src=".....jpg" />
</p>

とすれば、OKです。

     □     □     □

さらに、むかし使っていた320ピクセルの写真から見ると、
その違いは、よりはっきりします。

これは、昔やっていた320ピクセルサイズ。小さいですよね・・・。

アマンリゾーツのエイドリアン・ゼッカー夫妻と
【写真:アマンリゾーツ創業者、エイドリアン・ゼッカー夫妻と】

その後サイズは、400ピクセルへ。
アマンリゾーツのエイドリアン・ゼッカー夫妻と
【写真:アマンリゾーツ創業者、エイドリアン・ゼッカー夫妻と】

続いて、数年前からやっている480ピクセルサイズ。
アマンリゾーツのエイドリアン・ゼッカー夫妻と
【写真:アマンリゾーツ創業者、エイドリアン・ゼッカー夫妻と】

そして今回は、このサイズへ。
(相手の見ているブラウザーサイズに合わせて100%のサイズに)

アマンリゾーツのエイドリアン・ゼッカー夫妻と

【写真:アマンリゾーツ創業者、エイドリアン・ゼッカー夫妻と】

(上の写真より小さくなりました・・・でも、元々の画像サイズが小さいので、こうなります)

どうでしょう? やはり大きい方がインパクトがありますよね。

ただし、もともと320ピクセルの写真を、むりやり横に伸ばしているので、画質がかなり荒くなっています。
でも、もっと画質の良い写真であれば、効果的に表示できるはず。

ブログに載せた写真のサイズ、ぜひチェックを!!

というわけで、ブログの画像サイズをより大きく表示させると、どれだけインパクトが出るのか、そして、そのやり方を簡単にご説明しました。

写真が大きいと見た目のインパクトがあるし、何よりも「もっといい写真を撮らなきゃ!」という気分にもなります。

ブロガーの皆さんは、ぜひご自身の写真サイズ、チェックしてみてください。写真を大きくすることで、PVが上がるかどうかはわかりませんが、また変化があれば、ブログで報告したいと思います。

ちなみに「ブロガーなら必読!」のイケダハヤトさんの本はこちらです。
イケダハヤトさん、ご指摘いただきありがとうございました!

サムスル
━━━━━━━━━━━━━━━━━━━━━━━━━
時の運と人の縁を極める日々の記録 】  渡邉 裕晃
━━━━━━━━━━━━━━━━━━━━━━━━━
ブログの更新情報のチェックは、こちらからどうぞ!
時の運と人の縁を極める日々の記録 Twitter: @_samsul
時の運と人の縁を極める日々の記録 Facebook: /samsulcom
━━━━━━━━━━━━━━━━━━━━━━━━━

スポンサーリンク

あわせて読みたい関連記事










シェアしていただけると嬉しいです!

フォローする