こんにちは "osaboo"
です。"@osaboo_Bot"
TinyPNGの使い方と特徴|画像を簡単に圧縮してサイト表示速度を改善

ブラウザ上で使える画像圧縮ツール「TinyPNGの使い方と特徴」を解説します。
Question画像が重くてサイトが遅い…どうする?
Webサイトやブログに画像を多く使うと、ページの読み込みが遅くなってしまうことがあります。
特にPNGや高画質JPEG、AVIF、WEBPなどの画像は容量が大きく、表示速度に影響しやすいのが悩みどころです。
そこでおすすめなのが TinyPNG !!
ブラウザ上で手軽に画像を圧縮でき、画質をほとんど落とさずに容量を削減できるツールです。
この記事では、ウェブ版 TinyPNGの特徴と使い方を初心者向けにわかりやすく解説するとともに、WordPressプラグイン版 TinyPNG – JPEG, PNG & WebP image compressionを使った自動画像圧縮の設定方法も紹介します。
- Webサイトやブログの表示速度を改善したい
- 画像の容量を減らしたいが画質は落としたくない
- 初心者でも簡単に画像圧縮ツールを使いたい
- WordPressでアップロード時に自動圧縮したい
- TinyPNGの特徴とメリット
- PNG・JPEG・AVIF・WEBPなどの画像を簡単に圧縮する方法
- ウェブ版 TinyPNG と、WordPressプラグイン版 TinyPNG – JPEG, PNG & WebP image compression の使い方
- 圧縮時の注意点や無料版・有料版の違い
それではご覧ください。
TinyPNGとは?


TinyPNGはブラウザ上で手軽に使える画像圧縮ツールで、PNGやJPEGだけでなく、AVIFやWEBPといった最新形式の画像も圧縮できます。
無料版と有料版の違い


| 項目 | 無料版 | 有料版 |
|---|---|---|
| 圧縮枚数 | 1回につき20枚まで | 無制限 |
| 1枚あたり容量 | 最大5MB | 最大75MB |
| アカウント登録・ログイン | 不要 | 必要 |
| API利用 | ー | ◯ |
特徴
- 高圧縮率でも画質をほとんど損なわない
- 操作がシンプルで初心者でも使いやすい
- WordPress用プラグインやAPIもあり、自動圧縮も可能
TinyPNGの特徴・メリット
TinyPNGは、シンプルな操作で高品質な圧縮ができる人気の画像圧縮ツールです。ここでは、TinyPNGを使うことで得られる主な特徴とメリットを紹介します。
1. ブラウザだけで簡単に使える
TinyPNGはインストール不要で、公式サイトにアクセスするだけで利用できます。
画像をドラッグ&ドロップするだけで圧縮が始まるため、初心者でも迷わず使えます。
面倒な設定や専用ソフトの準備が不要なのが大きな魅力です。
2. 高圧縮でも画質をほとんど劣化させない
TinyPNGは独自の「スマート圧縮技術」により、画像データの不要な部分を削除しつつ、肉眼ではほとんど違いがわからないレベルの高品質な仕上がりを実現しています。
そのため、ブログやWebサイトの見た目を保ったまま、データサイズを大幅に削減できます。
3. 複数形式(PNG・JPEG・AVIF・WEBP)に対応
名前の通りPNGだけでなく、JPEG、AVIF、WEBPといった最新の画像形式にも対応しています。
WebPやAVIFは特に軽量なフォーマットなので、TinyPNGと組み合わせることでさらに高速表示を狙えます。
4. WordPressプラグインで自動圧縮できる
TinyPNGには、公式のWordPressプラグイン「TinyPNG – JPEG, PNG & WebP image compression」が用意されています。
このプラグインを導入すれば、画像をアップロードするたびに自動で圧縮されるため、日常的な更新作業も効率化できます。
5. 無料でも十分使える
無料版でも1回につき20枚まで、1枚あたり5MBまでの画像を圧縮可能です。
個人ブログや小規模サイトであれば、この範囲でも十分に活用できます。
必要に応じて有料プランにアップグレードすれば、大容量画像やAPI連携も可能です。
6. サイト表示速度とSEOに効果的
画像サイズを軽くすることで、ページの読み込み速度が向上します。
サイトの表示速度はSEO(検索エンジン最適化)にも関係するため、TinyPNGを使うことで結果的に検索順位アップや離脱率の低下にもつながります。
TinyPNGの使い方は2通り!ウェブ版とWordPressプラグイン版を解説
TinyPNGには、ブラウザ上で手軽に使えるウェブ版と、WordPressサイトで画像を自動圧縮できるプラグイン版の2種類があります。
次の章では、それぞれの使い方をステップごとにわかりやすく解説していきます。を順番に解説します。
TinyPNGの使い方(ウェブ版)
TinyPNGのウェブ版は、公式サイトにアクセスして画像をドラッグ&ドロップするだけで使えます。
TinyPNG公式サイト のトップページで完結します。
- 「ここに画像をドロップしてください!」と表示されたエリアに、圧縮したい画像をドラッグ&ドロップします。
- 自動的に圧縮が始まり、数秒で完了します。
- 圧縮後のファイルの右側にある「Download」ボタンをクリックして保存します。
- まとめて保存した場合は「tinified.zip」を解凍してファイルを取り込めばOKです。






