client's site was getting flagged for missing width/height attributes on every single image. chrome devtools shows it fine but gsc is still screaming about layout shifts. people think it's just a css issue. it isn't. if the browser doesn't know the aspect ratio before the pixels load, you're dead. i checked the srcsets and they were basically useless for preventing cls. found this fix for their template engine.
<img src="image.jpg"width="800"height="600"alt="description">
just hardcode the dimensions in the html. it doesn't matter if your css makes it responsive with width: 100% and height: auto. the browser needs those intrinsic dimensions to reserve the space. i've seen too many devs skip this because they think modern browsers are smart enough. they aren't.
>modern browsers handle layout automatically is a lie. it's just more work for us when gsc starts reporting massive cls spikes. use the attributes or stop complaining about core web vitals scores. ignore it fix it.