はてなブログ、自動リサイズの画質を調整するには？

前回の記事で紹介したように、「はてなブログ」は、アップロードした画像を自動的にリサイズする仕組みになっています。このとき、アップロード方法に応じて「リサイズ後の画像サイズ」が変化することも覚えておく必要があります。今回は、このリサイズ機能の画質を調整して、画像を最適なファイル容量にする方法を紹介しておきましょう。

画像ファイルの容量は適切？

サイズの大きい画像をアップロードしたときに、画像を自動リサイズしてくれる機能は、ある意味、とても便利な機能といえます。しかし、問題がない訳ではありません。

 たとえば、前回の記事で紹介した画像の場合、リサイズ後の画像1枚あたり容量は300～500KB程度になりました。この画像は色彩の変化が少ないため、300～500KB程度のファイル容量で済みましたが、写真よっては1枚の画像で600KB以上になるケースも少なくありません。

 このような画像を1ページに何枚も掲載すると、画像だけで何MBもの容量になってしまいます。たとえば、600KB前後の画像を5枚掲載すると、画像だけで約3MBもの容量になります。これではスムーズなページ表示など期待できません。

ページの表示速度が遅いサイトは敬遠される傾向が強くなります。要するに、ページが表示される前に「戻る」ボタンで直帰されてしまう可能性が高くなるのです。これでは、せっかく作成した記事が台無しです。読んでもらえなければ、記事の良し悪しすら関係ありません。 

また、画像ファイルが重く、表示が完了するまでに時間のかかるページは、SEOの観点からも大きなマイナス要因になります。Googleは、「ページの表示速度」も順位決定の一つの指標としています。つまり、必要以上に画像を重くすると、SEOに逆行する行為になってしまうのです。アクセスアップを目指すなら、画像ファイルの容量にも十分に気を付けるようにしてください。

ファイル容量を減らしてからアップロードしても無意味？

これまでに解説した内容を知っている方は、あらかじめファイル容量を小さくしてから画像をアップロードしていると思います。しかし、これも無駄な作業に終わってしまう可能性があります。具体的な例で示していきましょう。

以下は、ブログ掲載用に1080×717ピクセル、56.1KBの画像ファイルを用意した場合の例です。画像編集アプリでJPEGの圧縮率（画質）を操作することにより、画像ファイルの容量を小さくしています。

これを「はてなフォトライフ」にアップロードすると、リサイズ後の画像ファイルは長辺800ピクセル、226KBになりました。リサイズ後の画像サイズは、「はてなフォトライフ」の編集画面で確認できます。

この結果を見ると、画像のピクセル数が少なくなっているにも関わらず、ファイル容量が約4倍に増加していることになります。これでは、事前に画像編集を行った意味がありません。

「はてなフォトライフ」は、画像のリサイズを行う際に画質100％でJPEG保存するように初期設定されています。このため、アップロード前よりファイル容量が大きくなってしまう場合があります。これは「はてなブログ」の編集画面から画像をアップロードした場合も同様です。

リサイズ後の画質を変更するには？

画像を最適なサイズにリサイズするには、設定変更を行っておく必要があります。すると、事前に画像ファイルを編集しなくても、アップロード後の画像を最適なサイズに調整できるようになります。

この設定変更は、はてなフォトライフの設定画面にある「画像サイズ」と「画質」の項目で調整します。初期設定されている画質100％は、必要以上に高画質な設定であり、このままではファイル容量が無駄に大きくなってしまいます。75～85%くらいに画質を落としても、写真の見た目はそれほど変化しません。画質を5％下げるだけでもファイル容量をかなり縮小できるので、各自で最適な値を探してみるとよいでしょう。

このように設定を変更しておけば、事前に画像ファイルを小さくしておく必要がなくなり、スピーディに記事を作成できるようになります。

試しに、前回の記事で紹介した画像ファイル（2048×1360ピクセル、1.29MB）を「はてなフォトライフ」にアップロードしてみると、リサイズ後の画像は長辺640ピクセル、38KBという結果になりました。これくらいのファイル容量であれば、表示速度に与える影響を最小限に抑えられると思います。

ただし、「はてなブログ」の編集画面から画像をアップロードした場合は、「画像サイズ」の設定に関係なく、常に長辺1024ピクセルにリサイズされます。「画質」の設定は反映されますが、ピクセル数が多くなるため、ファイル容量も大きくなってしまうことに注意してください。