Photoshop初心者におすすめの本タイプ別10冊

PhotoshopでWebPを開く・保存するWebPShopプラグイン

Photoshop2021でWebPを開く・保存するWebPShop 画像アプリケーション

<景品表示法に基づく表記>本サイトのコンテンツにはプロモーションが含まれる場合があります。

スポンサーリンク






WebPとは、メリット・デメリット

まずはWebP形式の説明から。WebPはGoogleが開発しているウェブ用の画像形式で、jpeg・gif・pngに変わるものとして意図されて作られています。読み方は「ウェッピー」です。

Googleはサイトの読み込みスピードを計るPageSpeed InsightsでWebP画像の使用を推奨しています。

同程度の画質のときでも jpeg・gif・png 形式に比べてファイルサイズが軽くなるのがメリットです。

デメリットは古いブラウザ環境だと表示できないことです。

WebPの各ブラウザの対応状況

WebPの表示できるブラウザはこちらです。Chromeだと問題ないのですが、Mac・iOSだと古い機種では表示できないこともあります。

  • Chrome(2014年1月以降)
  • Firefox(2019年1月以降)
  • Safari/Mac(2020年9月Big Sur以降)
  • Safari/iOS(2020年9月iOS14以降)
webp対応ブラウザ
caniuse.comより

WebPをPhotoshopで読み込み・書き出しするには

Photoshop2022のアップデートでWebPShopプラグインなしでもWebP形式を開いたり、保存したりできるようになりました。ただ私は使い勝手はWebPShopプラグインを使った方がいいと思います。

Photoshop標準環境だとWebP形式を保存するときに、保存後の画質劣化やファイルサイズを見ながら書き出すことができません。

「WebPShop」というGoogle公式のプラグインをダウンロードすることで、ファイルサイズ等を確認しながら効率的にWebP形式を書き出すことができます。

Photoshop2022のWebP形式のアップデートについての詳細は以下の記事からご覧ください。
https://photoshopbook.com/2022/02/21/photoshop2022-webp/

WebPShop Pluginのダウンロード Windows/Mac両対応

WebPShopはこちらから無料でダウンロードすることができます。

WebPShopのダウンロード

MacはWebPShoop_0_4_0_Mac_Universal.zip、WindowsはWebPShop_0_4_0_Win_x64.8biをダウンロードします。

WebPShop Pluginのインストール

ダウンロードしたWebPShopプラグイン

Windowsの場合

  1. ダウンロードした「WebPShop_0_4_0_Win_x64.8bi
  2. c:\Programfiles\Adobe\Adobe Photoshop(バージョン)\Plug-ins
  3. に移動させます。
  4. Photoshopを開いている場合は終了させます。
  5. Photoshopを開きます。
WebPShopプラグインのインストール
「対象フォルダへのアクセスは拒否されました」と表示された場合は続行をクリック

Macの場合

  1. ダウンロードした「WebPShop_0_4_0_Mac_Universal.zipを展開(ダブルクリックで展開)すると「WebPShop.plugin」が現れます。
  2. Macintosh HD/アプリケーション/Adobe Photoshop (バージョン)/Plug-ins
  3. にWebPShop.pluginを移動させます。
  4. Photoshopを開いている場合は終了させます。
  5. Photoshopを開きます。

WebP形式を開いたり保存するときに、

”WebPShop.plugin”が悪質なソフトウェアかどうかをAppleでは確認できないため、このソフトウェアは開けません。

というエラーが表示される場合はいったんOKでウィンドウを閉じて、Appleメニューの「システム環境設定」から「セキュリティとプライバシー」を開きます。

ウィンドウの左下に「変更するにはカギをクリックします。」と書かれている場合は鍵アイコンをクリックして、Macのログイン時に入力するユーザーパスワードを入力してください。書かれていない場合は次へ。

「一般」タブの一番下に「”WebPShop.plugin”は開発元を確認できないため、使用がブロックされました。」とある場合は、その右の「このまま許可」をクリックします。

WebPShop Pluginを使ったPhotoshopでのWebP形式の書き出し

ファイル」メニューから「コピーを保存」を選んで、「ファイルの種類」から「WebPShop」を選べばOKです。

PhotoshopでのWebP形式の保存

WebPShopの設定ウインドウが出ます。基本的には以下のプレビューを表示してQualityの数値を上下させつつ、Preview横のファイルサイズを見ておけば大丈夫です。

「Compression」で圧縮方法が変えられますが、ファイルサイズを見ながら設定すればいいと思います。試してみたところ、「Fastest」が一番軽く、「Slowest」が一番重いとは限りませんでした。

WebPShopの設定画面

Webpshopが0.4.0にアップデートし16bit・32bit/チャンネルに対応

PhotoshopでWebP形式を扱うプラグインWebpshopが0.4.0にアップデートし、WebP規格1.2.1と16bit/チャンネル32bit/チャンネルに対応しました。

まとめ

WebPShopはGoogleが推奨している新世代の画像フォーマットです。

Photoshop2022でも標準でWebP形式の書き出しができるようになりましたが、書き出し後の画質の確認や、ファイルサイズの確認ができるという点で2022年8月現在の時点ではWebPShopの方が優れていると思います。

画像アプリケーションについての情報はこちらのページにまとめています。
ぜひご覧ください。

画像アプリケーション
画像を取り扱うアプリケーションの情報をお知らせします。
この記事を書いた人

Photoshopと画像・動画アプリケーション情報を発信。
美術大学時代に絵画を専攻。独学でPhotoshopを学び、レタッチカンパニー数社を経て現在はCG・動画アーティスト。Adobe Japan Prerelease Adviser。
Mdn「デザインのネタ帳 プロ並みに使える写真加工 Photoshop」共著。

SNSやRSSでPhotoshop Bookをフォロー
画像アプリケーション

この記事が役に立ったら
いいね!をお願いします
最新情報をお届けします。
この記事をSNSでシェア
SNSやRSSでPhotoshop Bookをフォロー
スポンサーリンク

コメント