Question about how various images work

Hi there, I’m hoping to speed up my site a bit and it seems to get bogged down by the way certain images are selected. Here’s the note I got back:

I’ve tested on my site and seems that pulling an image to be used as background that has the actual size that’s been displayed solves the issue. So, in this case, I suggest you contact your theme developer and to inform about this so he/she can prepare the images that will be used as background at the actual size that’s being displayed.

I can’t discern if they are asking me to ask you to change your theme or if they are asking me to make this happen on my end. As a disclaimer, I’m not asking anyone to go “beyond the scope of support” and do this - only if it’s something I can make happen.

Thanks!

all the best

Hi There,

Thanks for writing in!

In the theme there is no image used for background, so there is nothing to change in our end.
Regarding image optimization, you can use plugins to optimize the image for faster download and also you can optimize the image in photoshop upload it for background use.

Hope this is clear!

Thanks

I know about using plugins. It’s not working with the theme. The message I copied is from the plugin developer. Again, I want to say that I am not asking for customization from you, only if I can do what I was told to do in that quote I gave you.

Maybe this makes no difference, but this is what I mean:

Hi,

We actually have a guide on how you can optimize your images and improve your site performance.

Kindly refer to the link below

Hope that helps.

No, it doesn’t help at all. WP Smush Pro is the plugin I’m using and according them, there is a conflict, per the text I have copied and pasted. They told me to contact my theme developers because they say the problem is on “their end”.

I’m stuck in the endless loop of “it’s them - nope not us them”.

I think we are at an impasse here. I have no idea what to do, but I will continue to try work it out.

Thanks for responding.

Hi there,

If an image is smaller than registered image sizes (registered image sizes are usually big to cover retina displays and mobile devices with larger DPI).

But, you can override that behavior by adding this code to your child theme’s functions.php

  function x_get_featured_image_url( $size = 'thumbnail' ) {

    $featured_image     = wp_get_attachment_image_src( get_post_thumbnail_id(), $size );
    $featured_image_url = $featured_image[0];

    return $featured_image_url;

  }

It will default to thumbnail size instead of full. But, it would only good for devices you’re optimizing it, it may look pixelated on other larger devices. If you’re just worried about serving large images, then you should only upload the optimized images with good quality (instead of small images). Then use CDN to serve your images, for faster distribution of asset files.

Thanks!

I am still not sure we are talking about the problem I’m having.

Is it possible to add code that will register custom image sizes according to the frame sizes used in this theme - and then with code, pull the appropriate image size to be shown in those frames? In the example I show you: on my blog page, you can see a small image for every article. Even though the image itself appears small, the theme is actually using an image that 762 x 418.

Thanks again for your help…

Hey @Jesamine,

I understand your problem. In the screenshot below, the size of the thumbnail area is 280x180px in desktop.

But, the actual image is 1200x800px. That is in a regular desktop view. If you’ll view your site in a retina enabled device, that area would be bigger and retina enabled devices require double the image size for clarity.

Setting an image size for the thumbnail is technically possible. But, it would be quite complex because as I said above, the featured image area size varies so you need to take into account a lot of sizes. Doing so would require drastic customization.

I understand that speed testing tools will flag this as an issue but this has very little effect on the actual speed of the site and what’s important is, what your users actually feel. If you view your site and it loads quickly, that is what I mean and I know that because the Ethos 1 demo loads fast on my end.

If the speed recommendation is really important to you, you will want to consider switching to the Integrity stack as it uses the HTML image element to display the featured image.

Thank you for understanding.

Thanks!! I trust what you’re saying. I’ll stay with my theme and ignore what the plugin is saying to me. The score I’m getting from it doesn’t make sense.

all the best…

You are most welcome!
If you need anything else we can help you with, don’t hesitate to open another thread.

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.