ブログの画像が容量オーバーしそうになったときの対策｜表示速度の改善にもつながる！

ブログの記事を見たときに文字だけじゃ見づらいですよね。

なので、記事を書いているときに画像を挿入している人も多いはず。

しかし、あまりにも挿入する画像の容量が大きいと容量がオーバーしてしまいます。

挿入する画像の数を減らせばいいのかもしれませんが、それだと満足のいく記事が書けないですよね。

じゃあどうすればいいのか？

画像圧縮をすればいいんです！

てことで、今回は画像圧縮するときにおすすめのツール「TinyPNG」を紹介します。

TinyPNGの使い方

tinypng.com

使い方はとても簡単。

「Drop your_png or_jpg files here!」と書かれている枠の中をクリックすると、フォルダが開きます。

その中から圧縮したい画像を選択すればOKです。

このように、491.3KBの容量だった画像が350.2KBにまで圧縮されました。

あとはdownloadをクリックして保存するだけ。

とっても簡単！

30秒もかかりません。

しかし、画像を圧縮すると画質が悪くなるのでは？と思った人もいるはず。

では、圧縮前の画像と圧縮後の画像を比較してみましょう。

左が圧縮前、右が圧縮後の画像です。

見た目は全然変わらないです。

けど、実際は右の方が容量が小さいんです。

なら、画像は圧縮して挿入した方がいいに決まってますよね。

さらに、画像を圧縮すると記事の表示速度が速くなるんです。

表示速度がおそいとせっかく記事を見ようと来てくれたユーザーが見るのをやめてしまいます。

一般的に、記事の表示に３秒かかったら40％の人が離脱するといわれています。

だから、画像を圧縮して表示速度を上げるのはとても大切なことなんです。

5MBを超えると…

基本的には「TinyPNG」を使えば画像圧縮はできるのですが、圧縮できないときがあります。

それは、画像の容量が５MBを超えたときです。

５MBを超える画像を圧縮する場合は、有料版を使用しなければいけません。

５MBを超える画像なんてあるの？と思う人もいるかもしれませんが、容量の大きいスマホゲームのスクショ画像なんかは５MBを超えてしまいます。

しかし、そんな画像をそのまま挿入なんかしたりしたら容量がオーバーする可能性がありますし、表示速度も遅くなってしまいます。

こういうときは「ペイント」を使いましょう。

PNGからJPEGに変換

①ペイントを開いたら、圧縮したい画像を貼り付ける

②ファイル→名前をつけて保存をクリック

③ファイルの種類をJPEGにして保存をクリック

これでOK。

あとは、「TinyPNG」を使って圧縮すれば完成です。

 まとめ

僕は最初画像の圧縮なんか知らなかったので、５MBを超えるような画像をバンバン貼っていました。

その結果、容量がオーバーしそうになってはてなブログproに移行しようかどうか本気で迷いました。（無料版は300MB/月、proは3GB/月）

みなさんはこんなことにならないように、画像の圧縮をしましょう。