Webで使用する画像ファイルの最適化
提供:maruko2 Note.
マイコミジャーナルで紹介されていた、Webで使用する画像ファイルの最適化方法についてのまとめ。
主に、画質を劣化させることなく画像ファイルサイズを小さくするための方法を紹介。
目次 |
JPEG
使用ツール: jpegtran
(www.ijg.org)
JPEG ファイル最適化のポイント
- JPEG ファイルは、ファイルの圧縮レベルを上げると画質が悪くなる非可逆圧縮を利用している。
- JPEG ファイルには、作成アプリケーションの情報や、デジカメの撮影情報(EXIF)といったメタデータが記述されていることがある。これらメタデータは画像自体には関係のないデータなので、メタデータを取り除くだけで画質を劣化させることなくファイルサイズを小さくすることができる。
- 画像の圧縮で使用するハフマンテーブルを最適化することで、圧縮率を改善することができる。
jpegtran コマンド最適化オプション
$ jpegtran -copy none -optimize src.jpg > dest.jpg
- -copy none
- JPEG ファイルのメタデータをすべて削除する。
- -optimize
- ハフマンテーブルを最適化する。
同名で保存する場合は、-outfile を使う。
$jpegtran -copy none -optimize -oufile foo.jpg foo.jpg
jpegtran のインストール
Mac OS X の場合
MacPorts で jpeg をインストールする。
$ sudo port install jpeg
Homebrew で jpeg をインストールする。
$ brew install jpeg
CentOS の場合
yum コマンドで libjpeg をインストールする。
# yum install libjpeg
Windows の場合
jpegtran.exe が配布されているので利用する。
PNG
使用ツール: pngcrush
(pmt.sourceforge.net/pngcrush/)
PNG ファイル最適化のポイント
- 圧縮アルゴリズムに可逆圧縮の Deflate を利用している。
- PNG ファイルは、チャンクという複数のデータブロックに画像データや付加情報を分けて記録している。これらチャンクのうち、画像描画に影響しないチャンクを削除することで、画質を劣化させることなくファイルサイズを小さくすることができる。(透過情報以外のチャンクは画像描画に影響しない。)
- 減色や PNG フォーマットの最適化(フィルタリング処理や圧縮レベルのをおこなうことでも圧縮率を改善させることができる。
pngcrush
コマンド最適化オプション
$ pngcrush -rem alla -brute -reduce src.png dest.png
- -rem alla
- 透過情報以外のチャンクを削除。
- -brute
- PNG ファイルを最も最適化するための方法を 136 パターン試みる。時間がかかる。(フィルタリング処理、圧縮レベルなどを試みる。)
- -reduce
- 劣化しないカラータイプや色深度に変更する。
-brute オプションは、136 パターンの最適化オプションを総当りで調べるため、ファイルサイズを最小にする最適化オプションを見つけることができるが非常に時間がかかってしまう。代わりに Deflate 圧縮を最大にする -l 9 オプションでもかなりの効果がある。
$ pngcrush -l 9 -rem alla -reduce src.png dest.png
pngcrush のインストール
Mac OS X の場合
MacPorts で pngcrush をインストールする。
$ sudo port install pngcrush
Homebrew で pngcrush をインストールする。
$ brew install pngcrush
CentOS の場合
yum コマンドで DAG リポジトリを利用してインストールする。
# yum --enablerepo=dag install pngcrush
Windows の場合
BlastPNGの簡単な使い方 で PNG ファイルの最適化ツール BlastPNG の解説がされている。
アニメーションGIF
使用ツール: gifsicle
(www.lcdf.org/gifsicle/)
アニメーション GIF ファイル最適化のポイント
- アニメーション GIF の画像(フレーム)のうち、変化のある部分のみを使用する(表示する)ようにすることで、画質を劣化させることなくファイルサイズを小さくすることができる。
gifsicle
コマンド最適化オプション
$ gifsicle -O2 src.gif > dest.gif
- -O2
- 最適化レベルを指定する。-O2 か -O1 のみ。
- -O1 では、互いの画像の変化のある部分のみ使用するように最適化をおこなう。
- -O2 では -O1 の最適化に加え、透過を使用しさらにファイルサイズを小さくする。
gifsicle のインストール
Mac OS X の場合
MacPorts で gifsicle をインストールする。
$ sudo port install gifsicle
Homebrew で gifsicle をインストールする。
$ brew install gifsicle
CentOS の場合
yum コマンドで DAG リポジトリを利用してインストールする。
# yum --enablerepo=dag install gifsicle