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.
2. Save a Copy
Go to File > Save a Copy. You can also use Opt + Cmd + S.
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.
Click the Format option.
Choose WebP, near the bottom.
Click Save at the bottom right.
It will open one last WebP Options window:
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.
With our example, the file went from 4.5 MB to 919 KB, an 80% reduction!
Below are the two images for comparison:
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:
- Cloud Convert: Good for small batches. Can convert up to 10 images a day for free.
- Squoosh: Made by the Chrome Team. Can install as a desktop app.
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.
