elihertig.com

Still using JPG for website? Change to WEBP or AVIF!

WebP and Avif formats
WebP format, light and high quatity, the way to upload images to your website. Here I tell you how to do it online or in Adobe Photoshop.

Google recommends to change image formats to WEBP or AVIF a better format which is lighter and maintains the same quality in your website.

Avif will be available further on, but you can start with WebP format for WordPress and search other solutions as mentioned in this article: Issues with Avif format in WordPress

So for now Photoshop new version in 2023, allows to “export” in WebP format.

How you can do this is in Windows operating system, in Photoshop open the File menu > Save as a copy… > Choose WebP format

1. Open the file menu and choose save as a copy.
Second step, image to export in WebP format with Photoshop.
2. In the saving window, choose WebP format from the drop-down menu.
Last step, set the quality output of the WebP format.
3. Finally, set how big the size shall be, if it does not need any high resolution I recommend putting lossy to a minimum quality.

 

Here is how you can do it via online:

  1. Donwnload all your website images, or if you have them already stored in your PC or Mac, you can skip this step.
  2. Convert online all your PNG, JPG to WEBP (there are many services, Convertio is an option)
  3. Upload all the images again to your website.
  4. Check your website performance to see better results.

And here is how to install the WEBP file format in Adobe Photoshop:

  1. Download all your website images or if you have hem already stored in your PC or Mac, you can skip this step.
  2. Install the WebP extension for Adobe Creative Cloud.
  3. Export all your PNG, JPG to WEBP or X (there are many services, Convertio is an option)
  4. Upload all the images again to your website.
  5. Check your website performance to see better results.

What you get is a faster website, this is then the new way to use images in your website.

There are much more details to have in mind to get a good website experience, here I tell you about the basics.

Share:

Facebook
Twitter
LinkedIn
Email

Social Media

Most Popular

Categories

On Key

Related Posts