Textpattern CMS support forum
You are not logged in. Register | Login | Help
- Topics: Active | Unanswered
explicit width and height on srcset
Why do pagespeed insights complain about not having explicit dims in srcsets? Wherever I look they are not needed, unless of course I am looking at the wrong places. Is my html below wrong?
<img loading="lazy"
srcset="/default.jpg 480w, /maxres.jpg 1280w"
sizes="(max-width: 600px) 480px, 960px"
src="/default.jpg" alt="alt here"
class="my_grid" />"
itemscope itemtype="http://schema.org/ImageObject" />Yiannis
——————————
NeMe | hblack.art | EMAP | A Sea change | Toolkit of Care
I do my best editing after I click on the submit button.
Offline
Re: explicit width and height on srcset
It’s to prevent Content Layout Shift (CLS). Setting an explicit width and height tells the browser the correct dimensions to render before the image is downloaded and decoded.
So, while not a requirement for that tag to work, it is recommended to set the dimensions.
Offline
Re: explicit width and height on srcset
philwareham wrote #331035:
It’s to prevent Content Layout Shift (CLS). Setting an explicit width and height tells the browser the correct dimensions to render before the image is downloaded and decoded.
So, while not a requirement for that tag to work, it is recommended to set the dimensions.
it also (perhaps more importantly) tells the browser the aspect-ratio of the image. The browser can then compute the space needed based on both the sizes (expected width) and the width and height (the sizes attribute does not tell anything about the latter).
Where is that emoji for a solar powered submarine when you need it ?
Sand space – admin theme for Textpattern
Offline
Re: explicit width and height on srcset
Thanks guys. Now I have to figure a way to call the sizee remote images. Possible json will be of help.
Yiannis
——————————
NeMe | hblack.art | EMAP | A Sea change | Toolkit of Care
I do my best editing after I click on the submit button.
Offline