次世代画像フォーマット「WebP」が本当にブラウザで表示出来るのか確認するサイトを作ってみた

“Apple iPhone”で閲覧するお客様の割合は、弊社が運営している別のウェブサイトでは「59%」となっている。

アクセスしてくるお客様の約半分がスマホのiPhoneを使ってる事になる。

次世代画像フォーマットの「WebP」は、これまでiPhoneに非対応だったのだが、2020年秋に公開される「iOS 14」では、ついにiPhoneでも「WebP」に対応する。

これまで画像はJPEG形式かPNG形式でウェブサイトに掲載するのが主流だったが、ブラウザが「WebP」に順次対応して行き、iPhoneでも「WebP」に対応するとなると、ほとんどのブラウザで「WebP」に対応し、ウェブサイトの表示が遅いという問題が緩和される。

これまでよりも少ないデータ容量でアクセス出来るようにもなる。

しかし、スマホのブラウザで本当に「WebP」に対応しているのか簡単に確認する手段は無く、パソコンではChromeのデベロッパーツールを使うケースで判別が出来るが、スマホで簡単に「WebP」画像が表示されるか確認するウェブサイトを作ってみた。

↓↓↓↓↓↓↓↓↓↓↓↓↓↓

上記のURLを開き、画像をクリックすると「この画像はWebP画像です」と表示されたら“WebPに対応”と簡単にわかる仕様です。

WebPに対応していないブラウザ、例えばInternet Explorerで開くと「この画像はJPEGです」と表示されるJPEG画像が開きます。

肝心の「iOS 14」パブリック・ベータ版のSafariで表示させた場合はどうなるのか実際に確かめてみて欲しい。

※パブリック・ベータ版をインストールした場合はSafariやChromeなどのブラウザのキャッシュをクリアして確認してください(キャッシュが残っていると古いデータを参照してJPEGファイルの方が表示される場合が有ります)。

タイトルとURLをコピーしました