Optimising images for my website - files much larger than theme

Hello,

I'm trying to optimise my images as much as possible to get my site to load quickly. I'm using the Avada theme with the Gym demo. I've noticed their main slider image is 1920 x 1079 and is only 42kb. It's still really sharp and looks great. (its the banner image here: https://avada.theme-fusion.com/gym/)

I'm using an image from 123RF.com that I have cropped to the same size. I have resampled (using automatic setting in Photoshop) to be 72dpi resolution and have then used Save for Web. Even at 60% quality its coming it at around 170kb. When smushed (or using an external optimiser) I manage to get another 3kb off.

Is there anything I am missing here? Why can't I get my image down to similar file size while keeping the quality of the one on the demo file?

Thanks in advance for any tips.

Best wishes,

Graeme

 

Which image (from 123RF) are you talking about? Size's pretty much about resolution as in colors, not width/height of the image.

 

Yes, it was this one. https://www.123rf.com/search.php?word=45880763&imgtype=&Submit=+&t_word=&t_lang=en&orderby=0

 

Thank you!

If (which I doubt) that is the exact image you've been working with, then @ 60% I get 94 KB. That's just reducing the quality w/o any additional stuff.

Is that really the original image that you are trying to size down?

 

I've just realised the original is actually 146kb. I was sent it through from my client. I had to resize slightly and crop to fit the 1920 x 1079 size.

My client sent through the image that was 1678 x 1119 in size. I can't really attach it to this post without infringing on the copyright. I've opened this in Photoshop without cropping, resizing, or reducing resolution, and the 60% version is 146.9kb.

Are there any other techniques I could be using to reduce the file size?

Best wishes,

Graeme

 

Check https://pixlr.com/ Editor. Don't do anything else - just resize.

 

OK. That has reduced it further. Is there anything else I can be doing that I have missed off? I've sized it so its the right size for the theme (so the code isn't resizing it), I've saved for web, and then used Smush It to optimise. Is there a secret task that I have missed off?

 

Hi, Are you done with image optimization or still looking for this job. I'm ready for it please let me know...

 

I'm interested in learning how to do this better if I can, but I'm not looking to outsource the job. If you have any further suggestions I'd be happy to hear them.

 

well, via using photoshop you can optimize images. when you export any image from photoshop a dialog box appears there you can set the quality of image for example high, low, medium using that you can optimize your images...

 

Yes, I am aware of this. Have you read any of the previous posts or even the initial thread?

 

Yea, I did. one more thing for example you have 3000 width x 3000 height image and you want to convert into 800 x 600 then you have to create a new file in photoshop drag n drop the image as you want to resize or optimize... after droping that image in new file you have to transform that image as you have required. after that you can publish into jpg, png etc..

 

Yes, I am fine with doing all that part of it. It was whether there was any extra optimisation I could be doing on top of reducing resolution, resizing, using Save for Web and the various options within, and then using an external tool such as Smush It. It doesn't look like there is.