「ウェブサイトに掲載する画像を圧縮したい！」
「画像ファイルが重くてサイトスピードが遅い...」
ウェブサイトの読み込みファイルの中で、画像ファイルはかなりの割合を占めています。
そのため画像ファイルを小さくする処理をしていないとサイトスピードが遅くなることがあります。
そこで今回は「TinyPNG」というサイトを使ってカンタンに画像サイズを小さくする方法をご紹介します！
TinyPNGは無料で利用できますのでみなさんもぜひ使ってみてください！
今回のテーマ
- TinyPNGとは
- TinyPNGの使い方
当サイトではプログラミングやWebサイト運営に関する記事を毎日投稿しています。
他の記事も合わせて読んでいただけると嬉しいです。
TinyPNGとは
TinyPNGとはjpgやpng形式の画像を圧縮して軽量化してくれるサービスです。
サービス名には「png」とありますが、拡張子がjpg形式でも圧縮できます。
画像の圧縮とは人間の目では気づかない程度に画質を落とすことでファイルサイズを小さくすることをいいます。
私は普段からTinyPNGを使用しているのですが、体感で大体60%~70%ほど小さく出来ます。
サイトスピードを高速化させたい方、サイトのユーザービリティを向上させたい方には必須のサービスと言えます。
合わせて読みたい
-
サイトスピードを改善・高速化する７つの方法を徹底解説
ウェブサイト運営やSEO対策の関係者の皆さん、サイトスピードの高速化は出来ていますか？ サイトスピードはサイトのユーザービリティを大きく左右する重要な項目です。 私はインターン先のウェブ広告会社で、1 ...
続きを見る
TinyPNGはもともとウェブサイトで利用できるサービスですが、「Compress JPEG & PNG images」というWordPressプラグインとしても利用できます。
詳しくはこちらの記事をご覧ください。
-
Compress JPEG & PNG imagesの使い方【画像圧縮のWordPressプラグイン】
WordPressブログの画像をまとめて圧縮したい！なにか良いプラグインは無いかな？ Compress JPEG & PNG imagesというプラグインの設定方法や使い方を教えて欲しい！ 今 ...
続きを見る
TinyPNGの使い方
それでは早速TinyPNGの使い方について解説していきます。
操作自体は超カンタンです！
TinyPNGの圧縮手順
- TinyPNGにアクセス
- 画像をドロップ（20枚まで）
- 圧縮画像をダウンロード
step
1TinyPNGにアクセス
まずはTinyPNGにアクセスしてみましょう。
上のような画面が表示されるはずです。
TinyPNGは「パンダ」とも言われており、サイトの至る所にパンダのイラストが使われています。
なんだか可愛いですね！
step
2画像をドロップ
画面中央に「 Drop your .png or .jpg files here!」と書かれたボックスがあると思います。
ここに圧縮したい画像をドラッグ・アンド・ドロップすることで圧縮処理を行えます。
試しに何枚かドラッグ・アンド・ドロップしてみましょう。
するとこのようにファイル名、サイズ、圧縮後のサイズ、圧縮率などが一覧で表示されます。
どの画像も大体60％〜70％圧縮できていることが分かります。
画像見ると分かるように、5MB以上の画像ファイルは圧縮できませんので注意してください。
注意ポイント
画像は1度に20枚までしか圧縮できません。
20枚以上の画像を圧縮したい方は何回かに分けてダウンロードしましょう。
step
3圧縮画像をダウンロード
では早速圧縮された画像をダウンロードしていきましょう。
TinyPNGでは
１つ１つ個別にダウンロードする方法・・・①
複数の画像をまとめてダウンロードする方法・・・②
※zipファイルでダウンロードされます。
ドロップボックスに一括保存する方法・・・③
の３つの方法で保存できます。
それぞれお好みに合わせて保存しましょう。
以上で画像圧縮の操作は完了です！！
このようにTinyPNGはあっという間に画像圧縮ができる超便利サービスです。
みなさんもぜひ使ってみてください！
実際にTinyPNGを使用した人の声
最後に、実際にTInyPNGを使用した人の声を見てみましょう。
長く利用しているサービスは無駄なくシンプル。
TinyPNGは画像の圧縮に特化したサービス。「圧縮ならあのサービス」と認識し継続して利用しやすい。多機能が良いとは限りませんね。https://t.co/c4gdYpOTHC— 小林 | Webクリエイター (@pulpxstyle) August 7, 2020
WEBサイトを作るとき、画像を70%くらい軽くする方法。
・TinyPNG - pngを圧縮するサイト
・TinyJPG - jpgを圧縮するサイトこれらを使うと、大体70%前後、画像が軽くなるので、サイトの軽量化に役立ちます。
サイト重いなー、画像読み込み時間かかるなー、と思ったら、ぜひ試してみてください。
— しょーた@新規事業専門 ✕ 個人開発 × WEB/UI/UXデザイナー (@shota_ueyama) December 29, 2019
先日教えていただいた「tinyPNG」って画像圧縮サイト、「どこ変わったの？」ってくらい劣化しないくせにめちゃくちゃ圧縮しやがりますね……。スゴい。なおJPGもOK。ティラノビルダーでも重宝しそうφ(・ω・ ) https://t.co/RSNoF7NDtJ
— hoshimi12（ほしみ） (@hoshimi12) July 28, 2018
【TinyPNG】https://t.co/ewKOQHw4lp
容量かなり落としてくれるのにあまり劣化しないのでおすすめ～ここにファイルをぶっこむだけで軽くしてくれるので、PNGの画質あまり下げたくないけど容量軽くしたいってときにおすすめ（つまりツイッター向け）— こん (@contaro_) August 31, 2015
TinyPNGはシンプルで使い勝手が良い上に、圧縮のクオリティも高いため、多くの人たちに愛用されていることが分かりますね。
まとめ：TinyPNGでサイトスピードを高速化しよう！
まとめ
- TinyPNGは画像圧縮ができる無料サービス
- TinyPNGを使ってサイトスピードを高速化しよう！
今回は無料の画像圧縮サービス「TinyPNG」の使い方について解説しました。
サイトスピードはSEOにも欠かせない重要項目です。
「TinyPNG」を使ってあなたのサイトをもっと良くしていきましょう！
わからない部分がある方はお問合せフォームで質問して貰えばすぐに返信します。
今サイトではこれからもウェブサイト運営に関する有益な情報をたくさん発信していきたいと思っていますので応援よろしくお願いします！
