BLOG

Automatorで画像縮小・圧縮を完全自動化【Mac標準装備】

Automatorで画像縮小・圧縮を完全自動化【Mac標準装備】
考える人

画像をアップロードする前のリサイズや圧縮がめんどくさい…。

何か良い方法はないかなぁ?

こういった疑問に答えます。

本記事の内容

  • 画像を2クリックで縮小・圧縮する設定方法
  • Automatorの使い方
  • クイックアクションの名前を変更&削除する方法
  • ImageOptimを設定した時の注意点

ブログの更新で時間を取られるのが画像に関するアレコレですよね。

本記事では、Macに標準装備されている『Automator』というアプリを使って

画像を2クリックで『png → jpg』に変換、さらに任意の横幅に縮小、

そして『ImageOptim』という画像圧縮率最強アプリで同時に圧縮まで済ませてしまう設定を行っていきます。

この設定を行うことで画像を軽量化することはもちろん、作業を効率化してブログの執筆スピードを極限まで上げることができます。

ブログに限らずWEB制作でも重宝すること間違いなしです!標準装備でできるのも嬉しいですよね(Macユーザー限定になります)。

Automatorで画像縮小・圧縮を完全自動化【Mac標準装備】

  1. Automatorで画像をpng → jpgに変換する
  2. Automatorで画像を縮小する
  3. ImageOptimで圧縮して画像を軽量化する

Automatorで画像をpng → jpgに変換する

ブログでは画面をスクショして記事に使う機会が多いと思います。

スクショは基本png形式で保存されます。

そもそも、なぜpngからjpgに変換するかと言うと答えはシンプルに『jpg』の方が軽いからです。

透過させたいロゴ画像などはpngのままでOKです。

それでは早速Automatorを起動してみましょう。

Automatorは『Launchpad』の『その他』の中にあります。

Launchpadのその他 Automatorの場所

クリックで起動したら(起動しない時はDock内のアイコンをクリックしてください)

『クイックアクション』という歯車のアイコンをクリックして『選択』。

クイックアクションを選択する

『ワークフローが受け取る現在の項目』を『ファイルまたはフォルダ』に

クイックアクションを選択する 『ワークフローが受け取る現在の項目』を『ファイルまたはフォルダ』にする

『検索対象』を『Finder.app』に変更してください。

『検索対象』を『Finder.app』に変更する

次に左の『ライブラリ』から『写真』の『イメージのタイプを変更』を右の空きスペースにドラッグします。

『変更後のタイプ』を『JPEG』に変更してください。

『変更後のタイプ』を『JPEG』に変更する

これでどんな形式の画像もjpgになります(すでにjpg形式の縮小したい画像も可)。

Automatorで画像を縮小する

次に画像を任意のサイズに縮小する設定を行っていきます。

『イメージをサイズ調整』を同じく右の空きスペースにドラッグします。

『サイズ(ピクセル)指定』を任意のサイズ(横幅)に変更してください(比率パーセント指定も可)。

『サイズ(ピクセル)指定』を任意のサイズ(横幅)に変更する

僕はWordPressテーマ『JIN』を使っているので、アイキャッチはテーマ推奨の最小横幅760px、記事内に挿入する画像はcontainer幅と同じ700pxにしています(Automatorを2つ設定)。

これでどんな画像も指定した横幅のサイズに変更されます(縦横比は維持)。

ImageOptimで圧縮して画像を軽量化する

『ImageOptim』というアプリを使うので、あらかじめ下記からインストールして使える状態にしておいてください。

» ImageOptimをダウンロードする

Automatorの設定に戻ります。

『ファイルとフォルダ』の『ファイルを開くアプリケーションを設定』を右の空きスペースにドラッグします。

『アプリケーション』を『ImageOptim.app』に変更してください(インストールされていないと項目がありません)。

『アプリケーション』を『ImageOptim.app』に変更する

ここで保存します。

『command』 + 『s』を押すと『クイックアクションの名前』を決められるようになります。

任意の名前を入力してください。

いくつか作ることを考慮して命名するのがオススメです。

後ほど名前を変えるので、ここでは一旦『test』としました。

『クイックアクション』の名前を入力する

『保存』をクリックしたらAutomatorを閉じてもOKです。

Automatorの使い方

  • Automatorの使い方
  • クイックアクションの名前を変更&削除する方法

Automatorの使い方

縮小・圧縮したい画像の上で

『右クリック』 → 『サービス』(クイックアクションが少ないとダイレクトで→が表示されます) → 『test』をクリック。

Automatorの使い方

たったこれだけで画像が『png → jpg』に変換され、『横幅が任意のサイズ(700px)』に変更され、『ImageOptimを使って圧縮』されます!

1.5MBのスクショ画像が64KBにまで小さくなっていますね。

1.5MBのスクショ画像が64KBに圧縮されている

クイックアクションの名前を変更&削除する方法

『アップルマーク』 › 『システム環境設定』 › 『キーボード』 › 『ショートカット』 › 『サービス』で該当のクイックアクションを探してください。

該当ファイルを右クリックして『Finderに表示』をクリック。

該当ファイルを右クリックして『Finderに表示』をクリックする

すると、『ライブラリ』が開くので『Services』フォルダを開いてください。

『ライブラリ』内の『Services』フォルダを開く

その中に.workflow形式のクイックアクションが入っているので、ここで『名前の変更』や『削除』ができます。

『クイックアクション』の名前を変更する

名前を『700px-jpg-and-imgOpt』としました。

しかし、名前の変更はこの時点では反映されていません。

変更した.workflowをダブルクリックするとAutomatorが起動します。

そこで『command』 + 『s』で保存すると変更が更新されます。

ImageOptimを設定した時の注意点

上記の方法で縮小・圧縮した画像はImageOptimで開くように設定しました。

つまり、通常ダブルクリックで画像がプレビューされるはずの設定を変更してしまったので、画像を確認したい時は

該当の画像を右クリック › 『このアプリケーションで開く』 › 『プレビュー.app』で開いてください。

また、『②Automatorで画像を縮小する』までの作業をAutomatorで行い、

画像の圧縮を通常通り『ImageOptim』にドラッグ&ドロップした方が画像の圧縮率は高かったのでプレビューで開かなくなってしまうことを含め、

気になる方は『②Automatorで画像を縮小する』までの作業をAutomatorで行うように設定してください。

今回は以上です。

あわせて読みたい
ブロガーなら今すぐ知っておきたい【画像】に関する記事まとめ9選
ブロガーなら今すぐ知っておきたい【画像】に関する記事まとめ9選 WordPressでブログを運営しているけど、画像に関して知らないことがまだまだありそう。 一覧でまとまってる...