【ブログの楽しみ方】画像の見た目の大きさを変えずに圧縮してサイズを小さくする／ロスレス圧縮とは

ブログなどのwebサイトに画像を掲載する場合、実際には“画像を呼び出す”命令（HTMLタグ）が記述されるだけで、画像は別の場所に保存されます。（ココログの場合、画像をそのまま掲載する場合は「マイフォト」、記事上には縮小画像＝サムネイルを表示する場合はサムネイル用の保管場所と、「マイフォト」の2箇所。）

つまり、画面上の画像はアクセスした時（そのページを開く時）に、いちいち呼び出されるわけです。従って、記事上に表示される画像が少ない、あるいは画像のサイズが小さいほど表示スピードが上がります。（但し、ブラウザのCache＝キャッシュに画像が保存されるため、2回目以降は素早く表示される。）

今回は、見た目にほとんど影響を与えず、画像サイズ（縦横のサイズではなく、バイト数）を小さくしてくれる方法のご紹介です。

• 紹介記事：　『無料でJPG、PNG、GIF、SVG画像を圧縮して小さくしてくれる「Compressor」』(Gigazine 2014年05月27日付）
• CompressorのURL：　http://compressor.io/

使い方はさほど難しくなく、上記記事を読めば分かりますが、以下、簡単にご紹介します。

サンプル画像

下はこのブログのサイドバーに現在表示している画像ですが、左が元画像、右が圧縮後の画像で、現在は圧縮後の画像を表示させています。

　

この画像のサイズは、縦横は220px × 300pxで同じですが、右が82.39 KB (84,371 バイト)、左が21.97 KB (22,498 バイト)です。

Compressorの使い方

手順としては、①画像をアップロードする→②web上で圧縮される→③圧縮された画像をダウンロードする　だけです。

1．サイトにアクセすると下のよう画面が表示される

2．下記の［SELECT　FILE］というボタンをクリックして、アップロードする画像を指定

3．ダウンロード

［DOWNLOAD YOUR FILE］ボタンをクリックするとダウンロードされる。

【追記】圧縮した画像のファイル名はデフォルトで元の名前に「-compressor」が付きます。ダウンロード時に「名前を付けて保存」で元画像と同じ名前で上書きしようとしたところ失敗しました。

ロスレス（lossless)圧縮とは

ここでは見た目を劣化せずにサイズを小さくすることだけを目的にしていますが、このサイトではロスレス圧縮という方法で圧縮してくれます。

losslessとは、コンピュータ用語では「情報が失われないデータ圧縮の」という形容詞で、ロスレス圧縮は日本語では「可逆圧縮」と呼ばれます。（可逆＝逆向きの反応も可能なこと、つまり元に戻せる⇔不可逆（lossy））

これがよく分かるのは、zip形式などの圧縮かと思います。

メールに添付して送るためにサイズを小さくしたり、アプリをダウンロードする際に圧縮されたzipファイルを“解凍”して元の形に戻した経験はあるのではないでしょうか。

不可逆性のファイル形式としてよく知られているものは、画像ファイルのjpgファイルです。

ブログなどにアップロードするためにjpgファイルを加工することはよくあると思いますが、（縦横のサイズ変更ではなく）色調を変えたり明るさを変えたりという修正を何度も繰り返して保存すると、そのたびに画質は劣化して元には戻せません。

下は、左が元画像、右は　明るさを少し変えて保存→元に戻して保存　を10回以上繰り返したものです。右の画像は少しぼやけてしまったのが分かるかと思います。

　

１、２回程度ではあまり変わらないのですが、もし、ブログ用などに画像を編集する場合、必要なら元画像は残しておいて、コピーした画像（コピーした時点では元画像と全く同じ画質）を編集するとか、編集結果を別の名前で保存して元画像を上書きしないようにするといった注意が必要です。

---