先日、「10年くらい前に撮影されて加工されたJPEG画像をWebPに変換する」というご依頼がありました。
商品の生地感はそのままで、画像は鮮明に、かつ容量は軽くしたい!
JPEGだと画質を下げるとガビガビになって汚くなってしまう…
でも商品画像は沢山掲載したいので、極力1つ1つの画像は軽くしたい…
そんな時にもってこいなWebP。

しかし一度加工された画像だからか、WebPに変換する際にもJEPGのようにノイズが出てしまったので、今回はその対策をご紹介します。

まずWebPとは

画像の容量がとても軽くなる形式のWebP。

“WebPは、2010年にGoogleが開発した新型の画像ファイル形式です。従来のJPEGやPNGなどの画像ファイル形式に比べて、高い圧縮効率と品質を実現しています。WebPファイルの拡張子は「.webp」と表記され、最近では多くのブラウザやウェブサービスで広くサポートされています。
とくにウェブページの読み込み時間の短縮と画像データの容量削減に効果が高く、これらをカバーしているのが普及の理由です。”
(引用元:「WebPとは?メリットやほかの画像ファイル形式との違い・変換方法を詳しく解説」https://imageflux.sakura.ad.jp/column/webp/)

画像の読み込みが軽くなることでユーザーエクスペリエンスが向上し、SEOにも好影響を与えることができます。

そんな画像形式聞いたことないなぁ、と思っている方も目にしたことはあるかも。
実際に楽天市場では、ご購入者様が閲覧する商品画像はwebP画像に変換された上で表示されています。(楽天のシステムで、JPEG画像でアップした画像が自動的にWebP変換されています)

Photoshopで変換可能

そんなWebP、Photoshopでもバージョン23.2以降は変換できるようになりました。
保存する時に「別名で保存」を選んで、フォーマット形式を「WebP」にして保存するだけ!
Photoshop 別名で保存

▼フォーマット形式にWebPが追加されています。
webP保存画面
ただし画質を下げると、いくら劣化を最小限に抑えることが出来るWebPでも画質が荒くなってしまうことも…

そこで、WebPに変換する前にひと手間加えます!

フィルター機能「JPEG画像のノイズを削除」

「ニューラルフィルター」の「JPEG画像のノイズを削除」フィルターです。
フィルター
▼ニューラルフィルター画面
ニューラルフィルター

気を付けないといけない点が、「ノイズを削除」してしまうので、
やり過ぎると質感まで失われてツルツルになってしまうという点です。
▼赤丸の中が少しぼやけてしまいました。
JPEG画像のノイズを削除 高

プレビューで様子を見ながら「低」にして、
JPEG画像のノイズを削除 低

商品の生地感はそのままで、画像は鮮明に!
そしてJPEGノイズ除去した画像をWebPとして保存すると、
webP保存画面

より容量も軽くなります!

現在サイトに掲載中の画像が、画質は良くない割に表示が重くてお困りの方、ぜひ弊社にご相談ください。
元の撮影画像が残っていれば、今回の手順でお助けできるかもしれません。

 

メルマガ登録