1. Advertising
    y u no do it?

    Advertising (learn more)

    Advertise virtually anything here, with CPM banner ads, CPM email ads and CPC contextual links. You can target relevant areas of the site and show ads based on geographical location of the user if you wish.

    Starts at just $1 per CPM or $0.10 per CPC.

Optimising images for my website - files much larger than theme

Discussion in 'Graphics & Multimedia' started by Boxwell, Jul 2, 2017.

  1. #1
    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/)
    SEMrush
    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
     
    Boxwell, Jul 2, 2017 IP
    SEMrush
  2. Blank ™

    Blank ™ Well-Known Member

    Messages:
    224
    Likes Received:
    18
    Best Answers:
    6
    Trophy Points:
    110
    #2
    Which image (from 123RF) are you talking about? Size's pretty much about resolution as in colors, not width/height of the image.
     
    Blank ™, Jul 2, 2017 IP
  3. Boxwell

    Boxwell Greenhorn

    Messages:
    23
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    21
    #3
    Yes, it was this one. https://www.123rf.com/search.php?word=45880763&imgtype=&Submit=+&t_word=&t_lang=en&orderby=0
     
    Boxwell, Jul 2, 2017 IP
  4. Blank ™

    Blank ™ Well-Known Member

    Messages:
    224
    Likes Received:
    18
    Best Answers:
    6
    Trophy Points:
    110
    #4
    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?
     
    Blank ™, Jul 2, 2017 IP
  5. Boxwell

    Boxwell Greenhorn

    Messages:
    23
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    21
    #5
    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
     
    Boxwell, Jul 2, 2017 IP
  6. Blank ™

    Blank ™ Well-Known Member

    Messages:
    224
    Likes Received:
    18
    Best Answers:
    6
    Trophy Points:
    110
    #6
    Blank ™, Jul 2, 2017 IP
  7. Boxwell

    Boxwell Greenhorn

    Messages:
    23
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    21
    #7
    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?
     
    Boxwell, Jul 3, 2017 IP
  8. semvalley

    semvalley Active Member

    Messages:
    331
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    51
    #8
    Hi, Are you done with image optimization or still looking for this job. I'm ready for it please let me know...
     
    semvalley, Jul 5, 2017 IP
  9. Boxwell

    Boxwell Greenhorn

    Messages:
    23
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    21
    #9
    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.
     
    Boxwell, Jul 5, 2017 IP
  10. semvalley

    semvalley Active Member

    Messages:
    331
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    51
    #10
    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...
     
    semvalley, Jul 5, 2017 IP
  11. Boxwell

    Boxwell Greenhorn

    Messages:
    23
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    21
    #11
    Yes, I am aware of this. Have you read any of the previous posts or even the initial thread?
     
    Boxwell, Jul 5, 2017 IP
  12. semvalley

    semvalley Active Member

    Messages:
    331
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    51
    #12
    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..
     
    semvalley, Jul 5, 2017 IP
  13. Boxwell

    Boxwell Greenhorn

    Messages:
    23
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    21
    #13
    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.
     
    Boxwell, Jul 5, 2017 IP