@nbagonoc,
I thought about appending an image size to the url which you could do if you were using HubL. Honestly I don’t know much about that but after looking I don’t think that Hubspot is set up for that. Even if it worked I doubt it would compress the image, just resize it. Maybe somebody who know something about that could chime in.
I think I can help you though. It’s not the fix you are looking for, but I do not a lot about image optimization. The fact is that most websites make very critical mistakes with there images. They find stock images for their pages and blogs, download them, add them to their cos, and use them on the page. Most stock images are several thousand pixels wide and tall, weighing in at between 2mb and 20+mb, and they are used in a 800px by 600px area or around there.
1. Optimize image size – you can use Photoshop, Gimp, Pixler or dozens of other free and paid image editors to resize your images. Use a tool like page ruler (chome), and measure the largest version of the largest area the image will be used in. You just need the width, when you resize the image adjust the height proportionately. When you resize your image, use whatever version of “slice for web” that your image editor has and save the image as a progressive jpg. If it needs a clear background you can use png but try to use jpg and make it progressive. save it at the lowest possible quality you can without losing visual quality.
2. Optimize file size – After you have a perfectly sized image you can use image compression software to optimize the file size. Luckily there are tons of browser based softwares that don’t require downloading.
compressor.io – This one is mainly for png images in my opinion, but it will optimize jpg and gif too. You just want to check the end file size to esure that it is smaller.
jpeg-optimizer.com – this is the best jpg compressor I have found. It allows you to choose compression level and even resize the image (resize down, never resize up). You don’t really need to use an image editor to resize with this, but I do anyways to slice to web. You can hit the back button to change the compression level until you find a quality vs size ratio that you are comfortable with.
Here’s an example:
Image from Pixabay.com – 378 KB 1920 x 1280
Image after jpeg optimizer – 50.1 KB 800 x 533
Image after Photoshop (resize and resolution change to 72) – 22.5 KB 800 x 533
That’s 86.7% file size reduction on jpeg optimizer and 94%, the image is sized for use on most any blog, and it is smaller than the thumbnails on most websites.
I know this isn’t what your asking for, but my point is that if you reduced the images on your site to thier smallest possible size then, using modern internet and computers, load time should no longer be an issue. Think about the math there of 378KB vs 22KB. You could load this image 17.18 times at 22KB in the time it takes you to load it once at 378KB. Yes it’s a pain to optimize every photo you use, but I feel like it should be a law.