【JPEG mini】重すぎるブログを改善するための秘策は画像圧縮にあったという話

年明けから思いっきり更新ペースが乱れてしまった@kei_designです。

詳しいところは置いといて、とにかく多忙のこの一年。無理なくブログを続けるために、とりあえずはパッと思いついたものはサッサと記事にしてアップする事が大事だと思い、今回はこんなネタを投下します。


このブログは画像でウンコ重いらしい。多分。

GTmetrix | Website Speed and Performance Optimizationというサイトがなんかスゴいサイトの表示速度を分析してくれる事を最近知りまして、私のブログはどんなもんなんじゃいという事で分析してもらいました。

Hyouka01

てってれー。C評価!微妙だなオイ。折角ならAとかEとか偏って欲しかった…。

ここで注目してもらいたいのはこの最上位に位置する『Optimize Images』ってところで、Google先生によると『画像の最適化』という事らしいです。

Top

つまり「画像をキッチリ圧縮しておくんなまし」というご指摘、なのではないか。DTP畑の人間なので、つい画質に拘って大きな画像にしがちだったのかも。

WEB用画像の圧縮と言ったらコレ!『JPEG mini』

という事で画像を極力劣化させずに圧縮する簡単な方法として筆頭に挙げられる『JPEG mini』を試してみることにしました。

有料版と無料版がありますが、違いは回数制限の有無のようなので、ちょっとブログ書く程度って事なら無料版で問題なし!

ICVT Ltd.

ICVT Ltd.
JPEGmini
★★★★☆
6件の評価
App Store
ICVT Ltd.

ICVT Ltd.
JPEGmini Lite
★★★★★
16件の評価
App Store

今まであんまり重要視してなくて、使ったり使わなかったりというか、使わない事の方が多かったこの子。折角なのでどれくらい違うのか検証してみました。

まずは未使用時の画像のサイズはこちら。

Before

そして使用後はこちら

After

112KBの削減に成功しました!!概ね60%程度の圧縮になりました。素晴らしい!

画像の劣化具合は以下のとおり。うーん、それ相応に劣化してます。JPEGっぽい感じ。無劣化無劣化と色んなブログで謳われてるけど、ちゃんと検証したのかな?実は劣化させない方法があるのかな?

追記:ブログをアップした後に、さらに検証をしてみたところ『解像度の高い画像ほど無劣化で高圧縮できる』という事が分かりました。(しかも七割ほど圧縮するというイケメンぶり)

つまり解像度が優先されるようなライブラリに保存された写真はキレイに圧縮できて、画質は割とどうでもいいWEB用の画像は劣化するけどしっかり圧縮できるという感じのようです。マジイケメン!

Beforeafter

因みにPhotoshopCS6でほぼ同サイズになるように画質を落としてみた所、劣化具合はほぼ同じになりました。フォトショでバッチ処理するより手軽でいいね!(そもそも値段が10倍以上違うし)

Photoshopsettei

お金をかけずに手軽に圧縮するならBest!

今回初めて自分のサイトを評価してみて、見える化した問題に取り組んでみたわけですが、効果のほどはこれから徐々に見えてくるのかなーと思っています。全て圧縮したわけじゃないし、PNGも混ざってたりするしね。

JPEG miniは聞いた話よりずっと普通のアプリでしたが、多分それは私がPhotoshopをいじくり倒してるせいだと思います。

Photoshopなんか使わずにブログを書いているという方にはマジでオススメのアプリです!

こんなアプリも…

JPEGとは別の、WEBではスタンダードなPNG画像を使う場合は『PNG mini』というアプリがあるそうです。見た感じ、JPEG miniとは違ったUIのものですが、同じようにドラッグアンドドロップで画像の圧縮が可能なアプリとのこと。

また、WindowsではCaesiumというアプリが良さそうな感じでした。以下のサイトにて詳しく解説されていました。こちらも参考になれば。

[Windows]今までで一番使い易かった!「Caesium」で画像サイズを削減しよう! – Sunabox

Danny

Danny
PNG mini
★★★★☆
1件の評価
App Store


0 返信

返信を残す

ディスカッションに参加しますか?
どうぞご参加ください!

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です