How to Convert Images to WebP with Photoshop

event

Published

event_available

Updated 4/22/2024

Find a simple process for converting images to WebP using Photoshop. While it is easy, it isn’t straightforward and it comes with a few menus.

photoshop convert to webp featured image - robot converting stuff

WebP is an image file format that’s great for the web. It’s capable of high image quality with low file size, beating traditional formats like JPG and PNG.

With Photoshop, you can easily convert images to WebP, but the process isn’t straightforward. Follow these steps to convert images for the web.

Process

Follow along with these steps to convert a larger image file to WebP.

1. Open The Image

Open the image in Photoshop. Once Photoshop is running, you can use Cmd + O to choose the image.

open image in photoshop - futuristic turtle and rabbit racing

2. Save a Copy

Go to File > Save a Copy. You can also use Opt + Cmd + S.

File > Save a Copy

Name the file and choose a location to save it.

Photoshop will automatically add “copy” to the end of the file name, so remove that if you don’t want it.

name the file

Click the Format option.

click Format

Choose WebP, near the bottom.

choose WebP

Click Save at the bottom right.

click Save

It will open one last WebP Options window:

WebP Options for saving

Enter your preferred settings. We recommend Lossy with Quality at 100.

Click OK.

Result

Once complete, you should have your original image, plus a WebP version.

png and webp files

With our example, the file went from 4.5 MB to 919 KB, an 80% reduction!

Below are the two images for comparison:

robot turtle and rabbit racing
Original PNG
robot turtle and rabbit racing webp
WebP Version

Spot the differences if you can, but the speed improvement is absolutely worth it.

Converting Multiple Files

But what if you want to do a whole folder? It’s much trickier.

You have to create an action in Photoshop, then save it using the Batch feature. It’s a complicated process that requires a bunch of fiddling, and we don’t recommend it.

There are other ways, like online tools that speed up the conversion process:

Hopefully, Adobe will simplify it and provide better WebP support.

Bottom Line

Photoshop supports WebP files and can convert other files like PNG and JPG, but the process isn’t straightforward. Instead of traditional export or save options, you need to open the file you want to convert and use the Save a Copy command.

Use this technique to convert images for the web, resulting in a faster page speed, a better user experience, and improved SEO.

Get Powerful Templates

Streamline your content management
with dynamic templates and tools.