Go to main content

Textpattern CMS support forum

You are not logged in. Register | Login | Help

#1 2021-07-17 06:39:00

colak
Admin
From: Cyprus
Registered: 2004-11-20
Posts: 9,071
Website GitHub Mastodon Twitter

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

#2 2021-07-17 07:36:44

philwareham
Core designer
From: Haslemere, Surrey, UK
Registered: 2009-06-11
Posts: 3,564
Website GitHub Mastodon

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

#3 2021-07-17 07:51:05

phiw13
Plugin Author
From: Japan
Registered: 2004-02-27
Posts: 3,138
Website

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

#4 2021-07-17 10:16:48

colak
Admin
From: Cyprus
Registered: 2004-11-20
Posts: 9,071
Website GitHub Mastodon Twitter

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

Board footer

Powered by FluxBB