ここ最近、はてなブログにスマートフォンのスクリーンショットをアップする機会が多くなりました。
その都度、記事内に表示される画像の粗さが気になっていて、記事にあるスクリーンショットの画質の悪さは、思い出を振り返る上でも、とても残念に思っています。
今までは比較対象がなかったので、仕方のないことと半ば諦めていたのですが、Twitterにアップした画像と、はてなフォトライフにアップした画像が並ぶと、画質の違いが歴然で、さすがになんとかならないのかと検証してみました。
いくつかの方法で改善を試みた
今回検証する画像をTwitterにアップし、この画質に近づけるのを目標にしてみます。
テスト pic.twitter.com/S2kXl8fUzJ
— おまめ (@omamemame3) 2014年2月1日
はてなフォトライフの「サイズ設定」の見直し
この画像は、はてなフォトライフのサイズ設定で、初期設定の450ピクセル(長辺)でアップしたものです。
上の画像は、画像サイズを600ピクセル(長辺)に変更してみました。
表示サイズを大きくすると、少しハッキリした気がします。(大きくしたのだから当たり前か…)
元画像のサイズ変更
元画像の720*1280を、変更したはてなフォトライフの600ピクセル(長辺)に収まるよう、画像の縦を500ピクセルにリサイズ。
かなりきれいに表示されました。
保存形式の変更
元画像の保存形式ををpngから、jpgに変更してみます。
なるほど…わからん…。
しかし、pngで505KBだった画像サイズが、jpgでは225KBに減り、およそ半分になりました。
さらに縦を500ピクセルにした先ほどの画像を、pngからjpgに変更。
png時の画像サイズは151KBでしたが、jpgに変更後は65.3KBまで減りました。
左がpngで右がjpgですが、画質の変化はぼくには全くわかりません。
まとめ
はてなフォトライフの設定から、画像サイズを大きく変更し、サイズに収まるようリサイズしてからアップすると、かなりきれいになった感じがします。
はてなフォトライフの画像サイズの変更は、以下の画像を参考にしてください。
いろいろと検証をして、フォトライフで設定されたサイズから溢れると、リサイズされ、そのサムネイルがブログに表示されるのでは、という見解になりました。
また保存形式を「png」から「jpg」へ変更すると、画質の変化は感じられずに、保存サイズがほぼ半分になることもわかりました。
参考になったリンクです。
どうやって使い分けるべきなのか。JPG・PNG・GIFの違いをまとめてみました。 | ギズモード・ジャパン
前々から気になっていたことだったので、ようやく納得できる対処法を見つけられてほっと一息です。
調べたり、検証しながら得るものがたくさんあって、また少し脳ミソが賑やかになったかと思います。
コチラもどうぞ