Site logo

Archived topic

Images not pulling in based on the size of the screen

1 reply · Started by Jennifer on February 10, 2021

Viewing posts 1–2 of 2

Hello,

I am not sure if you can help but maybe you can.

I noticed Wordpress crops all these images to
Thumbnail to 150px
Medium size to 300px

However if your on mobile view it uses the large images I uploaded instead of replacing the image to fit the screen. Why does Wordpress do this if the images are not going to be used? Does your theme need to pull those images in correctly based on the size of the screen?

Any help would be great!
https://developers.google.com/speed/pagespeed/insights/?url=https%3A%2F%2Foceansoulhawaii.com%2F

Hi there,

the browser will select the most appropriate sized image for the current display requirements.
So considering google performs a mobile test on a device of around 360px wide - your mobile image width ( with container padding ) is around 320px.

The 300px image is too small for this purpose so it will grab the next size up. Which is the 768px image.

You can increase the Medium size image to 400px and run the regenerate thumbnails plugin to recreate those image sizes. You should now have an image that large enough for mobile.

Of course in the real world the device maybe a retina screen and then the browser may choose to load an image x2 the size...

This archived topic is closed to new replies.