【2020年11月26日 追記】改善されたWebP Converter.

作者様に改善のご提案を行い、より良く使いやすくしていただきました。記事中の「彩度が失われる」問題もきっちり改善されています。
Ver.3.0.0ではウォーターマークの付与機能など、さらなる改善に取り組まれています。早速リスペクト！

WebPの変換ツール

雷´∀｀)ﾉ キャストオフそろそろWebPのあーだこーだが落ち着いてきた頃かなと導入を進めていこうと思い、サクッと一括変換できるようなツールを物色しました。

ブログ運用の流れ

とりあえずAirDropかGooglePhotoからごっそり画像を落として記事を書きながら画像を選定して画像を一括変換、ここの流れをJPGからWebPに変えるわけです。Th-MakerXからイメージオプティムで黄金パターンが出来ていたのですが、JPGかPNGから取って代わるWebP。

ツールにアレば良いなと思う機能

サーバのプランも速度も安いので無限に画像をアップできるわけでもなければ、くっそ重たいサイトにすると見づらくて仕方ない。そのバランスで画像サイズを確認するのは最重要項目。画質と容量を見れるツールを選定する必要があります。

GoogleのAIスコアも含め、見た目がきれいでスマートな容量を目指すチューニングは必要です。

結果

現状は『WebPonize』を使っていこうと思います。 Ver.3.00で改善された『WebP Converter.』を使っていこうと思います。

彩度が失われなければ確実に『WebP Converter.』です。挙動や処理、UIも欲しい機能はあるものの、基本的に分かりやすく使いやすいです。
120円よりもお金を出したいし、出せるツールです。

と思って記事をプレビューで見ていたら、比較元のJPG側がWebPで表示されているのに気づいてしまった・・・
WordPressがWebPに変換・表示してくれる状態になっていた。なんのプラグインだ・・・？？・・・『WebP Express』でした。

補足情報
  • HEICフォーマット画像を、Th-MakerXでリサイズを行い、PhotoShopのWebP変換を行うと、彩度が失われない。
  • HEICフォーマット画像を、PhotoShopでWeb変換を処理させると、彩度が失われてのっぺりした画像になる。手動でアクション処理・保存、バッチ、ドロップレットいづれも彩度が失われました。
  • オリジナル画像（例えば、HEICやPNGそのものや、PhotoShopで開き別名保存やWeb用に保存したJPG画像）からWebP変換を行った場合、比較した全てのツールで彩度が失われました。

比較情報

iPhone 12 Pro Maxで撮影した紅葉した落ち葉群の画像を「Th_MakerX」で1200pxのJPG化したものを使用（比較元JPG）しWebPの質は全て75の設定です。何種類か画像比較しようと思いましたが、オリジナルと明らかに差異があるものが「WebP Converter.」のみだったので冗長化を防ぐために1種類にしてます。

記載のデータ量はオフライン上に保存した時点の容量で、WordPressアップ時に減量処理がされています。例えばオリジナルJPGは985KBから表示用でWebPが592KBに、JPGが813KBに減量。

ということはJPGと比較しているのではなく、WordPressにアップされた時点で変換されているWebPが表示されていることになる・・・

  • 左の画像はオリジナルJPGからWordPress上で自動変換されたWebPが表示されています。

比較元JPG⇒WebP（985KB⇒592KB）VS WebP Converter.（483KB – 設定値75）

JPG⇒WebP（985KB⇒592KB）VS WebP Converter.（483KB）

比較元JPG⇒WebP（985KB⇒592KB）VS WebPonize（537KB – 設定値75）

JPG⇒WebP（985KB⇒592KB） VS WebPonize（537KB）

比較元JPG⇒WebP（985KB⇒592KB） VS PhotoShopドロップレット（523KB – 設定値75）

JPG⇒WebP（985KB⇒592KB）VS PhotoShopドロップレット（523KB）

比較したツール情報

WebP Converter. (Image Tool+ – 多分エンジンが一緒かな)

WebP Converter. (Image Tool+ - 多分エンジンが一緒)
  • 良いところ
    • 使いやすい感じがする（思わず120円課金してしまった）
    • 差分チェックができる（120円課金が必要）
    • PNGもHEICもガッツリ変換できる
  • 残念なところ
    • 色が退色、彩度が劣化してしまう（Th-MakerXから一度変換した画像、オリジナル画像の双方）
  • 気になったところ
    • 変換後の圧縮率(%)を見たい（他のツールで常時見ているからかも）
    • プレビューと出力後の画像が異なる（主に彩度）
    • 圧縮前に出力後の容量削減予想量がプレビューでしか確認できない、タブ上にあり少し見づらい
    • 縦画像をプレビューしたとき比較境界線が中央にない、右にグレーの背景が出てきて違和感がある

WebPonize

WebPonize
  • 良いところ
    • 圧縮率（出力後の容量削減率）が出てくれる
    • 処理が超高速
  • 残念なところ
    • HEICフォーマットは処理が出来ないのかバグった画像が吐き出される（変換できない）
    • アルファチャンネルを保有したPNGフォーマットは処理が出来ないのかバグった画像が吐き出される（変換できない）
    • 毎回保存先のダイアログが開く動作がかったるく、選ぶのもかったるい
    • リサイズができない
  • 気になったところ
    • 色の退色、彩度がない（Th-MakerXから一度変換した画像）が、オリジナル画像（例えば、HEICやPNGそのものや、PhotoShopで開き別名保存やWeb用に保存したJPG画像）から変換すると彩度が落ちてしまう
    • クオリティの設定がメニューのPreferencesまで行かないと変更できない
    • 一覧がクリアできない

PhotoShop ドロップレット／バッチ処理

  • 良いところ
    • 特になし
  • 残念なところ
    • PhotoShopがないと不可能（高額、維持費が必要）
    • 細かいチューニングがしづらい（アクション内をいじらないといけない）
    • 圧縮率（出力後の容量削減率）が出なく、どれだけ頑張ったかが分からない
    • 並列処理が出来なく連続処理が低速に感じる
    • 彩度が失われる（Th_Makerを通して変換した画像以外は必ずなってしまう）

Categorized in:

調査隊研究班,

Last Update: 2024-03-01

Tagged in:

, ,