Photoshopで.webpを使用したり変換したい時の解決法

要求された操作を完了できません。ドキュメントの種類が適切ではありませんと言われて、Photoshopで開けない画像がある。

いつからか、ネット検索で見つけた画像をダウンロードすると、拡張子が「.jpgや「.gif」「.png」ではなく「.webp」という事が増えてきた気が…

画像データといえばPhotoshopと思って、「.webp」の画像を開こうとしても「要求された操作を完了できません。ドキュメントの種類が適切ではありません。」と、ウインドウが立ち上がって開けない。

どして!?

そんな「.webp」の変換や加工にお困りの方の為に、Photoshopで加工する方法を調べて、以下にまとめてみました。

そもそも「.webp」って何なの？を簡単に説明

WebPは、米Googleが開発しているオープンな静止画像フォーマット。
ファイルの拡張子は「webp」。2010年9月30日に仕様が公表され、各種ツールと共に提供が開始された。
ウェブサイトのトラフィック量軽減と表示速度短縮を目的としており、インターネットのWebページで広く使われている非可逆圧縮のJPEGや可逆圧縮のGIF、PNGの置き換えを意図する規格である。
JPEGとは異なり、非可逆圧縮でもアルファチャンネルを扱える。
Googleの示した事例では、ファイルサイズは非可逆圧縮モードで（同一画像、同等画質の）JPEGと比較して25-34%小さくなり、可逆圧縮モードでPNGと比較して28%小さくなるとしている。また22%のファイルサイズ増加でアルファチャネルを追加できるとしている。
引用元：WebP – Wikipedia

簡単に言えば、PNGのような透明（アルファチャンネル）や、GIFのようなアニメーションが使用できる画像フォーマットで、画像サイズが他の形式と比べて約30%小さくなって、とっても便利。

画像形式	透明	アニメーション
WEBP	〇	〇
JPEG	×	×
GIF	△	〇
PNG	〇	×

WEBPをPhotoshopで開いたり保存したりする方法

専用プラグインをダウンロード

WEBPは、PhotoshopにGoogle公式のプラグイン「Webpshop」を入れることで、使用する事ができるようになります。

フォトショップだけにウェッピーショップです！←言いづら

言いづらいのでウェピショップで！←どのみち言いづら

で、そのWebpshopの設定は、実に簡単！

まずは、プラグインを以下のページよりダウンロードしてください。

https://github.com/webmproject/WebPShop/releases

Windowsの場合

上記を参考に「WebPShop_0_3_3_Win_x64.8bi」をダウンロード。

Photoshopを終了。

Photoshopのプラグインフォルダを探す。

Cドライブ > Program Files > Adobe > Adobe Photoshop > Plug-ins

の順で開いた「Plug-ins」という名前のフォルダがプラグインフォルダです。

その中に、先ほどダウンロードした「WebPShop_0_3_3_Win_x64.8bi」ファイルを、そのまま入れてください。

もし「対象フォルダへのアクセスは拒否されました」のウインドウが立ち上がっても、気にしないで続行しちゃってください。

これで、webpフォーマットの画像を、ドラッグや右クリックからPhotoshopで開くことが可能になりました。

Photoshopを使ってWEBP形式に書き出す方法

いつも通り、書き出しから「web用に保存」だと、インデックスカラー2色みたいな感じになっちゃいます。

いろいろと設定をいじっても白黒のままなので諦めました。

どうも上手くいかないので、普通に別名で保存から、ファイルの種類（保存形式）を「WebPShop（WEBP）」にして保存します。

専用ウインドウが立ち上がって圧縮率などを変更できます。

Previewにチェックを入れると圧縮後の劣化具合が確認できます。

OKを押したらWEBPファイルの書き出し完了です。

Macの場合

基本的にはWindwsと同じなので、上記を参考に頑張ってください。

また、時間があったらMac版PhotoshopでWEBPを開く方法と、WEBPで保存する方法を載せたいと思います。