はじめに
画像ファイル(PNG)を圧縮する必要があり、初めてpngquantを使ったので、インストール方法や使い方をまとめました！
今まではブラウザベースの無料PNG圧縮サービスを使っていたのですが、pngquantの方がプログラマー向けで使いやすかったです。
対象者
この記事は下記のような人を対象にしています。
- 駆け出しエンジニア
- プログラミング初学者
- 「画像圧縮するのにブラウザとか専用のツール使うのは面倒」というプログラマー
- 上司から「pngquant使ってPNG圧縮して」と言われた人(自分ですw)
結論
PNG圧縮をササッと終わらせたい！
そんな時はターミナルに下記コマンド打てばOK！
pngquant --ext .png --force --speed 1 {your_dir}/*.png
PNG圧縮ツールpngquantとは
pngquantはmacのターミナルで使えるPNG圧縮ツールです。
PNG圧縮ツールpngquantのメリット
- 複数ファイルを一括変換できる
- macのターミナルでサクッと実行できるのでプログラマー向き
なんと言っても、「ターミナルで実行できる」ことが一番のメリットではないでしょうか。
開発をしていると、出来るだけテキストエディタとターミナルだけで済ませられると気が散らなくて良いですよね。
「黒い画面は怖い...」という方はブラウザベースの無料PNG変換ツールを使うのがおすすめです。
PNG圧縮ツールpngquantのインストール方法
pngquantはHomebrewでサクッとインストールしましょう。
なにそれ？と言う方はHomebrew公式ドキュメントを参照ください。
brew install pngquant
PNG圧縮ツールpngquantの使い方
macのターミナルで下記コマンドを実行するだけです！
// 特定の画像だけ圧縮
pngquant {your_dir}/example.png
// 特定のディレクトリ内の画像全部圧縮
pngquant {your_dir}/*.png
PNG圧縮ツールpngquantのオプション
// 同一ファイル名で上書き
// 指定しない場合`-fs8.png`が自動でついてファイルが新規作成される
pngquant --ext .png {your_dir}/example.png --force
// 圧縮率を指定 (JPEGの圧縮率みたいなものらしい)
pngquant --quality=65-80 {your_dir}/*.png
// 圧縮スピード (1が最も遅く、10が最も速い。遅い方が圧縮率が高い、デフォルトは3)
pngquant --speed 1 {your_dir}/*.png
// IE6用
pngquant --iebug {your_dir}/*.png
私が使った上で最適だと思ったオプションはこれ。
// 圧縮率は最高＋ファイルを上書き
pngquant --ext .png --force --speed 1 {your_dir}/*.png
おわりに
PNGの圧縮ツールpngquantの使い方についてまとめました。
ターミナルを使用するので、万人向けではありませんが、プログラマ向けのPNG圧縮ツールです。
PNG圧縮はpngquantでサクッと終わらせて、開発に集中しましょう。
参考記事
pngquant
png画像の圧縮には pngquant を使おう [Mac/Win]
PNG画像ファイルを圧縮してブログを高速化した
pngquantで一括圧縮する