Squoosh(スクーシュ)は、ブラウザ上で使用できる無料の画像圧縮・リサイズ(サイズ変更)ツールです。アカウント登録やインストール不要で、基本的な機能は無料で利用できます。
ブログで使用する画像は、そのままアップロードするとファイルサイズが大きくなり、ページの表示速度が遅くなる原因になることがあります。
この記事では、WordPress初心者の方に向けて、Squooshを使った画像の圧縮・サイズ変更の方法を紹介します。
画像を記事へ入れる前の準備として、Squooshの基本的な使い方を紹介します。
Squooshとは
ブログで使用する画像をそのままアップロードすると、ファイル容量が大きくなり、ページの表示速度に影響する場合があります。
Squooshを使って記事へ入れる前に画像を軽量化することで、画像ファイルの容量を小さくできます。
Squooshはブラウザ上で画像を読み込み、画像の圧縮やサイズ変更、JPEG・PNG・WebPなどの形式変換ができるツールです。
ページの表示速度が改善されることで、読者が快適に記事を読むことにつながります。また、SEO対策の一つとしても重要です。
Squooshでできること
Squooshは、ブラウザ上で画像の圧縮やサイズ変更など、画像を軽量化するための編集ができます。
編集前と編集後の画像をプレビューで比較しながら調整できるため、画質を確認しながら作業ができます。
主な機能
・ 画像の縮小・リサイズ(サイズ変更)
画像の幅や高さを変更できます。
・ 画像の圧縮
画質を調整してファイル容量を小さくできます。
・ フォーマット(JPEGやPNGなど)の変換
JPEG・PNG・WebPなどへ変換できます。
・ 画質や色数の調整
画質を変更したり、色数を減らしたりする設定もできます。
画像の種類や用途に合わせて調整できますが、基本的な画像圧縮やサイズ変更では、使用しない場合もあります。
※ Squooshはスマホからも利用できますが、PCからの方が操作しやすいです。
Squoosh使い方
Squooshの操作方法は簡単です。画像を読み込み、サイズ変更や圧縮を行って保存するだけです。
ここからは、Squooshを使った画像の圧縮・サイズ変更の手順を紹介します。
※ Squooshはバージョンや設定の変更により、表示される項目や画面が異なる場合があります。
操作の流れ
① Squooshを開く
② 画像を読み込む
③ リサイズ(サイズ変更)をする
④ 画像形式や品質を調整する
⑤ ダウンロードする
それでは、順番に操作方法を紹介します。
① Squoosh公式サイトを開きます。
Squoosh公式サイト:https://squoosh.app/
英語表示の場合は、ブラウザの翻訳機能を利用できます。

② 画像を読み込みます。
画像をドラッグまたは、「+」ボタンから画像を読み込みます。
一度読み込んだ画像も、別の画像をドラッグすることで変更できます。

画像を読み込むと、以下の画面が表示されます。↓

③ リサイズ(サイズ変更)をします。
サイズ変更をONにして、画像の幅を入力します。
幅を変更すると、高さ(縦幅)は自動で調整されます。
※画像加工の時点でサイズ変更している場合は、Squooshで変更しなくても大丈夫です。

④ 画像形式や品質を調整します。
画像形式(JPEG・PNG・WebPなど)を選択できます。必要に応じて品質も調整できます。
画像形式を選ぶ目安
・JPEG(ジェイペグ):写真など、色が多い画像に向いています。
Squooshでは、JPEGを圧縮するときの方法を選べます。
・Browser JPEG: 一般的なJPEG形式です。
・MozJPEG: 画像の容量を小さくしやすいJPEG形式です。
※ブログで画像を軽くしたい場合は、「MozJPEG」を選ぶ方法もあります。
・ PNG(ピーエヌジー):ロゴやアイコン、背景を透明にした画像、文字・イラストが入った画像に向いています。
Squooshでは、PNGを圧縮するときの方法を選べます。
・Browser PNG: 一般的なPNG形式です。多くの環境で使える標準的な形式です。
・OxiPNG(オキシPNG): PNG画像を効率よく圧縮して、容量を小さくしやすい形式です。
※ブログで画像の容量を減らしたい場合は、「OxiPNG」を選ぶ方法もあります。
・ WebP(ウェッピー):画像の容量を小さくしやすく、Webサイトで利用されることが増えている形式です。
Squooshでは「WebP」を選択すると、WebP形式に変換できます。
※ SquooshではAVIFなどの新しい画像形式も選択できます。環境によっては対応していないブラウザーもあるため、ブログで使用する場合はJPEG・PNG・WebPなど一般的な形式を選ぶと安心です。
※ Squooshには色数を減らすなどの細かい調整機能もあります。必要に応じて利用できます。

⑤ ダウンロードをします。
スライダーを動かして、変更前と変更後の画像を比較します。
問題がなければ、画面右下の「ダウンロードボタン」をクリックして保存します。

これで、画像の圧縮・サイズ変更は完了です。
ダウンロードした画像を、WordPressの記事へアップロードして使用します。
-
-
WordPress初心者向け|画像の入れ方
続きを見る
画像はローカル処理なので安心
画像データはブラウザ上(ローカル)で処理されるため、基本的にサーバーへアップロードされません。
画像の取り扱いについて詳しく知りたい場合は、Squoosh公式サイトをご確認ください。
まとめ
ブログで使用する画像は、記事へアップロードする前にサイズ変更や圧縮を行うことで、ファイル容量を小さくできます。
Squooshはブラウザ上で利用でき、インストール不要で画像の圧縮やサイズ変更ができます。
WordPress初心者の方でも操作しやすいので、画像をアップロードする前の準備に活用してみてください。
画像の軽量化にはさまざまな方法があります。WordPressでは、Squooshなどのツールや画像最適化プラグインを利用する方法があります。
画像圧縮・最適化プラグインについては、こちらの記事で紹介しています。
-
-
【初心者向け】EWWW Image Optimizerの初期設定方法
続きを見る
ブログを始めるときに参考になったサービスや本を紹介します。
WordPressを始めるには、サーバーの準備が必要です。
私が利用しているサーバーを参考までに紹介します。
WordPressを始めたばかりの頃は、設定や操作方法で迷うことも多いと思います。
ブログを始めた頃に参考にした本を紹介します。
「ゆる副業」のはじめかた アフィリエイトブログ スキマ時間で自分の「好き」をお金に変える! [ ヒトデ ] 価格:1628円 |