ブログ写真の見せ方で反応up|画像サイズ拡大の効果と簡単な加工方法!

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

ブログをもっともっと活用したい! そう考えるなら、ぜひオススメな方法の一つが「写真を効果的に見せる」というもの。さまざまな方法がありますが、今回は「画像サイズを拡大する」というテクニックを紹介します。

写真の画像サイズを拡大させるだけでも大きなインパクトが出ます。その実例を紹介するとともに、画像サイズを拡大するための簡単な方法も解説します。




画像サイズを大きくするだけでもインパクトは大きい!

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

まず最初にとりあげるのがこの写真です。

いかがでしょう? これは知人の家の庭から撮影した、東ジャワ「マラン」の夕方の光景です。サイズを思い切り大きくして表示させています。

と言っても、この写真1枚だけでは、よくわからないかもしれません・・・。小さな写真の場合と大きな写真の場合とで、どう効果が異なるか、順番に紹介します。

写真の画像サイズを大きくしたきっかけ

今日から、ブログに載せる写真の画像サイズをより大きく表示させることにしてみました。ブログを始めた当初はどうしていたかというと、「写真無し」で書いていました。

写真無しのブログ記事。とても読みにくいですよね・・・。

その後、写真を使い始めるようになると、横幅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が上がるかどうかはわかりませんが、また変化があれば、ブログで報告したいと思います。

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

武器としての書く技術 (中経出版)

武器としての書く技術 (中経出版)

イケダ ハヤト
817円(08/14 07:10時点)
発売日: 2013/06/27
Amazonの情報を掲載しています
スポンサーリンク

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










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

フォローする