GIMPで写真をwebp保存したらファイルサイズがJPEGの1/3に軽量化

 WebP(ウェッピー)が軽いらしいと聞いていたので、気にはなっていたのですが試す機会もなく放置していたところ、GIMPで読込保存が可能らしいので早速試してみました。

WebPはGoogle主導の画像フォーマット

 WebP(読み方ウェッピー)は、Googleが主導して進めている画像フォーマット。従来から使われているgif,png,jpgなどと同様の画像を保存する際のファイルの種類。拡張子は、.webpになります。

 2010年9月に発表されていますが、2019年現在ほとんど使われていることはありません。Googleのブラウザであるchrome系はすべて対応していますが、未対応のブラウザが多いのが普及させる上での問題となっています。

 少々話はそれてしまいますが、JPEG2000(ジェイペグ2000)という画像フォーマットもあり、そちらはアップル系勢力が進めている規格。この両者の勢力争いのためかそれぞれの画像フォーマットと未対応ブラウザの問題ができてしまっているわけです。

 このページでは、WebPについて実際にサンプルを作ってファイルサイズや使い勝手を比べてみたいと思います。

GIMP2.10なら読込編集保存が可能

 ウィンドウズのGIMPではできない。Linuxなら可能と思っていたら、GIMPのオフィシャルサイトでhttps://www.gimp.org/news/2018/11/08/gimp-2-10-8-released/  でGIMP2.10.0以降のバージョンですでに対応していると発表されていました。

 GIMP2.10.0以降はすべてwebPをサポートしているとのことなので、最新版の2.10.12にアップデートしてみました。使っていたのがGIMP2.8だったので、機能面の変更が少ないことを祈りながら。インターフェースが変更されてしまうのも勘弁してほしい。

アップデート完了。

GIMP2.10.12を起動して、少し写真を編集してみましたが、前とほぼ使い勝手は同じ。ただダークカラーなのが見づらかったので、編集→設定→ユーザーインターフェース→テーマから白背景に変更。

早速、写真ACさんから適当なサンプル写真をダウンロードして試してみます。一般的に写真によく使われるJPEG、PNGに今回は、WebPの画像を作ってみます。

WebPならPNGの1/4にJPEGの1/3に

 サンプルファイルをいくつか作ってみました。ここでは、表示させるためのタグとしてimgタグを使用しています。iPhoneに標準のSafariではWebP画像は表示されていません。残念ながら未対応です。

画像サンプル1

 比較用に画像サイズも書いてあります。画像ファイルの品質については、JPEG100、PNG9、WebP100と最高品質での画像を作成してあります。

.jpg画像(319KB)

.png画像(1,041KB)

.webp画像(190KB) ※Safariだと表示されません

.jp2 JPEG2000画像(911KB) ※Chrome,Firefoxだと表示されません

画像サンプル2

.jpg画像(1,245KB)

.png画像(1,712KB)

.webp画像(346KB) ※Safariだと表示されません

.jp2 JPEG2000画像(1,378KB) ※Chrome,Firefoxだと表示されません

画像サンプル3

.jpg画像(330KB)

.png画像(482KB)

.webp画像(158KB) ※Safariだと表示されません

.jp2 JPEG2000画像(359KB) ※Chrome,Firefoxだと表示されません

 やはり、PNGは圧倒的にファイルサイズが大きくなります。もともと圧縮率を高くする目的ではないものなので、これは当然。JPEGとWebPの比較がメインとなります。

 ファイルの幅高さは同じ、品質も同じ条件でも圧倒的にWebPが軽量です。画像ファイルの軽量化を目的とするなら、ぜひともWebPを導入したいところですが、上で述べたとおり未対応ブラウザの問題がありますので、見られないユーザーが発生する点に注目する必要があります。

 画像のきれいさ、見え方については、一般的に言われているとおりPNGが一番よく、JPEGはやや劣るという点は、ほぼ同じではないかと思います。問題はファイルサイズのみ。

 最近のGoogleの検索結果では、表示スピードが上位表示される条件にもなっていることから、やはり画像の軽量化は重要なポイント。SEOの観点から見ても、大変注目していることなのですが、ユーザーとの兼ね合いが問題。

Safariブラウザ未対応は致命的

 ここで、WebP画像のブラウザ対応表をご覧ください。参考: https://caniuse.com/#search=webp

 ここでわかるとおり、ブラウザの最新版の中でも対応しているのは、Chrome、Firefox、Operaなどのブラウザ。Edgeは、chrome系になるので、マイクロソフトのIEやアップルのsafari系列のブラウザは対応していません。

 IEはともかく、saferiが未対応なのは痛い。

 ここで、アクセス解析のデータを参考に引っ張ってきます。2019/8/1-27のアクセス解析の結果です。AWSのCloudFrondのViewerデータです。

 アクセスの69%がiOS、Chrome Mobileは16%。IEは4%です。

 これが現状、WebPを導入することができない理由です。69%のユーザーがiOS、単純にiPhoneから標準のSaferiブラウザで見ているわけです。残念ながら、ユーザーの70%近くが見られない画像形式を使うメリットはまったくありません。

 Pictureタグを使用して、JPEGとWebPの画像をブラウザごとに振り分けて表示することも可能ですが、従来のページを編集してまで使えるようにするメリットは今の所感じていません。

結論:WebPは使えません。現段階で使いません。

 サンプルを作ってみて、軽量化という点では魅力があるWebPですが、未対応のブラウザがある点、アクセス解析で見て多数のユーザーが見られない可能性がある点、未対応ブラウザでも見られるようにするには手間がかかる点を考えると、現状では使わないという選択肢が最良だと考えています。

 使えませんと書きましたが、iPhoneからのユーザーが圧倒的に多い現状では、iPhone標準のSafariからのアクセスを最優先に考えるべきで、わざわざSafari未対応の画像フォーマットに移行するメリットはほとんどありません。

 2019年現在、アップル系は未対応のままです。今後もおそらく未対応が続くと思いますので、残念ながらWebPが注目されるのははるか先の話になると思います。

このページでは、参考用にjp2形式のファイルも作成してみました。 JPEG2000変換サイト https://convertio.co/ja/

■更新履歴
2019/8/27 記事を公開しました。

↑ページの上へ戻る