Webサイトに使う画像が重いと、ページの表示に時間がかかり、閲覧する人のストレスにつながります。そこで便利なのが、ブラウザだけで画像を圧縮・変換できる無料ツール「Squoosh(スクーシュ)」です。
Squooshなら、圧縮前後の画質を見比べながらファイルサイズを小さくできます。JPEGやPNGをWebP・AVIFへ変換したり、画像サイズを変更したりすることも可能です。
この記事でわかること
- Squooshで画像を圧縮・保存する手順
- WebP・AVIF・JPEG・PNGの選び方
- 画質を落としすぎない設定の目安
- 画像が読み込めないときの確認ポイント
もくじ
1. Squoosh(スクーシュ)とは
Squooshは、さまざまな形式の画像をブラウザ上で圧縮できるオープンソースのWebアプリです。アカウント登録やソフトのインストールは必要ありません。
画面中央のスライダーを動かすと、元画像と圧縮後の画像を同じ位置で比較できます。拡大して輪郭や文字のにじみを確認できるため、「軽くしたいけれど画質は落としたくない」というWeb制作時の調整に向いています。
画像は端末内で処理される
Squooshでは、画像の圧縮処理が端末内で行われ、画像そのものはサーバーへ送信されません。ただし、公式のプライバシー説明によると、基本的なアクセス情報や圧縮前後のファイルサイズなどはアクセス解析の対象になります。
未公開デザインや個人情報を含む画像を扱う場合は、画像に不要な情報が写り込んでいないかも確認してから利用しましょう。
2. Squooshの使い方
手順1:画像を読み込む
Squoosh公式サイトを開き、圧縮したい画像を画面へドラッグ&ドロップします。ファイル選択のほか、クリップボードにコピーした画像を貼り付けることもできます。
手順2:圧縮後の画像形式を選ぶ
画面右側の圧縮設定から、保存したい画像形式を選びます。迷ったときは、写真ならWebP、透過が必要なイラストやロゴもWebPを最初に試すとわかりやすいです。
| 形式 | 向いている用途 | 特徴 |
|---|---|---|
| WebP | 写真・図版・ブログ画像全般 | 画質とファイルサイズのバランスを取りやすく、透過にも対応 |
| AVIF | 写真をさらに軽量化したい場合 | 小さくできることが多い一方、圧縮に時間がかかる場合がある |
| MozJPEG | JPEGのまま軽くしたい写真 | 拡張子や運用を変えずに圧縮しやすい |
| OxiPNG | PNGのまま保存したい画像 | 透過画像や輪郭のはっきりした画像に使いやすい |
WebPをWordPressやHTMLで使う方法は、以下の記事でも詳しく解説しています。
関連記事:サイトのパフォーマンスを向上させるWebP画像の対応方法
手順3:画質を調整する
「Quality」の数値を変更すると、画質とファイルサイズが更新されます。数値を下げるほど軽くなりますが、下げすぎると輪郭のにじみや色の段差が目立ちます。
Web用画像の調整目安
- まずはQualityを70〜80前後から確認する
- 人物の顔、細い文字、グラデーション部分を拡大して見る
- 画質の違いが気にならない範囲で少しずつ数値を下げる
最適な数値は画像によって異なります。固定値だけで判断せず、中央の比較スライダーを動かして目視確認することが大切です。
手順4:必要なら画像をリサイズする
表示サイズに対して画像の縦横サイズが大きすぎる場合は、「Resize」を有効にして幅または高さを変更します。
たとえば、記事本文で横幅800px程度までしか表示しない画像を、横幅4000pxのまま掲載する必要はほとんどありません。圧縮とリサイズを一緒に行うと、ファイルサイズを大幅に小さくできます。
手順5:圧縮後の画像を保存する
画質と容量を確認したら、圧縮後のファイルサイズ付近に表示されるダウンロードボタンを押して保存します。元画像は自動的に上書きされないため、圧縮前の画像も残しておけます。
3. 圧縮前後で確認したいポイント
- ファイルサイズ:何KB・何%小さくなったか
- 輪郭:文字や細い線がぼやけていないか
- 色:空や背景のグラデーションに段差が出ていないか
- 透過:ロゴや切り抜き画像の透明部分が保たれているか
- 縦横サイズ:Webサイトで必要なサイズより大きすぎないか
容量だけを最小にするのではなく、実際に表示する大きさで違和感がないかを基準に調整しましょう。
4. Squooshを使うメリット
- 無料で、アカウント登録も必要ない
- 圧縮前後の画質をリアルタイムに比較できる
- WebPやAVIFなど複数の形式へ変換できる
- 圧縮とリサイズを同じ画面で行える
- 画像そのものを外部サーバーへ送らずに処理できる
5. Squooshを使うときの注意点
大量の画像を一括処理する用途には向かない
Squooshは、1枚ずつ画質を確認しながら調整する用途に向いています。商品画像などを何十枚も同じ設定で処理したい場合は、画像編集ソフトや一括変換ツールを併用した方が効率的です。
元画像は別に保存しておく
一度小さくした画像から元の画質を完全に戻すことはできません。再編集や別サイズでの書き出しに備えて、圧縮前の画像は残しておきましょう。
AVIFが必ず最適とは限らない
AVIFは小さくできることがありますが、画像によってはWebPの方が見た目と容量のバランスがよい場合もあります。形式名だけで決めず、同じ画像をそれぞれ書き出して比較するのがおすすめです。
6. 画像を読み込めない・保存できないとき
- ページを再読み込みする
- 別の画像で動作するか確認する
- 画像の縦横サイズが極端に大きくないか確認する
- ブラウザを最新版に更新する
- 拡張機能の影響がないか、シークレットウィンドウなどで確認する
非常に大きな画像は、端末のメモリ不足で処理に失敗することがあります。その場合は、先に画像編集ソフトで縦横サイズを小さくしてから読み込んでください。
7. Squooshに関するよくある質問
Squooshは無料ですか?
無料で利用できます。アカウント登録も必要ありません。
日本語表示にできますか?
画面の項目は英語ですが、画像の読み込み、形式選択、Quality調整、保存という流れはシンプルです。本記事の手順を見ながら進めれば操作できます。
WebPとAVIFはどちらがおすすめですか?
まずは扱いやすいWebPで画質と容量を確認し、さらに軽くしたい場合にAVIFと比較する方法がおすすめです。画像の種類によって結果が変わるため、実際の表示サイズで見比べて選びましょう。
8. まとめ
Squooshを使うと、ブラウザ上で圧縮前後を比較しながら、画像を軽量化できます。WebP・AVIFへの変換やリサイズもできるため、Web制作やブログ運営で画像を最適化したいときに便利です。
- 写真はWebPから試す
- Qualityは70〜80前後を起点に目視で調整する
- 表示サイズに合わせてリサイズする
- 元画像は別に保存しておく
画像の容量が気になったときは、まず1枚をSquooshで変換し、見た目とファイルサイズの違いを確認してみてください。

