How do you make WebP images for your website? (With video)

How to make WebP images

The quickest way to convert photos and images to WebP.

In my blog about the best and fastest images on your website I go into detail about images. But that guide may be too detailed for you, or you may want to get started straight away. So here I explain in a few minutes how to make WebP images.

In the video

00:00 About the dimensions of your images
02:16 Converting and saving files one by one with Squoosh
03:12 Converting and saving several files at once with ShortPixel (my favourite)


The details

Image dimensions for a website or newsletter:

Full screen width (large)2200 pixels wide (max 2560)
Content width (medium)1400 pixels wide
1/2 Content width (small)800 pixels wide (enough for newsletters)

Free online tools to generate the best files:

Squoosh https://squoosh.app/
ShortPixel https://shortpixel.com/online-image-compression

When do you use jpg instead of WebP?

WebP is currently the best file format for the web and is supported by almost every browser. Still running into problems? Then you can always fall back on jpg. So choose WebP first and make your website or newsletter faster. ShortPixel's online image converter gives you the jpg as well, which is very handy.


Ready? Watch the video now


Deshna van Aarssen

Stuck, or would you rather I sorted this out for you instead of working it out yourself?
Book a free introduction or take a look at what I can do for you.

Get the new blog posts automatically.

Sign up for the newsletter. I only send you news worth reading, no funnels and no spam. Promise!

Enter your name
Could you tick this box?

Read next:

AI privacy settings you really want to check (or rather, uncheck)

All blogs, Tips & Tricks

Do you actually know what happens to your data by default? Read how to set up your AI tools more safely with a few simple clicks.

When should you update to Divi 5?

All blogs, Divi 5

Divi 5 is finally available to everyone with a Divi website. But when is updating a smart move? This is my advice.

Divi 5 is finally here: what does that mean for you?

All blogs, Divi 5

Divi 5 launches officially on 26 February 2026. Read what this means for your website.

10 top tips for your website

All blogs, Tips & Tricks

Whether you are building a new website or want to improve the one you have, these tips will help you work out what matters. Simple, but valuable.

Solving caching problems

All blogs, Tips & Tricks

What do you do when your website does not look right on your screen? Here you can read what cache is and how to solve cache problems on your Divi website.