[試] 画像を一括リサイズ、圧縮する方法 | 画像リサイズ、圧縮スクリプト「imgautopt」の使用方法解説

[試] 画像を一括リサイズ、圧縮する方法 | 画像リサイズ、圧縮スクリプト「imgautopt」の使用方法解説

こんにちは、marubon(@marubon_jp)です。

画像を一括リサイズ、圧縮する方法として紹介したimgautoptの使用方法の詳細に関するエントリです。インストール方法及び使用方法について解説します。

一括リサイズ、圧縮スクリプト imgautopt

imgautoptとは、ブログ等の画像準備を効率化するため私が作成したMac用スクリプトです。コマンドを一つ実行するだけで、複数のJPEGとPNG画像をまとめてリサイズ、圧縮できます。スクリプトの引数として、リサイズ後の画像の横幅を指定することで縦横比を維持したままリサイズを行います。利用用途に制限はありませんが、アイキャッチ画像等の準備作業での使用を想定して作成しています。

画像一括リサイズ、圧縮スクリプトimgautopt

 

一括リサイズ、圧縮スクリプト imgautoptの使用方法

以下より使用方法の詳細を解説します。ディレクトリという言葉を使用していますが、フォルダと置き換えて下さい。

1. スクリプトのダウンロード及び配置

Githubからダウンロードできます。オープンソースとして公開しており、ライセンスはMITです。

imgautopt – resize and compress images at once

上記Githubのページからダウンロードボタンをクリックし、必要なファイルを一括ダウンロードします。imgautopt-master.zipファイルがダウンロードされます。

Githubからダウンロード
Githubからダウンロード

ダウンロードしたファイル「imgautopt-master.zip」を解凍します。このアーカイブは以下のファイルを含んでいます。これらをスクリプトを配置したいディレクトリにコピー、または移動します。

ファイル名説明
imgautopt.shメインスクリプト
jpegoptimJPEG画像圧縮コマンド
libimageoptimjpeg.dylibJPEG画像圧縮コマンド jpegoptimのライブラリ
pngquantPNG画像圧縮コマンド
README.mdREADMEファイル
COPYRIGHTCOPYRIGHTファイル

以下は、HOME配下にScriptディレクトリ(スクリプト配置用ディレクトリ:/Users/<ユーザ名>/Script)を新規作成し、配置した例です。スクリプト配置先は、任意なのでお好みで管理しやすい場所に配置して下さい。

ファイルの配置

2. スクリプトのパス設定

実行時の利便性を考慮し、スクリプト及び関連ファイルを配置したディレクトリにパスを通します。これは、最初からパスが通ったディレクトリにスクリプトを配置しない限り、スクリプト実行にフルパスを指定する必要があるためです。どのディレクトリからもフルパスを指定することなくスクリプトを実行できるようにするため、パスの設定を行います。

ホームディレクトリ配下(/Users/<ユーザ名>)の.bash_profileファイルに以下を追記します。.bash_profileファイルが存在しない場合は、新規作成して下さい。これはログイン時に自動的に読み込まれるファイルで、パスの設定を追記しておくことで手動設定の手間を省くことができます。

例えば、/Users/marubon/Script配下にスクリプトを配置した場合は、以下を追記します。

.bash_profileはログイン時に読み込まれるファイルのため、追記時点では自動読込されません。よって、手動読込を行います。ターミナルを開き、ホームディレクトリ(/Users/<ユーザ名>)で以下のコマンドを実行します。.bash_profileを実行する(読み込む)という意味のコマンドです。

ターミナル上で以下のコマンドを実行し、スクリプトを配置したフォルダにパスが通っていることを確認します。これは、現在設定されているパスを表示するコマンドです。コマンド実行結果にスクリプトを配置したフォルダのフルパスが表示されていれば問題ありません。

 

3. スクリプトの実行

リサイズ及び圧縮対象の画像が配置してあるディレクトリに移動します。ターミナルを開きcdコマンドで対象のディレクトリに移動します。

imgautoptコマンドを実行し、画像のリサイズ及び圧縮を行います。下記の通りコマンドを実行します。リサイズ、圧縮対象の画像ファイルが存在するディレクトリ上で実行する点に注意して下さい。imgautoptのコマンド引数は、リサイズ後の画像の横幅になります。画像掲載場所に合わせて適宜調整して下さい。指定サイズの単位は、pixelです。

例えば、横幅を332pxにリサイズし、圧縮したい場合は、以下のようにコマンドを実行します。

リサイズ、及び圧縮された画像は、コマンドを実行したディレクトリ直下(オリジナル画像が配置してあるディレクトリ直下)のoutputディレクトリに出力されるので、この画像を使用して下さい。

尚、本スクリプトはオリジナル画像ファイルには手を加えないので、再編集が必要になった場合は、元の画像を編集し、再度imgautoptスクリプトを実行して下さい。新規にリサイズ、圧縮された画像ファイルがoutputディレクトリに再出力(上書き出力)されます。

また、画像ファイルのデータ容量の削減率等を知りたい場合は、実行ログを確認して下さい。下記のような実行ログ(例)が、コマンドを実行したディレクトリ直下のlogディレクトリに出力されます。ログの5列目が[RESIZE]となっているログがリサイズ、[COMPRESS]となっている部分が、圧縮に関するログです。

リサイズに関しては、ログから以下の情報を確認可能です。各列が以下の情報に対応しています。

圧縮に関しては、ログから以下の情報を確認可能です。各列が以下の情報に対応しています。

 

まとめ

画像の一括リサイズ、圧縮スクリプト「imgautopt」のインストール及び使用方法について解説しました。不明な点があれば、可能な範囲で質問に対応しますので、Twitter上でmarubon(@marubon_jp)までメンションを下さい。