Automatic Resizing for .webp Images

[andrewv86]

Now that the latest versions of Safari, Chrome, Edge, and Firefox all have compatibility with the .webp image format, it would be really good to have automatic image resizing for that format so that we can remove the "Serve images in next-gen formats" warning on PageSpeed Insights.

[andrewv86]

Thank you for the feedback everyone! Moving this to “in planning” as we are working on automatic image resizing for .webp images.

[andrewv86]

Hi all, 

I wanted to provide a quick clarification. Currently we automatically serve images in WebP format for browsers that support it (with a few exceptions, such as GIFs). If you are still seeing the recommendation in Google PageSpeed Insights to "serve images in next-gen formats" it is because the conversion happens server side and the file extension in the URL does not change. However, you should still see an improvement in performance because of the image conversion. You can learn more about this feature in our developer documentation here.

If this solution doesn't meet your needs, please don’t hesitate to share your feedback on this thread. It greatly helps us understand your needs so we can build a better HubSpot.

Thanks!

[flipflopflower3]

And to further Andrew's idea, it would be great if HubSpot had a CDN that enabled us to serve WebP graphics by default to browsers that support it and automatically serve the original .jpg or .png to browsers that don't support WebP. WordPress can do this, but unless I'm mistaken HubSpot cannot.

[Esther_ISM]

Would be great! 

[velliott]

Hi all, 

I wanted to provide a quick clarification. Currently we automatically serve images in WebP format for browsers that support it (with a few exceptions, such as GIFs). If you are still seeing the recommendation in Google PageSpeed Insights to "serve images in next-gen formats" it is because the conversion happens server side and the file extension in the URL does not change. However, you should still see an improvement in performance because of the image conversion. You can learn more about this feature in our developer documentation here.

If this solution doesn't meet your needs, please don’t hesitate to share your feedback on this thread. It greatly helps us understand your needs so we can build a better HubSpot.

Thanks!

[andrewv86]

Hi Velliot,

Thank you for the clarification, that gives a lot of insight into how HubSpot manages images. It's good to know that you guys are staying on top of the game when it comes to web technologies.

The improvement in performance is always going to be a key part of how Google measures website optimisation, however (for SEO) if we are being ranked based on the kinds of image formats being used, then wouldn't it be important to make sure formats are exactly what they are? It would be nice if they are .webp images, that they are served with that extension.

More related to the issue, I'm hoping to use .webp images natively uploaded to the file manager instead. This works for the most part, however hubspot doesn't provide support for automatic image resizing for this image format. Is that something that we could potentially see in the future?

Cheers

[Sjardo]

Simply what  @andrewv86 says, we need to have it in the Source. 

1. Upload image
2. Create different image sizes
3. Optimise 
4. Convert to webp

[cacosta]

Thank you for the feedback everyone! Moving this to “in planning” as we are working on automatic image resizing for .webp images.

[gshaw]

Does anyone have a good fix for this in the meantime? Really seeing my site suffer due to image size/mobile speed. Would love to know if you have any suggestions for a bandaid fix.  If that's mannually updating all the images to  .webp, what did you use to convert?

[KMG2]

Any update on this? I am still getting this issue in Page Speed Insights where the images and their file type is not webp. So that means that those images are not converted to webp format (not even in server side) right? Why some images are not converted to webp while some are? Any answer to this?

[Sjardo]

@KMG2 For now there is no update on this topic, besides uploading the webp images yourself.

I would like to say that you can achieve great PSI scores, even if this issue is still relevant. Yet, RUM scores are way more important!

Checkout the latest site i have developed with my team at Bureau Vet : https://www.rready.com/

We get a 100% score on desktop and a 95% score on mobile. (PSI)

Also our own site with a bunch of HS tracking, cta and images, gets a nice 100% score for desktop and 95% on mobile. (PSI)

Please let me know if you have any questions related to page speed 🙂 

 

[KMG2]

@Sjardo yea it seems like I have to upload webp images manually. What made me disappointed is that hubspot knowledge center claims that hubspot would handle image optimization in an efficient manner, but it doesn't which happened in my project and hence I will have to upload optimized webp format images on my own. Also there is no plugin or application that would handle this optimization automatically (like in Wordpress where there are plugins to handle this) if incase hubspot fails to optimize any images. Hope after this 'manual' image optimization, the page score would improve.

[Sjardo]

@KMG2 Sadly, what HubSpot says and does are two different things, thats why I do some experiments around these sorts of things.

WebP images are not by default better, smaller of faster. The HS Algorithm does a calculated check and decides if it has to transform the image. And still, when HubSpot optimizes an image for you , you can probably do it better yourself for the best results.

If you want full controle, i suggest using Cloudinary or an other third party where you can set a bunch of settings to get the maximum out of the images you try to (automaticly) optimize.