アメブロに投稿した3枚の画像、どれが一番綺麗に見えますか? | トータルブランディング城岡崇宏

トータルブランディング城岡崇宏

テクニックではなく、事業を動かすための整える力とブランディングの本質を体系的に学べブログです。

同じ写真を3枚アップしてみました。表示サイズはどれも620pxなのですが、元サイズは全て異なります。

よーくみるとそれぞれ見え方(画質)が違うのですが、わかるでしょうか?(PC表示の場合)

滝をみると、違いがわかりやすいと思います。


画像1


画像2


画像3



どうですか?

違いがわかったでしょうか?笑

気合いを入れて風景写真をとって投稿しても、画像の劣化が酷いと残念感が大きいです。



で、先ほどの質問ですが、皆さんはどの画像が一番綺麗に見えたでしょうか?



私のパソコンでは1枚目は完全にボケてます。

2枚目が一番綺麗で3枚目はボチボチ綺麗かな...



それぞれの元画像のサイズはというと

(1)は620pxのjpeg画像

(2)は800pxのjpeg画像

(3)は1200pxのpng画像


画像3が圧倒的に綺麗に表示されるだろうと期待したのですが、画像2が一番綺麗に見えます。(私のPCモニターの場合)



今度は文字を入れて実験してみました。

「文字」と「橋」をみると違いがわかりやすいと思います。


画像4


画像5


画像6




(4)の画像は620pxのpng画像

(5)の画像は800pxのpng画像

(6)の画像は800pxのjpeg画像


微妙な違いなのですが、景色などの綺麗な写真は可能な限り綺麗に表示させたいし、

文字少しでもシャープなほうが読みやすいしかっこいいと思います。



アメブロの投稿画像の質にこだわりたい方は、こちらのCSSを入れてみてください。

設定したサイズに自動縮小して表示させるCSSです。

横サイズに620と設定したので、800pxや1200pxの画像も自動的に620px表示させることができます。

興味のある方は実験してみてくださいね!

実験じゃなくても便利ですよ!



/* 大きい画像を自動縮小 */
.articleText img{
max-width:620px;
height:auto !important;
}


微妙な記事で申し訳ありません。笑