TinyPNG – JPEG, PNG & WebP image compressionの使い方
(WordPressプラグイン版)
TinyPNGをWordPressで使う場合は、公式プラグイン「TinyPNG – JPEG, PNG & WebP image compression」を利用します。
画像をアップロードするだけで自動的に圧縮されるため、サイト運営の効率が大幅にアップします。
- アカウント登録が必要です。
- 無料APIキーでも月500枚まで圧縮可能です。
- 無料圧縮枚数は月初にリセットされます。
TinyPNG – JPEG, PNG & WebP image compressionの導入手順
- WordPress管理から、「プラグインを追加」を開きます。
- 「TinyPNG」を検索します。
- 「TinyPNG – JPEG, PNG & WebP image compression」をインストールして有効化します。
- 「TinyPNG」の設定画面を開きます。
それでは順番に見ていきましょう。
WordPress管理から、「プラグインを追加」を開きます。
Menu『WordPress管理>ダッシュボード>プラグイン>プラグインを追加』をクリックします。


「TinyPNG」を検索します。
「プラグインを追加」画面で、「プラグインの検索」欄に『Tiny PNG』と入力します。
「TinyPNG – JPEG, PNG & WebP」を選択します。


「TinyPNG – JPEG, PNG & WebP image compression」をインストールして有効化します。
『今すぐインストール』をクリックします。
➡︎


『有効化』をクリックします。
⬇︎


「TinyPNG」の設定画面を開きます。
Menu『WordPress管理>ダッシュボード>プラグイン』をクリックします。
プラグイン一覧から、「TinyPNG – JPEG, PNG & WebP image compression」の「Settings」をクリックします。
- 右側にある「自動更新を有効化する」をクリックしておきましょう。


または…
Menu『WordPress管理>ダッシュボード>設定>TinyPNG』をクリックします。


TinyPNG – JPEG, PNG & WebP image compressionのアカウント登録
TinyPNGの設定画面が表示されたら、「新規アカウント登録」を行います。
TinyPNGの設定画面で、Tinifyアカウント欄の左側にある入力ボックスへ、以下の内容を入力し、『Register Account』ボタンをクリックします。
- 『あなたのフルネーム』を入力します。
- 『あなたのメールアドレス』を入力します。


登録したメールアドレスに以下のようなメールが届きます。
『Activate your account』ボタンをクリックして、APIキーを取得するためのページを開きます。


「APIキー」をクリックしてコピーします。


TinyPNGの設定画面に戻り、Tinifyアカウント欄の右側にある入力ボックスへ「APIキー」を貼り付けて、『Save』ボタンをクリックします。


Tinifyアカウントが正常に接続されると、「アカウントが接続されました」と表示される画面に切り替わります。


TinyPNG – JPEG, PNG & WebP image compressionの設定方法


ここからは、「TinyPNG – JPEG, PNG & WebP image compression」の各種設定方法を解説していきます。
設定画面は、前章でアカウント登録を完了したページをそのまま下にスクロールすると表示されます。
後から再度開く場合は…
Menu『WordPress管理>ダッシュボード>設定>TinyPNG』をクリックします。
それでは順番に見ていきましょう。
- New image uploads(新しい画像のアップロード)
- Image sizes(画像サイズ)
- Conversion(変換)
- Original image(オリジナル画像)
❶ New image uploads(新しい画像のアップロード)
New image uploads(新しい画像のアップロード)では、WordPressに新しく画像をアップロードした際の圧縮設定を行うことができます。
つまり、画像を追加したタイミングで自動的にTinyPNGが圧縮を実行するかどうかを指定する項目です。
基本的には、初期設定(デフォルト)のままで問題ありません。
英語


