1. トップ
  2. コラム一覧
  3. 画像圧縮に便利なサイト比較

画像圧縮に便利なサイト比較

投稿日 : 2017.02.07  |  カテゴリー : IT雑記

電話回線でネットサーフィンしていた時を思い出しました。
ネット上にある画像を全部表示するのに1分もかかっていたこと、
電話が来る度にネット回線が切断されていたこと。
今思い返すとなかなかに不便なネット環境だったことをしみじみと思い出します。

光回線が一般的となり、大容量の通信もなんなくこなせるようになってきました。
今では下り50Mbpsなんてのも当たり前で、巨大なファイルもほぼストレスなく
ネット上でやり取出来る事に、今更ながら感動しています。

大容量通信が当たり前になると同時にウェブサイトに配置されている画像1つ1つの大きさなど
気にしなくなる傾向にあるとは思いますがサイトを早くロードする為にもやはり全体容量は少ないに越したことはありません。

今回はウェブ制作時によくお世話になる画像容量を圧縮できるウェブサイトを集めてみました。

比較したのは下の画像。
SCRATCHコース授業中、弊社の江場講師です。

jpg形式とpng形式の2枚を最高画質で保存しました。
jpg → 元画像 376kb
png → 元画像 725kb
どちらも 横900px / 縦565px です。

それでは各サイトで圧縮率を比較してみましょう。


tinypng

tynypng

376kb → 138kb 63% saved

jpg

725kb → 208kb 71% saved

png

Compress JPEG Images Online

Compress JPEG Images Online

376kb → 105kb 62% saved

jpg

JPEGmini

JPEGmini

376kb → 153kb 60% saved

jpg

Kraken.io

Kraken.io

376kb → 140kb 63% saved

jpg

496kb 32%

png

GifgOfSpeed JPEG Compressor & Resizer

GifgOfSpeed JPEG Compressor & Resizer

376kb → 101kb 73% saved

jpg

IMGonline

IMGonline

376kb → 89kb 76% saved

jpg

725kb → 89kb 88% saved

png

Compress.PHOTOS

Compress.PHOTOS

376kb → 76kb 80% saved

jpg

725kb → 77kb 89% saved

png


多くのサイトでおよそ60〜80%もの圧縮ができています。
元画像の画質やサイズなどで圧縮率は変わるでしょうが、少しでも容量を減らすことができれば御の字ですね。

ウェブサイトの表示を速くする為にはこのような小さなことの積み重ねが大事になってきます。
面倒くさがらずにコツコツと対応を進めていきましょう!

この記事を共有する
  • facebookでシェアする
  • ツイッターでつぶやく
  • LINEで送る
関連記事
tablet

渋谷区 区内の小中学校全生徒・教職員にタブレット 2017年9月より導入

渋谷区 区内の小中学校全生徒、教職員にタブレット 渋谷区は授業や家庭での学習を目的に、17年度予算案に7億8200万円計上し、研修等を経て2017年9月より、渋谷区小中学校の児童生徒約8000人並びに教職員約600人にタブレット端 ...

医療のICT化

ICT化の背景  超高齢社会に突入した日本においては、社会保障費の増大や生産年齢人口の減少等、様々な課題に直面しています。 そんな中、政府の健康・医療戦略(平成26年7月22日閣議決定)において「世界最先端の医療の実現のため ...

オンライン画像編集サービス「Pixlr」が凄い!

ウェブ制作において欠かす事のできない写真や画像。 自分で撮影した写真やフリー素材を使う事が多いと思いますがその画像をちょっと加工して自サイトらしさを出したいという事はよくあります。 画像の縦横比やサイズを変えたり、コントラス ...

画像の一部だけが動く?!不思議な写真シネマグラフ

先週消えつつある技術としてFLASHの記事を書きました。 ウェブ上でアニメーションコンテンツを見せる為の代表的な技術でしたが、残念ながら時代の流れと共に利用者が少なくなりつつあります。 しかしアニメーションなど動きのあるリッ ...

ウェブサイトの仕組みを知る! html編 其の2

[ウェブサイトの仕組みを知る!] html編 其の1 : ウェブサイトの仕組みを知る! html編 其の1 css編 其の1 : ウェブサイトの仕組みを知る! css編 其の1 htmlとは、以前述べたとおり、we ...

Twiiterがルールを変更

今回は日本でも最近事件になった。Twitterのルールが変更になったことについて書かせていただきます。 Twitterのルールが変更に アメリカのTwitterは11月3日、サービスルールを変更し、自殺や自傷行為の助長などは明確に違反事 ...

ウェブサイトの仕組みを知る! css編 其の1

ウェブサイトの仕組みを知る! html編 其の1ウェブサイトの仕組みを知る! html編 其の1 の続きです。 cssの役割 htmlとはなにか、をザックリと説明したところで、よりhtmlへの理解を深めていただくために説明しなく ...

AIによって増える仕事・残る仕事

最近AI・人工知能によって無くなってしまう仕事の話をよく耳にします。 なので今回は、AI・人工知能によって増える仕事、残る仕事の話をしたいと思います。 増える仕事 ・ロボット・アドバイザー ・単純化するエキスパート ・輸送アナリス ...

キュレーションメディアの現状と今後

ここ最近、一部のキュレーションサービスにおいて、不適切な記事が多数掲載されていたとして全記事が非公開となる事態が発生しております。 そもそもキュレーションメディアってなに? キュレーションメディアとは、個人の情報発信をデータベー ...

Apple「ガチャの排出率表記」を義務化。アタリ出現率1%のガチャを100回引くと?

App Store審査ガイドラインに追加 2017年12月、英語版のApp Store審査ガイドラインに「ガチャの排出率表記」を義務化を表すものが追加されました。日本語訳するとこうです。 「ルートボックスやその他、ランダム型の有料ア ...

Knocknote Education(ノックノートエドゥケーション)