Squoosh（スクーシュ）はGoogleが開発したウェブ上で無料で使用できる画像最適化ツールです。このツールは画像のサイズ変更、圧縮、またはフォーマット変換が可能で、JPEGやPNGなど様々なイメージフォーマットをサポートしています。
この記事では、私もWordPressサイトの制作でよく使用する、JPEGとPNGの画像をSquooshで最適化する基本的な手順を提供します。
「Squoosh」の使い方：画像のリサイズ・圧縮の手順
中央に表示されている「＋」アイコンをクリックするか、画像ファイルを直接中央エリアにドラッグ&ドロップ
右下のツールバーの「Edit」にある「Resize」から、Width（幅）に数値を入力して、画像のサイズを変更
「Compress」から画像ファイルに適した圧縮に使用するフォーマットを選択し、圧縮率を調整
圧縮の設定が完了したら右下の水色のボタンからダウンロード
下記に画像付きで詳しく説明します。
画像のアップロード
「Squoosh」にアクセスします。
表示された画面中央の「Drop OR Paste」のアイコンをクリックして圧縮・変換したい画像を選択するか、画像を直接ドラッグ&ドロップします。
画像をアップロードすると、左側にオリジナルの画像、右側に圧縮後の画像のプレビューが表示されます。右下のエリアからリサイズと圧縮を行います。
画像サイズの変更（リサイズ）
右側のツールバーの「Edit」にある「Resize」を選択します。クリックすると各種設定が表示されるので、Width（幅）に数値を入力して、画像のサイズを変更します。Height（高さ）は幅に合わせて自動で調整されます。
ブログに使用する画像は、一般的に横幅1,000px程度あれば問題ありません。
- 「Maintain aspect ratio」はチェックしたままにしておきます。アスペクト比を保持してリサイズができます。
画像の圧縮・変換
「Compress」から圧縮に使用するフォーマットを選びます。
ファイル形式が「JPG」の場合は「MozJPEG」を選択します。これはJPEG画像を効率的に圧縮するためのライブラリで、高品質な画像を低いファイルサイズで保存することができます。
クオリティのスライダーを左右に動かして、圧縮率を調整します。初期設定の「75」前後で設定しておけば大丈夫です。
ブログ用にリサイズした画像の場合は、実際のサイズに合わせて確認してください。
「PNG」の場合は「OxiPNG」を選択します。「Effort」は初期設定のままで大丈夫です。
ダウンロード
「Compress」のすぐ下にある水色の「Download」アイコンをクリックして、圧縮・リサイズした画像をダウンロードします。
複数の画像を一括でサイズ変更、圧縮したい場合
「Squoosh」では、画像のサイズ変更と圧縮を同時に行えますが、１枚ずつになります。５枚くらいからの複数の画像を一括でサイズ変更と圧縮を行いたい場合は、以下のサービスを使用してください。
Squooshの圧縮形式とエンコーダー
Squooshでは、多様な圧縮形式とエンコーダーを採用しており、画像の種類や使用目的に応じて最適な形式を選択することができます。以下は、以下は今回使用した形式です。
MozJPEG
MozJPEGは、JPEG画像を生成するための非常に高性能な「エンコーダー」（圧縮プログラム）です。SquooshでJPEG形式の画像を作成する際に、内部的にこの優れたMozJPEGの技術が利用されています。
どんな時使う？ ウェブサイトに掲載する写真について、「画質はできるだけ綺麗に保ちたい、でもファイルサイズはできる限り小さくしたい！」という場合に、MozJPEGは有力な選択肢となります。
どんな画像に向いている？ 写真やグラデーションを多用した画像など、色数が多い画像の圧縮に特に適しています。これはJPEG形式の基本的な得意分野です。
最大の特徴は、一般的なJPEGエンコーダー（多くのソフトウェアで標準的に使われているもの）と比較して、よりファイルサイズを小さくしても、画像の見た目の劣化を最小限に抑えられる点です。
言い換えると、同じくらいのファイルサイズにするならMozJPEGを使った方が画質が綺麗に、同じくらいの画質を保つならMozJPEGを使った方がファイルサイズをより小さくできる、ということです。
このため、ウェブサイトに掲載する写真画像を軽量化し、ページの表示速度を改善したい場合に効果的です。
基本的な注意点
MozJPEGもJPEG形式の一種なので、非可逆圧縮です。圧縮率を高く設定しすぎると、ブロックノイズなど画質の劣化が発生します。Squooshのプレビュー機能で、画質とファイルサイズのバランスを確認しながら調整することが重要です。
JPEG形式の基本的なルールとして、PNG形式のように背景を透明にすることはできません。JPEG形式の高効率なエンコーダー。高い圧縮率を持ちながらも、画像品質の低下を最小限に抑えることができます。
OxiPNG（オキシピング）
PNG画像のファイルサイズを、画質をまったく変えずに小さくする（軽くする）ための比較的新しいツールです。他の似たツールよりも、画像を「もっと小さく」できたり、作業が「より速く」終わったりすることが期待できます。
最後までご覧いただきありがとうございました。まだ記事数は少ないですが少しずつ増やしていきますので、またわからないことがあれば見に来てください。「WordPress 〇〇 ワプワカ」で検索してくださいね。
