おしブロ from STONEWEB

おしい県でWebに携わって働く人のブログ from ストーンウェブ。IT&Web界隈に関する役に立ちそうなことをまとめていきます。2013年1月運営開始。

移転しました。

約3秒後に自動的にリダイレクトします。

できる限り画質を劣化させることなく画像のファイルサイズを圧縮してくれるWebサービス2つ

f:id:lord_cashew:20140218151856j:plain

サイトの表示速度を向上させる一番簡単な方法は「サイトに使用している画像のファイルサイズを軽くすることだ」と思ったので、できる限り画像を劣化させることなくファイルサイズを圧縮してくれるWebサービスを探してみました。

 

1. TinyPNG

f:id:lord_cashew:20140423054452p:plain

TinyPNG – Compress PNG images while preserving transparency

PNG画像を圧縮してくれるWebサービスです。とても有名なサービスみたいです。

 

(使い方)

画像を「Drop your .png files here」の枠内にドラッグ&ドロップします。

f:id:lord_cashew:20140423055349p:plain

画像の圧縮を行ってくれます。少し時間がかかるので静かに待ちましょう。

f:id:lord_cashew:20140423055511p:plain

パンダが手を挙げたら圧縮が完了です。圧縮した画像は「download」をクリックすると保存できます。ちなみに今回サンプルとして使用した画像のファイルサイズは「63%」圧縮することができました。

 

2. Compress PNG Images Online

f:id:lord_cashew:20140423060055p:plain

Compress PNG Images Online

PNG画像だけでなくJPG、GIF、BMP画像を圧縮してくれるWebサービスです。ちなみに出力はPNGのみになります。

 

(使い方)

画像を「Drop your files here」の枠内にドラッグ&ドロップします。

f:id:lord_cashew:20140423061110j:plain

「UPLOAD QUEUE」ボタンをクリックすると画像がアップロードされます。

f:id:lord_cashew:20140423061203j:plain

f:id:lord_cashew:20140423061209j:plain

アップロードされた画像をクリックすると「圧縮画面」になります。

f:id:lord_cashew:20140423061239j:plain

画像右のスライダーを操作して「利用する色数」を減らすとファイルサイズが減っていきます。

f:id:lord_cashew:20140423061440j:plain

利用する色数を決めて「COMPRESS」ボタンをクリックすると、画像の圧縮がスタートします。圧縮が完了すると、圧縮した画像ファイルダウンロードのウィンドウが開きます。

 

 

他にもいくつかのサイトを見つけたのですが、登録が必要だったり、無料だと回数制限があったりで、最終的に「2つ」になってしまいました。

サイトの表示速度は「SEO」にも関連しているという話しもありますので、上のWebサービスを活用して画像を圧縮してからアップロードするようにしましょう。

 

© STONEWEB