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をPhotoshopで読み込み・書き出しするには

Photoshopは標準ではWebp形式の読み込み、保存ができませんが、「WebPShop」というGoogle公式のプラグインをダウンロードすることでPhotoshopでもWebP形式の画像を読み込み・書き出しすることができるようになります。バッチ処理などで複数の画像を変換することも容易になります。

WebPShopプラグインのダウンロード

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

WebPShopのダウンロード

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

WebPShopプラグインのインストール

ダウンロードした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/アプリケーション/Abobe Photoshop (バージョン)/Plug-ins
  3. にWebPShop.pluginを移動させます。
  4. Photoshopを開いている場合は終了させます。
  5. Photoshopを開きます。

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

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

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

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

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

PhotoshopでのWebP形式の書き出し

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

PhotoshopでのWebP形式の保存

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

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

WebPShopの設定画面

WebPShopの説明は以上になります。

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

画像アプリケーション
「画像アプリケーション」の記事一覧です。

 

 

この記事が気に入ったら
いいね!しよう

最新情報をお届けします

Twitter でPhotoshop Bookをフォローしよう!

コメント

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