[PR] 大手アパレルECサイトが導入する月額1万円〜ファイル数無制限の画像軽量化ツール「LightFile」

「他のところでは使っているらしいですよ?」JPEG2000の利用について相談されたので、使われていない理由をいろいろ調べてみた。

他の人が利用していると気になってしまうのが人というもの。今回は「○○さんのECサイトではJPEG2000を利用しているらしいので、JPEG2000は利用できないですか?」という質問をいただいたので、いろいろ調べてみました。

JPEG2000はWebでの利用に適さない

結論からすると、ECサイトでJPEG2000を利用することは現実的ではありません。理由は以下のとおりです。

  1. 対応ブラウザがほぼない。Apple Safariのみ。
  2. 再生するのにパワーがかかる(処理が重い)

対応ブラウザがほぼないので、ECサイトにおいて採用メリットがない

Macでは標準で開けるのですが、他のOSでは標準対応していません。また、MacでもChromeなどのApple製ではないアプリでは開くことができません。JPEG2000は、2000年頃より規格されているフォーマットですが、2018年の現在でも対応ブラウザが少なく、導入のメリットは開発コストに見合わないと言えます。

再生するのにパワーがかかる

JPEG2000は、JPEGよりも高性能で、豊かな表現力を持っています。JPEGに不足している(するであろう)機能詰め込んだてんこ盛りなJPEGなのです。表現性能という面では、申し分がないのです。しかし、その性能を発揮するのにJPEGよりも多くの多くのパワーを必要とします。ECサイトのように画像が多いサイトで、一つの画像の処理時間が増えてしまっては、その結果、高速表示ができなくなってしまいます。

表示高速化するならJPEGかWebPにする

2018-06-05-jpeg2000-01.jpg今回の比較に利用した画像。ECアパレルを意識して赤いゾウさんがポイントのバッグの写真

同じ画像を、それぞれ最高画質で書き出したときのファイルサイズを調べてみました。

ファイル種類ファイルサイズJPGとのファイルサイズ
JPEG(基準) 894.0KB -
LightFile処理後JPEG標準画質 267.3KB -626.7KB
LightFile処理後JPEG画質優先 267.3KB -626.7KB
LightFile処理後JPEG容量優先 145.5KB -748.5KB
JPEG2000 1200.0KB +306.0KB
PNG 1500.0KB +606.0KB
WebP 115.1KB -778.9KB

JPEG2000とPNGは、基準とするJPEGファイルよりもファイルサイズが増えてしまいます。WebPは、弊社のLightFileの容量優先処理と同じくらいの削減量になります。

WebPの課題は対応ブラウザ

JPEG2000でも対応ブラウザの少なさが課題となっていますが、WebPも同じことが言えます。WebPに対応しているブラウザは現時点では以下のとおりです(2018年6月5日)。

  1. Google Chrome (desktop)
  2. Google Chrome for Android
  3. Opera
  4. Native web browser, Android

JPEG2000はMacが対応していたのに対し、WebPではMacが対応していません。iOSのiPhoneも未対応です。WebPを利用する場合は、UserAgentで分岐をして表示するなどの対応が必要にあります。

詳しい対応ブラウザは、以下をご覧ください。

画像が最適化できているかは、無料のLightFile Similatorでチェックしよう

弊社では無料で利用できるチェックツールを提供しています。画像は、比較しないと画質やファイルサイズが適切なのかどうかが判断できません。また、画質とファイルサイズの適切なバランスは、機械的に処理するほうが確実です。ぜひツールを使って、自動化しちゃいましょう。

2018-05-31-webpage-inside-05.jpgURL・メールアドレスを入力して、「シミュレーション開始」ボタンをクリックするだけなのでかんたん。

LightFile Simulator β版

LightFile Simulator β版

無料で使える画像最適化チェックシミュレータ。チェック結果がレポートになるので、URLを共有すればみんなでみれる。

最後に

画像と一言で言っても、さまざまな種類があり、それらの特性もさまざまです。2001年頃のGIFの特許問題で、一躍採用が広がったPNGについても、JPGよりもファイルサイズが大きいとは知られていないケースがあります。画像の内容にあった正しいファイルの種類を選ぶことで、不要なファイルサイズを削減することができます。

前へ

Amazonギフト券があたる!今週末開催のMTDDC Meetup HOKKAIDO 2018 アイデアマンズのブースで、「【問】軽量化するまえの きれいな元画像はどれ?」クイズにチャレンジしよう!

次へ

2018年6月9日「MTDDC MEETUP HOKKAIDO 2018」登壇&ブース出展のお知らせ