How to Convert Images to WebP (And Why Your Site Needs It)

I switched my portfolio site to WebP last month. Page load went from 3.2 seconds down to 1.8 seconds. That was it. No server upgrade, no CDN tweak, no code change. Just swapped the image formats.

The whole thing took me maybe 20 minutes for 47 images. I kept the originals as backups and pushed the WebP versions live. Lighthouse score jumped from 64 to 89 on mobile. Kind of ridiculous how big the difference was.

Why WebP is worth the switch

WebP is an image format developed by Google. It compresses images significantly smaller than JPEG and PNG while keeping the same visual quality. Sometimes you can’t even tell the difference side by side.

Here’s what matters: the smaller file size means faster loading. Faster loading means better SEO rankings, lower bounce rates, and happier visitors. Google has been using Core Web Vitals as a ranking factor since 2021, and image optimization is one of the easiest wins you can get.

A few numbers from my own testing:

• JPEG photos shrink by roughly 30 to 50 percent when converted to WebP
• PNG screenshots can drop by 50 to 70 percent
• PNG graphics with transparency see similar or better savings

Every major browser supports WebP now. Chrome, Firefox, Edge, Safari (since version 14, which came out in 2020), Opera. We’re past the “but what about Safari?” concern. Even Safari on iOS handles it fine.

How to convert images to WebP

I use the ImgPrism convert tool for this. It runs entirely in your browser, which means your images never leave your computer. No upload, no server processing, no privacy worry.

Here’s the step by step:

1. Open the tool

Go to imgprism.com/en/convert/. The page loads fast. You’ll see a big drag and drop area right away.

2. Drop in your images

Drag files from your desktop onto that area. Or click it to browse. You can add one image or a whole folder. I’ve tested it with 30 files at once and it handled them all without stuttering.

Supported input formats: JPEG, PNG, BMP, TIFF, GIF, AVIF, and a few others. Basically any common image format works.

3. Pick WebP as the output format

On the right side you’ll see a format dropdown. Select WebP.

4. Adjust the quality slider

This is the important part. The quality slider goes from 1 to 100. I recommend starting at 80. That’s the sweet spot where file size is small but quality looks great on screens.

If you’re converting graphics or logos with sharp edges, try 85 or 90. For photos, 75 to 80 is usually fine. You can always bump it up if you see artifacts.

5. Hit download

Click the download button. If you dropped in multiple files, you get a ZIP. Single files download directly. Done.

The whole process takes about 10 seconds per image. Maybe less if you’re doing a batch.

Batch conversion tips

Converting one image at a time is fine for a quick fix. But if you’re working on a real project, you probably have dozens of images. Here’s how I handle that.

Drop all your images in at once. The tool processes them in parallel. You don’t have to wait for one to finish before adding the next.

Keep the quality setting consistent across the batch. Mixing 70 and 90 quality levels makes it hard to maintain a predictable file size budget. I stick with 80 for photos and 85 for anything with text or sharp lines.

Name your files clearly before converting. The tool keeps your original filenames and just swaps the extension. So hero-photo.jpg becomes hero-photo.webp. Clean and predictable.

Always keep the originals. I make a folder called originals and move the source files there before I start converting. WebP is widely supported, but having the JPEG or PNG backup is good practice.

File size comparison: before and after

I ran a test on three typical images to show real numbers. Quality slider was set to 80 for all three. Same images, same visual output as far as my eyes can tell.

Image	Format	Original Size	WebP Size	Savings
Landscape photo (4000x3000px)	JPEG	2.1 MB	1.2 MB	43%
App screenshot (1440x900px)	PNG	890 KB	340 KB	62%
Company logo with transparency (800x400px)	PNG	45 KB	18 KB	60%

The PNG screenshot result surprised me the most. 890 KB down to 340 KB is a huge drop. That’s the kind of thing that actually changes how fast a page feels when someone visits it on their phone.

Common questions

Does converting to WebP lose quality?

Technically yes, WebP is a lossy format at most quality settings. But at quality 80, the difference is almost invisible. I compared originals and WebP versions side by side on a calibrated monitor and genuinely could not tell them apart. If you need pixel-perfect output, use quality 100 or stick with PNG.

What about Safari?

Safari has supported WebP since version 14, released in September 2020. That covers iOS 14 and macOS Big Sur and everything after. Unless you’re targeting very old devices, Safari is not a problem.

Can WebP handle transparency like PNG?

Yes. WebP supports alpha channel transparency. Your logos and graphics with transparent backgrounds will work exactly the same way.

What do I do with animated GIFs?

WebP supports animation too. You can convert an animated GIF to animated WebP and get a much smaller file. The convert tool handles this automatically when you feed it an animated GIF.

Do I need to change my HTML?

Just swap the file extension in your src attributes. <img src="photo.jpg"> becomes <img src="photo.webp">. If you want to serve WebP to modern browsers and JPEG as a fallback, you can use the <picture> element with a <source> tag. But honestly, with browser support above 97 percent globally, a simple swap works for most sites.

Related tools

Once you’ve converted to WebP, you might want to squeeze out even more savings:

• Compress images to further reduce file size without changing format
• Resize images if your images are larger than needed for their display size

Both run in the browser, both free, both private. Same as the convert tool.