iPhoneでWebP画像が表示可能になる
Web上で使う画像フォーマットはずっとJPEGが主役といえる状況でしたが、ついに世代交代することになりそうです。
次世代画像フォーマットとして色々なファイル形式がありましたが、iPhoneやiPadもWebPをサポート予定ということでどうやらWebPに決着するんじゃないかと思います。
WebPはすでにWindows、AndroidではChromeやFirefoxでも表示できますが、iOSではGoogle Chromeを使っても表示できないのが現状です。
iOS14のSafariでWebPがサポートされるのでPhotoshopでWebPを出力する準備をする
iOS14の新しいSafariのリリースでその状況が変わるようなので今のうちにWebP画像の出力ができるようにテストしてみました。結果は2015年に発売された古いPhotoshop Elements 14でもWebpの出力は可能でした。
WebPShopのプラグインで対応する
公式のWebM ProjectのWebPShopプラグインをPhotoshopのプラグインフォルダにコピーすることで使えるようになります。
まず、WebPShopプラグインをプロジェクトのページからダウンロードしてきます。今の最新バージョンは0.3.0。Windowsの場合はInstallationの説明のところから.8biなファイルが見つかると思います。
ダウンロードしてきたWebPShop.8biファイルをPhotoshopのプラグインフォルダにコピーします。
C:\Program Files\Adobe\Photoshop\Plug-Ins
バージョンごとに少しずつ違いますが、だいたいこんな場所にあるはず。コピーしたらプラグインのインストールは完了。
WebPShopプラグインの使い方
プラグインでのWebp形式の画像の出力は別名で保存からになります。
そこでファイルの種類でWebPを選択。
WebPShopプラグインの設定で画像のQuality(品質)を調節する機能(Losslessもあります。)や圧縮効率を決めるオプションのほかにメタデータを残す選択もできます。
Keep EXIF、Keep XMP、Keep Color Profileなど。
Keep EXIFでEXIFの撮影データを残したり、Keep XMPをチェックすることでPhotoShopで設定したIPTCの著作権情報を残すこともできます。
PSDファイルから直接WebPに変換できる
PhotoshopのPSDファイルからWebPファイルに変更しようとしたときに選択できるフォーマットとしてWEBPが出てこない。直接変換できない？ということはなく、画像のbit数によるものです。
WebPは8bitのフォーマットなので一眼レフカメラやミラーレスで撮影したRAW画像などの色情報が12bitの写真などは、プラグインで出力する前に8bitに変換しておかないと「別名で保存する」にwebpの選択肢が出てきません。
メニューのイメージ → モード → 8bit/チャンネルで画像を8bitに変換しました。これはPhotoshop Elementsでもできます。
まとめ Web上での実際の利用
今ウェブで使う画像は何がいいのか。圧縮効率が良くて高品質な次世代画像フォーマットと呼ばれる候補がいろいろありましたが、jpegからwebpに移行していくのだろうと思います。
しかし、アップデートが止まっている古いスマートフォンを利用している人も一定数いるので、実際の運用ではこれまで通りJPEGの画像も必要な状況になります。
そうなると移行が進まないのかというと、PageSpeed Insightsで「次世代フォーマットでの画像の配信」が改善できる項目にリストされている状況なので移行できる人は対応するという形で利用が拡大することになるのでしょうか。
WordPressなどでコンテンツ配信している人は待ってれば、ほとんど何もしなくても対応できるようになる気がしています。
これまで通りアップロードする画像はJPEGのままでも、WebPへの対応を迫られるような実際に普及し始める時期には何も設定せずにインストールするだけでWebPの画像を用意してくれる便利なプラグインがでてくるんじゃないかな～
