JPEG 2000、JPEG XR、WebPで画像圧縮できるの?

JPEG 2000、JPEG XR、WebPで画像圧縮できるの?

jpegのイメージ画像

 

「こいつは使える奴か?」

 

 

google search consoleで画像圧縮によるページスピード向上の提案があり、ちょっと調べてみようと思われた方も多いはず。でも、現状webサイトでの利用は難しそうですね。

 

 

jpeg 2000、JPEG XR、WebPをよく理解するための もくじ

 

 

○PageSpeed Insightsで気になる「JPEG 2000、JPEG XR、WebP」とは?

 

  ・画像データの機能向上を狙った新規格
  ・webブラウザが、対応していない規格がある
  ・画像圧縮できても、ファイル立ち上げに時間がかかる

 

○JPEG 2000、JPEG XR、WebPの画像ファイルはどうやって作るのか?

 

  ・実際に画像を作ってみた。作り方をご紹介します
  ・まずは、かんたんな「JPEG 2000」の作り方
  ・次は、「WebP」を作ってみました
  ・意外と作るのに苦労した「JPEG XR」

 

 

 

 

PageSpeed Insightsで気になる「JPEG 2000・・」とは?

 

 

Google search consoleで、ページスピードを改善しようと
頑張っていると、下のような案内が出て「何っ??」って思った方も
多いはず。

 

↓↓この画面!

 

 

google search-consoleのPageSpeed Insightsの画面

 

 

Googleからの「次世代画像フォーマットを利用して画像サイズを
小さくしよう」という提案です。

 

でも、「早速使ってみよう!」と動き始めると、なんだか様子がおかしい。

 

次世代画像フォーマットを使うと、画像がwebサイトに表示できないとか・・??

 

 

画像データの機能向上を狙った新規格

 

 

実はかなり前から画像データの機能向上については規格があったようで、
医療用など特定分野では新規格の画像が使われています。

 

ウィキペディア(Wikipedia)で確認してみたら、技術的には
10年くらい前から確立されているようです。

 

それぞれ拡張子の特徴につき比較表がありましたので、
抜粋してみました。

 

 

jpeg2000,webp,jpegxrの比較表

※『ウィキペディア(Wikipedia)』 JPEG XR より抜粋

 

 

ネット用の画像として普及していない理由は主に、

 

○webブラウザが、対応していない規格がある
○画像圧縮できても、ファイル立ち上げに時間がかかる

 

という理由があるようです。

 

 

webブラウザが、対応していない規格がある

 

 

JPEG 2000とJPEG XR、WebPはそれぞれ開発者が異なります

 

JPEG 2000はISOITUの共同組織、JPEG XRはMicrosoft
WebPはGoogleです。

 

ですので、対応しているwebブラウザもバラバラ。
これらの画像拡張子でwebサイトを表示すると、画像が表示されないものが
出てきます。繰り返しになりますが・・対応するwebブラウザは

 

○JPEG 2000・・・ Safari が標準対応
○JPEG XR・・・Internet Explorer (9以降) が標準対応
○WebP・・・Google Chrome, Opera が標準対応

 

となります。

 

webブラウザのシェアは、Google Chromeのシェアが
高いですが、さまざまなwebブラウザが使われています。

 

 

<2019年12月現在の、日本におけるwebブラウザマーケットシェア>

Chrome 47.24%
Safari 30.75%
IE 7.43%
Edge 5.56%
Firefox 5.47%
Samsung Internet 1.1%

statcounter.com webブラウザ 日本のマーケットシェアより引用

 

 

これだけシェアが割れていたら新画像規格は使えないですよね。

 

 

画像圧縮できても、ファイル立ち上げに時間がかかる

 

 

新画像規格により、画像圧縮はできますが、逆に処理に時間がかかり
画像表示に手間取るようです。

 

ただし、医療用画像などの特定分野では、高機能画像規格のメリットが
優先し、JPEG 2000の規格が使われています。

 

 

 

 

JPEG 2000、JPEG XR、WebPの画像ファイルはどうやって作るのか?

 

 

実際に画像を作って表示してみた!

 

 

 

まずは、かんたんな「JPEG 2000」の作り方

 

 

私がいつも画像処理に使っている「JTrim」でJPEG 2000の
画像を作ることができます。

 

jtrimのショートカット画像

 

  無料ダウンロードはこちらから→ Vector ソフトを探す!

 

 

とにかく軽くて、すぐに立ち上がりますので、
「ファイルが開くまで待つ」というストレスはほとんどない無料ソフトです。

 

私の画像加工は、そんなに複雑なことまでしていませんので、
使う機能はほぼ限られていて、この軽さが非常に快適で使い
心地よく感じます

 

JTrimを開いて、画像ファイルを開きます。
ここでは、あらかじめ準備した京都の写真を使いました。

 

「拡張子.jpg」の、この写真を使いました↓↓
jpegの画像サンプル

 

 

保存するファイルの種類を「JPEG 2000」にして保存するだけで
JPEG 2000の画像が作れます。

 

 

jpeg2000の保存をする画像

 

 

「JPEG 2000」で作成した画像がこちら↓↓

 

jpeg2000の画像サンプル。お使いのwebブラウザでは表示できません

 

 

私はGoogle Chromeを使っていますので、残念ながら
表示することができませんでした。

 

 

次は、WebPを作ってみました

 

 

WebPはこの変換ツールを使って作成しました→ webp変換ツール

 

CYNCERの変換画面

 

 

いつでも無料で変換させていただける、良心的なサイトです。

 

操作方法もカンタン。
「ファイルを選択」して、「開く」だけで作成できます

 

 

CYNCERの変換画面

 

               ↓↓↓

 

CYNCERの変換画面

 

 

 

「WebP」で作成した画像がこちら↓↓

 

webpの画像サンプル。お使いのwebブラウザでは表示できません

 

 

 

 

意外と作るのに苦労した「JPEG XR」

 

 

最後に「JPEG XR」で画像を作成してみました。
意外と無料で使えるソフトがなくて、paint.netさんの
無料の試用期間が30日ありましたので、無料お試しで作成です。

 

 

paint.netのインストール画面(microsoft store)

 

 

これもファイルを開いて、「JPEG XR」で保存するだけで、
かんたんに作成できました。

 

 

jpegxrの保存をする画像

 

 

「JPEG XR」で作成した画像がこちら↓↓

 

jpegxrの画像サンプル。お使いのwebブラウザでは表示できません

 

 

 

 

 

 

 

 

よく読まれる関連ページ

もっと早く導入すればよかった。画像圧縮ソフトによるサイト高速化

もっと早く導入すればよかった。画像圧縮ソフトによるサイト高速化

10分でできる!バナーの貼りつけ

10分でできる!バナーの貼りつけ

目障りな広告はイヤ!・・に対する対策はどうする?

目障りな広告はイヤ!・・に対する対策はどうする?

バナープラスは直感的に使えて、高級感を感じる使い心地です!

バナープラスは直感的に使えて、高級感を感じる使い心地です!

 

 


Top相互リンクをいただいているサイトです。

簡単無料ホームページ

簡単に無料でホームページ作成。掲示板、ブログ、アルバム、携帯サイト、メールマガジン、お問合せフォーム、リンク集等の便利機能付き。商用利用もOKです

 
トップページ 目次 サイト公開までのプロセス プロフィール お問い合わせ