日本語


❷ Image sizes(画像サイズ)
Image sizes(画像サイズ)では、画像アップロード時にWordPressが自動生成する「サムネイル」「中サイズ」「大サイズ」など、複数の画像サイズに対して、どのサイズをTinyPNGで圧縮するかを設定できます。
デフォルトでは、すべての画像サイズにチェックが入り、全サイズが圧縮される設定になっています。
ただし、このままだと無料プランの上限に達しやすくなるため、自分のサイトで実際に使用しているサイズのみに絞って圧縮するのがおすすめです。
英語


日本語


デフォルト
WordPressのメディア設定および「Image sizes(画像サイズ)」の設定が初期状態の場合、以下のように、すべての画像サイズにチェックが入った状態で表示されます。


ここで注意したいのは、チェックしたサイズの数だけ圧縮対象が増えるという点です。
例えば、1枚の画像をアップロードする際に「サムネイル」「中サイズ」「大サイズ」の3つにチェックを入れると、TinyPNGでは3枚分の画像を圧縮した扱いになります。
無料プランでは圧縮可能な画像枚数が500枚までに制限されているため、チェックを入れすぎるとあっという間に上限に達してしまいます。
そのため、圧縮する画像サイズはサイトで必要なものに絞ることが重要です。
❸ Conversion(変換)
Conversion(変換)では、WebPやAVIFなどの最適化された画像形式を生成することができます。
これらの形式はサイトの表示速度向上に役立ちますが、その分ディスク容量を多く消費する可能性があります。
また、最適化された画像を作成する際は、各画像サイズごとに1回ずつ圧縮が実行される点にも注意が必要です。
無料で利用する場合は、初期設定(デフォルト)のままにしておくのがおすすめです。
英語


日本語


❹ Original image(オリジナル画像)
Original image(オリジナル画像)は、「Image sizes(画像サイズ)」の Original image (overwritten by compressed image) 元の画像(圧縮画像で上書き) にチェックを入れると表示される項目です。
アップロードする画像の最大の幅と高さを指定しておくと、不要に大きな画像を自動で縮小でき、サーバー容量を節約できます。
ただし、このサイズ変更を有効にすると、設定したサイズを超える画像ごとに1回の圧縮が行われる点に注意しましょう。
無料で利用する場合は、初期設定(デフォルト)のままにしておくのがおすすめです。
英語


日本語


メディア設定(WordPressの画像サイズ設定)
ここでの設定内容は、「Image sizes(画像サイズ)」に表示される各画像サイズにも反映されます。
Menu『WordPress管理>ダッシュボード>設定>メディア』をクリックします。


「メディア設定」画面が表示されます。
この記事の設定では、以下のように設定しています。
- サムネイルのサイズ
- 幅:1200
- 高さ:630
- 中サイズ
- 幅の上限:0
- 高さの上限:0
- 大サイズ
- 幅の上限:900
- 高さの上限:0
ここでは、使用しない画像サイズの「幅の上限」と「高さの上限」を「0」に設定しておきましょう。
このように設定すると、そのサイズの画像は自動生成されなくなります。


デフォルト
WordPressのメディア設定が初期状態のままの場合の設定です。


まとめ!TinyPNGの使い方と特徴|画像を簡単に圧縮してサイト表示速度を改善
TinyPNGは、JPEG・PNG・WebPなどの画像を高画質のままワンクリックで圧縮できる便利なツールです。
ファイルサイズを大幅に削減できるため、サイトの表示速度向上やSEO対策に効果的です。
- 手軽に画像を圧縮したい → ウェブ版TinyPNG
- ブログ運営で自動化したい → WordPressプラグイン版TinyPNG
WordPressプラグイン版を使えば、画像をアップロードするたびに自動で圧縮でき、作業効率も大幅にアップします。無料プランでも十分活用できるので、まだ導入していない方はぜひ試してみてください。
どの方法でも、TinyPNGを使えば高画質を維持しながら画像容量を削減でき、ページ表示速度の改善に大きく貢献します。
この記事がお役に立てば嬉しいです。
「最後まで、ご観覧いただきありがとうございました。」
また、次の記事で…お会いしましょう。\^^/



