photoshopなどから単純なassetで画像を書き出しただけだと
圧縮が不十分だったり、webpでの書き出しに未対応だったりするかと思います。
画像の容量が大きいと、SEO的にマイナスだったり、
表示に時間がかかってユーザーのストレスになったりするため、
画像をweb用に最適化させるためのバッチを作成しました。
web用に画像を使用する際にご活用ください。
使い方は下記の通りです。
「Node.js」のインストールは初回のみとなります。
Node.jsのインストール
https://nodejs.org/ja/ からインストール
（バージョンは LTS 推奨）
プロジェクトディレクトリ作成
E:\共有ドライブ\04.cyサイト･会社案内\03.その他\画像圧縮
→ convert_webp
上記のフォルダを任意のローカル環境にコピーし、
フォルダ内の「app.zip」を展開してください。
最終的には下図のようなディレクトリ構成になっていればOK
画像の圧縮
画像の圧縮を行う場合、
「original」フォルダの中に画像を格納し、
「convert.dat」または、
「convert_name_only.bat」をダブルクリックしてください。
どちらも圧縮設定は同じですが、
webp画像のネーミングルールが異なります。
ケースに応じて使い分けてください。
convert.dat
オリジナルのファイル名+拡張子+「.webp」というファイル名でwebp画像が出力されます。
例：hoge.jpg → hoge.jpg.webp
convert_name_only.dat
オリジナルのファイル名+「.webp」というファイル名でwebp画像が出力されます。
例：hoge.jpg → hoge.webp
画像変換後、
下記構成にて変換済みの画像と元画像が格納されたフォルダが開きます。
■フォルダ構成
output
└dist_YYYYDDMM(日付)
├original
│※元画像が格納されたフォルダ
├convert_log.txt
│※変換ログ
│ original: 〇〇KB ← 元画像のサイズ
│ webp: 〇〇KB ← webp変換後のサイズ
│ compressed: 〇〇KB ← オリジナル拡張子での圧縮後のサイズ
└変換後の画像
